fixed empty space at bottom of toolbar

This commit is contained in:
th3keyboard 2024-11-10 11:02:11 -06:00
parent b9153998f1
commit b85edc2ca1
3 changed files with 40 additions and 8 deletions

View file

@ -16,8 +16,8 @@ html, body {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center;
background-color: var(--utsa-orange); background-color: var(--utsa-orange);
height: 100vh;
} }
.navbarCont { .navbarCont {
@ -25,7 +25,7 @@ html, body {
background-color: var(--utsa-blue); background-color: var(--utsa-blue);
width: 100%; width: 100%;
text-align: center; text-align: center;
margin-bottom: 10px; margin-bottom: 10vh;
} }
.navbarCont a { .navbarCont a {
@ -33,7 +33,7 @@ html, body {
text-align: center; text-align: center;
padding: 12px; padding: 12px;
text-decoration: none; text-decoration: none;
color: #e67e22; color: var(--utsa-orange);
} }
.navbarCont a.icon { .navbarCont a.icon {
@ -46,7 +46,6 @@ html, body {
.navbarCont a.rightB { .navbarCont a.rightB {
float: right; float: right;
display: inline-block;
padding: 20px; padding: 20px;
margin: 0; margin: 0;
color: #ecf0f1; color: #ecf0f1;
@ -78,6 +77,7 @@ html, body {
background-color: var(--utsa-blue); background-color: var(--utsa-blue);
width: 100%; width: 100%;
height: auto; height: auto;
margin-top: 11vh;
} }
.toolbarItems { .toolbarItems {
@ -105,12 +105,40 @@ html, body {
canvas { canvas {
background-color: white; background-color: white;
margin: 20px; margin: 20px;
align-self: center;
height: 500px;
width: 500px;
image-rendering: pixelated; image-rendering: pixelated;
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
.navbarCont a.title {
font-size: 18.5px;
padding-left: 0px;
}
.navbarCont img {
width: 80%;
}
.navbarCont {
position: relative;
background-color: var(--utsa-blue);
width: 100%;
text-align: center;
margin-bottom: 11vh;
}
.navbarCont a { .navbarCont a {
/* possible hamburger menu for moblie users*/ /* possible hamburger menu for moblie users*/
position: absolute font-size: 10px;
}
canvas {
background-color: white;
margin: 20px;
align-self: center;
height: 500px;
width: 500px;
} }
} }

View file

@ -16,8 +16,8 @@
<a class="icon" href="./index.html"><img src="navbarlogo.png"></img></a> <a class="icon" href="./index.html"><img src="navbarlogo.png"></img></a>
<a class="title" href="./index.html">ThePlaceHolders</a> <a class="title" href="./index.html">ThePlaceHolders</a>
<a class="rightB" href="./contact.html">Contact</a> <a class="rightB" href="./contact.html">Contact</a>
<a class="rightB">Login</a> <a class="rightB" href="./login.html">Login</a>
<a class="rightB">Settings</a> <a class="rightB" href="./register.html">Register</a>
</div> </div>
<!--note to self: below IS the canvas--> <!--note to self: below IS the canvas-->
<!--<div class="canvasCont">--> <!--<div class="canvasCont">-->

View file

@ -1,3 +1,7 @@
:root {
--utsa-orange: #f15a22;
--utsa-blue: #0c2340;
}
body { body {
margin: 0; margin: 0;
} }