Personal portfolio website created with bootstrap.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

83 lines
1.7 KiB

// Styling for the navbar
#mainNav {
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 700;
text-transform: uppercase;
border: none;
background: $theme-primary;
a:focus {
outline: none;
}
.navbar-brand {
font-size: 1.1rem;
color: white;
&.active,
&:active,
&:focus,
&:hover {
color: white;
}
}
.navbar-nav {
letter-spacing: 1px;
li.nav-item {
a.nav-link {
color: white;
&:hover {
color: $theme-success;
outline: none;
}
&:active,
&:focus {
color: white;
}
}
}
}
.navbar-toggler {
font-size: 14px;
padding: 11px;
text-transform: uppercase;
color: white;
border-color: white;
&:focus,
&:hover {
color: white;
border-color: $theme-success;
background-color: $theme-success;
}
}
}
@media(min-width:992px) {
#mainNav {
padding-top: 25px;
padding-bottom: 25px;
-webkit-transition: padding-top 0.3s, padding-bottom 0.3s;
-moz-transition: padding-top 0.3s, padding-bottom 0.3s;
transition: padding-top 0.3s, padding-bottom 0.3s;
.navbar-brand {
font-size: 2em;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.navbar-nav > li.nav-item > a.nav-link.active {
color: white;
border-radius: 3px;
background: $theme-success;
&:active,
&:focus,
&:hover {
color: white;
background: $theme-success;
}
}
}
#mainNav.navbar-shrink {
padding-top: 10px;
padding-bottom: 10px;
.navbar-brand {
font-size: 1.5em;
}
}
}