From 3eb09aafb555909a5c18196f3bae838d655df2a9 Mon Sep 17 00:00:00 2001 From: Thomas Smith <49042513+tsmitty11@users.noreply.github.com> Date: Tue, 20 Sep 2022 18:14:36 -0400 Subject: [PATCH] Added CSS file for navbar --- src/layouts/partials/head.html | 1 + src/static/css/navbar.css | 132 +++++++++++++++++++++++++++++++++ src/static/css/style.css | 100 ------------------------- 3 files changed, 133 insertions(+), 100 deletions(-) create mode 100644 src/static/css/navbar.css diff --git a/src/layouts/partials/head.html b/src/layouts/partials/head.html index cf360e4..901535d 100644 --- a/src/layouts/partials/head.html +++ b/src/layouts/partials/head.html @@ -50,6 +50,7 @@ + diff --git a/src/static/css/navbar.css b/src/static/css/navbar.css new file mode 100644 index 0000000..e9f76e6 --- /dev/null +++ b/src/static/css/navbar.css @@ -0,0 +1,132 @@ +/* Navbar General */ + +@media only screen and (min-width: 1200px) { + + div.container-fluid.top-nav{ + padding-left: 0px !important; + } + + .navbar{ + background-color: #1a1a1a !important; + height: 4.5vw; + border-bottom: 2px solid #949494; + } + + .nav-logo{ + width: 4.4vw; + } + + .nav-logo:hover{ + transform: scale(0.9); + } + + .nav-item{ + font-family: "pp-neue-machina", sans-serif; + text-transform: uppercase; + font-size: 1vw; + } +} + +@media only screen and (min-width: 992px) and (max-width: 1200px) { + + div.container-fluid.top-nav{ + padding-left: 0px !important; + } + + .navbar{ + background-color: #1a1a1a !important; + height: 5vw; + border-bottom: 2px solid #949494; + } + + .navbar-brand{ + padding-top:0px !important; + padding-bottom: 0px !important; + } + + .nav-logo{ + width: 4.9vw; + } + + .nav-logo:hover{ + transform: scale(0.9); + } + + .nav-item{ + font-family: "pp-neue-machina", sans-serif; + text-transform: uppercase; + font-size: 1.2vw; + } + +} + +@media only screen and (min-width: 768px) and (max-width: 992px) { + + div.container-fluid.top-nav{ + padding-left: 0px !important; + } + + .navbar{ + background-color: #1a1a1a !important; + height: 5vw; + border-bottom: 2px solid #949494; + } + + .navbar-brand{ + padding-top:0px !important; + padding-bottom: 0px !important; + } + + .nav-logo{ + width: 4.9vw; + } + + .nav-logo:hover{ + transform: scale(0.9); + } + + .nav-item{ + font-family: "pp-neue-machina", sans-serif; + text-transform: uppercase; + font-size: 1.2vw; + } +} + +@media only screen and (min-width: 576px) and (max-width: 768px) { + + div.container-fluid.top-nav{ + padding-left: 0px !important; + } + + .navbar{ + background-color: #1a1a1a !important; + height: 13.5vw; + border-bottom: 2px solid #949494; + padding-top: 0px !important; + padding-bottom: 0px !important; + } + + .navbar-brand{ + padding-top:0px; + padding-bottom: 0px; + } + + .container-fluid{ + background: none !important; + } + + .nav-logo{ + width: 13.2vw; + top:0px !important; + } + + .nav-logo:hover{ + transform: scale(0.9); + } + + .nav-item{ + font-family: "pp-neue-machina", sans-serif; + text-transform: uppercase; + font-size: 1.2vw; + } +} diff --git a/src/static/css/style.css b/src/static/css/style.css index ed765ec..a4d50f6 100644 --- a/src/static/css/style.css +++ b/src/static/css/style.css @@ -34,106 +34,6 @@ body{ } } -/* Navbar General */ - -@media only screen and (min-width: 1200px) { - - div.container-fluid.top-nav{ - padding-left: 0px !important; - } - - .navbar{ - background-color: #1a1a1a !important; - height: 4.5vw; - border-bottom: 2px solid #949494; - } - - .nav-logo{ - width: 4.4vw; - } - - .nav-logo:hover{ - transform: scale(0.9); - } - - .nav-item{ - font-family: "pp-neue-machina", sans-serif; - text-transform: uppercase; - font-size: 1vw; - } -} - -@media only screen and (min-width: 768px) and (max-width: 1200px) { - - div.container-fluid.top-nav{ - padding-left: 0px !important; - } - - .navbar{ - background-color: #1a1a1a !important; - height: 5vw; - border-bottom: 2px solid #949494; - } - - .navbar-brand{ - padding-top:0px !important; - padding-bottom: 0px !important; - } - - .nav-logo{ - width: 4.9vw; - } - - .nav-logo:hover{ - transform: scale(0.9); - } - - .nav-item{ - font-family: "pp-neue-machina", sans-serif; - text-transform: uppercase; - font-size: 1.2vw; - } -} - -@media only screen and (min-width: 576px) and (max-width: 768px) { - - div.container-fluid.top-nav{ - padding-left: 0px !important; - } - - .navbar{ - background-color: #1a1a1a !important; - height: 13.5vw; - border-bottom: 2px solid #949494; - padding-top: 0px !important; - padding-bottom: 0px !important; - } - - .navbar-brand{ - padding-top:0px; - padding-bottom: 0px; - } - - .container-fluid{ - background: none !important; - } - - .nav-logo{ - width: 13.2vw; - top:0px !important; - } - - .nav-logo:hover{ - transform: scale(0.9); - } - - .nav-item{ - font-family: "pp-neue-machina", sans-serif; - text-transform: uppercase; - font-size: 1.2vw; - } -} - /* Brand Colors */ /* Type Colors: */