Skip to content
Snippets Groups Projects
Commit 1055f71d authored by Gabriel Copat's avatar Gabriel Copat
Browse files

Styling Updates

parent 45d2329c
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
src/main/resources/static/css/allTrails.css
+ 14
− 15
View file @ 1055f71d
......@@ -2,13 +2,22 @@
box-sizing: border-box;
}
body {
background-color: rgb(41, 41, 41);
/*background-color: rgb(41, 41, 41);*/
background-color: #40116b;
margin: 0;
display: flex;
flex-direction: column;
min-height: 100svh;
}
main {
background-color: rgba(41, 41, 41, 0.84);
width: 95vw;
border-radius: 2vw;
margin: auto;
margin-top: 2svh;
padding-top: 4svh;
padding-bottom: 4svh;
box-shadow: rgba(0, 0, 0, 0.51) 0 0 30px;
}
.centerFlex {
......@@ -47,15 +56,6 @@ main {
0% { opacity: 0; }
100% { opacity: 1; }
}
main {
margin: 0;
}
#trailInfoContainer {
overflow: scroll;
}
.trailInfoFrag {
background-color: rgb(84, 33, 128);
border: #000000 solid 2px;
......@@ -114,7 +114,6 @@ main {
line-height: 1.5;
width: fit-content;
height: fit-content;
overflow: scroll;
}
}
......@@ -128,7 +127,7 @@ main {
}
header {
box-shadow: #1e1e1e 0 0 10px 10px;
font-size: 1vw;
}
/*header {*/
/* box-shadow: #1e1e1e 0 0 10px 10px;*/
/* font-size: 1vw;*/
/*}*/
src/main/resources/static/css/templatingstyle.css
+ 82
− 31
View file @ 1055f71d
body {
/*background-color: rgb(41, 41, 41);*/
background-color: #40116b;
margin: 0;
display: flex;
flex-direction: column;
min-height: 100svh;
}
main {
background-color: rgba(41, 41, 41, 0.84);
width: 95vw;
border-radius: 2vw;
margin: 4svh auto;
padding-top: 4svh;
padding-bottom: 4svh;
box-shadow: rgba(0, 0, 0, 0.51) 0 0 30px;
}
/* Header */
.headerBar {
border-bottom: 2px rgb(230, 230, 230) solid;
/*border-bottom: 2px rgb(230, 230, 230) solid;*/
margin-bottom: 20px;
display: flex;
background-color: rgb(84, 33, 128);
}
/* Navbar Links */
.navBar {
display:flex;
flex-direction: column;
margin: 2svh 1vw 2svh auto;
text-align: right;
align-content: center;
background-color: rgba(41, 41, 41, 0.5);
box-shadow: rgba(0, 0, 0, 0.51) 0 0 30px;
border-radius: 1vw;
padding:0;
& select {
margin-left: 5vw;
margin-right: 0.5vw;
}
}
.work{
color: rgb(255, 255, 255);
margin-left: 5vw;
margin-right: 0.5vw;
}
.navBar ul {
list-style: none;
display: flex;
margin-left: 100px;
margin-left: 5vw;
& li {
background-color: #36454F;
border-radius: 1vw;
padding: 0.5vw;
box-shadow: rgba(0, 0, 0, 0.51) 0 0 5px;
}
}
.navBar a {
/*border-left: 2px rgb(185, 185, 185) solid;*/
/*padding: 10px 40px;*/
padding-left:5px ;padding-right: 5px;
text-decoration: none;
/*color:rgb(87, 86, 86);*/
/*// original color*/
color:white;
white-space: nowrap;
overflow: hidden;
float: right;
}
.navBar a:hover {
.navBar ul li:hover {
background-color: rgb(209, 209, 209);
}
.navBar li{
......@@ -51,10 +85,14 @@
margin-left:10px;
padding: 20px;
width: fit-content;
}
.Logo img {
width: 120px;
margin-left:15px;
& img {
width: 120px;
margin-left:15px;
box-shadow: rgba(0, 0, 0, 0.51) 0 0 30px;
border-radius: 1vw;
}
}
/* Footer */
......@@ -62,17 +100,18 @@ footer {
margin-top:auto;
display: flex;
justify-content: center;
background-color: rgb(84, 33, 128);
border-top: 2px rgb(230, 230, 230) solid;
margin: 0 2vw;
/*background-color: rgb(84, 33, 128);*/
/*border-top: 2px rgb(230, 230, 230) solid;*/
font-size: 1vw;
}
.footerBar{
flex: 1 1;
text-align: left;
display: flex;
margin: 0;
padding: 0;
color: rgb(255, 255, 255);
padding-left: 30px;
}
.footerBar ul {
list-style: none;
......@@ -84,21 +123,33 @@ footer {
}
.containerFooter{
display: flex;
flex-direction: row;
}
.leftFooter{
flex:1;
color: rgb(255, 255,255);
}
.centerFooter{
flex: 1;
color: rgb(255, 255,255);
}
.rightFooter{
flex:1;
color: rgb(255, 255, 255);
flex: 1 1;
width: 80%;
justify-content: space-between;
border-radius: 1vw;
background-color: rgba(58, 58, 0, 0.81);
padding-top: 1svh;
padding-bottom: 1svh;
& ul li{
flex:1;
color: rgb(255, 255,255);
}
}
/*.leftFooter{*/
/* flex:1;*/
/* color: rgb(255, 255,255);*/
/*}*/
/*.centerFooter{*/
/* flex: 1;*/
/* color: rgb(255, 255,255);*/
/*}*/
/*.rightFooter{*/
/* flex:1;*/
/* color: rgb(255, 255, 255);*/
/*}*/
/*CHANGES*/
.headerBar, .footerBar{
......
src/main/resources/templates/towns/Templating.html
+ 10
− 11
View file @ 1055f71d
......@@ -23,22 +23,22 @@
</header>
<div class="footerBar" th:fragment="footer">
<div class="containerFooter">
<div class="leftFooter">
<ul class="containerFooter">
<li class="leftFooter">
<h3>VZTA</h3>
Near Me Now LTD
<br>Britania House
<br>Caerphilly Business Park
<br>Caerphilly
<br>CF83 3GG
</div>
<div class="rightFooter">
</li>
<li class="rightFooter">
<h3>Connect with us</h3>
<p>Be the first to know about updates by joining out Community page</p>
(C) VZTA 2022<br>
Policy Terms and Conditions
</div>
<div class="centerFooter">
</li>
<li class="centerFooter">
<span class="footerText">
<h3>Follow Us</h3>
<a href="https://www.facebook.com/VZTAsmarttowns/" class="icon"><img src="/images/Facebook.png" height="25" width="25" alt="Facebook Logo" class="icon"/></a>
......@@ -46,11 +46,10 @@
<a href="https://www.instagram.com/vztasmarttowns/" class="icon"><img src="/images/Instagram.jpg" height="25" width="25" alt="Instagram Logo" class="icon"/></a>
<a href="https://www.linkin.com/company/vztasmarttowns/" class="icon"><img src="/images/Linkedin.png" height="25" width="25" alt="Linkedin Logo" class="icon"/></a><br>
</span>
</div>
<div class="copyright" style="text-align: left">
</li>
<li class="copyright" style="text-align: left">
</div>
</div>
</div>
</li>
</ul>
</div>
<!--&gt;>>>>>> main-->
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment