diff options
Diffstat (limited to 'Static/Css/navbar.css')
| -rw-r--r-- | Static/Css/navbar.css | 128 |
1 files changed, 128 insertions, 0 deletions
diff --git a/Static/Css/navbar.css b/Static/Css/navbar.css new file mode 100644 index 0000000..327cde8 --- /dev/null +++ b/Static/Css/navbar.css @@ -0,0 +1,128 @@ + +.showNav { + top: 0vh !important; +} + +.navLinkClicked { + transform: scale(1.2) rotate(90deg); + color: var(--mainSiteColor) !important; +} + +.headerInfoAdmin { + color: darkblue; +} + +.headerInfoPro { + color: brown; +} + +.headerInfoClient { + color: darkolivegreen; +} + +header { + z-index: 1; + display: flex; + justify-content: space-around; + height: 10vh; + text-align: center; + background-color: var(--headerBg); + border-top: var(--mainSiteColor) solid 6px; + border-bottom: var(--mainSiteColor) solid 3px; +} + +header h2 { + font-family: akira; + color: var(--mainSiteColor) !important; + margin: 0px; +} + +header a { + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; + flex-grow: 1; + color: var(--navbarTextColor); + text-decoration: none; + transition: all 0.1s ease-in-out; +} + +header form { + display: flex; + flex-direction: column; + justify-content: center; + flex-grow: 1; +} + +header a:hover { + transform: scale(1.1); +} + +header i { + all: revert; + margin-right: 0.4em; + font-size: var(--fontSizeI); +} + +header a:first-child { + border-right: 3px solid var(--mainSiteColor); + background-color: var(--navBg); +} + +header a:first-child:hover { + transform: none; +} + +header a:first-child i { + color: #404040; + font-size: var(--fontSizeLarge); + margin: 0px; + transition: all 0.1s ease-in-out; +} + +header a:first-child i:hover { + cursor: pointer; +} + +nav { + top: -10.5vh; + display: flex; + position: relative; + justify-content: space-around; + height: 10vh; + border-bottom: var(--mainSiteColor) solid 3px; + background-color: var(--navBg); + box-shadow: 0px 0px 6px #0e0e0e; + transition: all 0.1s ease-in-out; +} + +nav a { + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; + flex-grow: 1; + color: var(--navbarTextColor); + text-decoration: none; + transition: all 0.1s ease-in-out; +} + +nav a:hover { + color: var(--mainSiteColor); + transform: scale(1.2); +} + +nav p { + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; + flex-grow: 1; +} + +@media screen and (max-width: 768px) { + header a:first-child { + min-width: 20%; + } +}
\ No newline at end of file |