mirror of
https://github.com/ivabus/www
synced 2024-11-23 00:35:07 +03:00
Added CSS file for navbar
This commit is contained in:
parent
d85ea39db5
commit
3eb09aafb5
3 changed files with 133 additions and 100 deletions
|
@ -50,6 +50,7 @@
|
||||||
<link rel="apple-touch-icon-precomposed" href="/favicon-180.png">
|
<link rel="apple-touch-icon-precomposed" href="/favicon-180.png">
|
||||||
<link rel="stylesheet" href="/css/style.css">
|
<link rel="stylesheet" href="/css/style.css">
|
||||||
<link rel="stylesheet" href="/css/typography.css">
|
<link rel="stylesheet" href="/css/typography.css">
|
||||||
|
<link rel="stylesheet" href="/css/navbar.css">
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Syne:wght@700&display=swap" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css2?family=Syne:wght@700&display=swap" rel="stylesheet">
|
||||||
<link href="https://file.myfontastic.com/Fd33ifaooDVpESwnDXETgR/icons.css" rel="stylesheet">
|
<link href="https://file.myfontastic.com/Fd33ifaooDVpESwnDXETgR/icons.css" rel="stylesheet">
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
|
|
132
src/static/css/navbar.css
Normal file
132
src/static/css/navbar.css
Normal file
|
@ -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;
|
||||||
|
}
|
||||||
|
}
|
|
@ -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 */
|
/* Brand Colors */
|
||||||
|
|
||||||
/* Type Colors: */
|
/* Type Colors: */
|
||||||
|
|
Loading…
Reference in a new issue