feat(navbar): add a more complete navbar system
This commit is contained in:
Kazhnuz
parent
800dc309ba
commit
ee4a6cccaa
4 changed files with 402 additions and 6 deletions
|
|
@ -11,3 +11,5 @@
|
||||||
@import 'components/buttons';
|
@import 'components/buttons';
|
||||||
|
|
||||||
@import 'components/previews';
|
@import 'components/previews';
|
||||||
|
|
||||||
|
@import 'components/navbar';
|
||||||
|
|
|
||||||
70
scss/components/_navbar.scss
Normal file
70
scss/components/_navbar.scss
Normal file
|
|
@ -0,0 +1,70 @@
|
||||||
|
// Mixin and colors
|
||||||
|
|
||||||
|
@mixin navheader() {
|
||||||
|
box-shadow: $large-shadow;
|
||||||
|
@include borders();
|
||||||
|
border-left: 0;
|
||||||
|
border-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin colorize-navbar() {
|
||||||
|
@each $name, $color in list-colors() {
|
||||||
|
&-#{$name} { @include navbar-color(get-color($name), #FFF, #000); }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin navbar-color($background-color, $light-color, $dark-color) {
|
||||||
|
background-color:$background-color;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: transparentize(getTextColorFromBackground($background-color, $light-color, $dark-color), 0.5);
|
||||||
|
&:hover, &:active {
|
||||||
|
color: getTextColorFromBackground($background-color, $light-color, $dark-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.disabled, &.navlink.disabled {
|
||||||
|
color: transparentize(getTextColorFromBackground($background-color, $light-color, $dark-color), 0.75);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
color: getTextColorFromBackground($background-color, $light-color, $dark-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navhead, .navbar {
|
||||||
|
@include navheader();
|
||||||
|
@include colorize-navbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navhead .navbar, .navbar-transparent {
|
||||||
|
border: none;
|
||||||
|
box-shadow: none;
|
||||||
|
background-color:transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
padding:0;
|
||||||
|
padding-left:$baselinerem;
|
||||||
|
padding-right:$baselinerem;
|
||||||
|
ul {
|
||||||
|
padding-bottom:0;
|
||||||
|
}
|
||||||
|
@include li-no-margin();
|
||||||
|
|
||||||
|
.nav-item .nav-link, .navbar-brand {
|
||||||
|
padding:$baselinerem/2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link:hover, .navbar-brand:hover {
|
||||||
|
background-color: rgba(0,0,0,0.05);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-menu {
|
||||||
|
box-shadow: $narrow-shadow, $inset-shadow;
|
||||||
|
color: #444;
|
||||||
|
a, a:hover, a:active {
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
}
|
||||||
334
style.css
334
style.css
|
|
@ -112,7 +112,7 @@
|
||||||
}
|
}
|
||||||
.bg-yellow {
|
.bg-yellow {
|
||||||
background-color: #f6d32d !important;
|
background-color: #f6d32d !important;
|
||||||
color: #FFF;
|
color: #000;
|
||||||
}
|
}
|
||||||
.bg-brown {
|
.bg-brown {
|
||||||
background-color: #986a44 !important;
|
background-color: #986a44 !important;
|
||||||
|
|
@ -688,11 +688,11 @@ ul.social li a:hover {
|
||||||
}
|
}
|
||||||
.card-yellow > .card-header, .card-yellow > .card-footer {
|
.card-yellow > .card-header, .card-yellow > .card-footer {
|
||||||
background-color: #f6d32d !important;
|
background-color: #f6d32d !important;
|
||||||
color: #FFF;
|
color: #000;
|
||||||
}
|
}
|
||||||
.card-yellow.card-colored > .card-body {
|
.card-yellow.card-colored > .card-body {
|
||||||
background-color: #f6d32d !important;
|
background-color: #f6d32d !important;
|
||||||
color: #FFF;
|
color: #000;
|
||||||
}
|
}
|
||||||
.card-brown > .card-header, .card-brown > .card-footer {
|
.card-brown > .card-header, .card-brown > .card-footer {
|
||||||
background-color: #986a44 !important;
|
background-color: #986a44 !important;
|
||||||
|
|
@ -1176,7 +1176,7 @@ a.list-group-item:hover {
|
||||||
}
|
}
|
||||||
.btn-yellow {
|
.btn-yellow {
|
||||||
background-color: #f6d32d !important;
|
background-color: #f6d32d !important;
|
||||||
color: #FFF;
|
color: #000;
|
||||||
}
|
}
|
||||||
.btn-yellow:hover, .btn-yellow:active, .btn-yellow:focus, a:hover > .btn-yellow, a:active > .btn-yellow, a:focus > .btn-yellow, .btn-yellow:not(.disabled):not(:disabled):hover, .btn-yellow:not(.disabled):not(:disabled):active, .btn-yellow:not(.disabled):not(:disabled):focus, a:hover > .btn-yellow:not(.disabled):not(:disabled), a:active > .btn-yellow:not(.disabled):not(:disabled), a:focus > .btn-yellow:not(.disabled):not(:disabled) {
|
.btn-yellow:hover, .btn-yellow:active, .btn-yellow:focus, a:hover > .btn-yellow, a:active > .btn-yellow, a:focus > .btn-yellow, .btn-yellow:not(.disabled):not(:disabled):hover, .btn-yellow:not(.disabled):not(:disabled):active, .btn-yellow:not(.disabled):not(:disabled):focus, a:hover > .btn-yellow:not(.disabled):not(:disabled), a:active > .btn-yellow:not(.disabled):not(:disabled), a:focus > .btn-yellow:not(.disabled):not(:disabled) {
|
||||||
background-color: #f8dd5e !important;
|
background-color: #f8dd5e !important;
|
||||||
|
|
@ -1349,7 +1349,7 @@ a.list-group-item:hover {
|
||||||
}
|
}
|
||||||
.badge-yellow {
|
.badge-yellow {
|
||||||
background-color: #f6d32d !important;
|
background-color: #f6d32d !important;
|
||||||
color: #FFF;
|
color: #000;
|
||||||
}
|
}
|
||||||
.badge-yellow:hover, .badge-yellow:active, .badge-yellow:focus, a:hover > .badge-yellow, a:active > .badge-yellow, a:focus > .badge-yellow, .badge-yellow:not(.disabled):not(:disabled):hover, .badge-yellow:not(.disabled):not(:disabled):active, .badge-yellow:not(.disabled):not(:disabled):focus, a:hover > .badge-yellow:not(.disabled):not(:disabled), a:active > .badge-yellow:not(.disabled):not(:disabled), a:focus > .badge-yellow:not(.disabled):not(:disabled) {
|
.badge-yellow:hover, .badge-yellow:active, .badge-yellow:focus, a:hover > .badge-yellow, a:active > .badge-yellow, a:focus > .badge-yellow, .badge-yellow:not(.disabled):not(:disabled):hover, .badge-yellow:not(.disabled):not(:disabled):active, .badge-yellow:not(.disabled):not(:disabled):focus, a:hover > .badge-yellow:not(.disabled):not(:disabled), a:active > .badge-yellow:not(.disabled):not(:disabled), a:focus > .badge-yellow:not(.disabled):not(:disabled) {
|
||||||
background-color: #f8dd5e !important;
|
background-color: #f8dd5e !important;
|
||||||
|
|
@ -1600,4 +1600,328 @@ a.list-group-item:hover {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.navhead, .navbar {
|
||||||
|
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
|
||||||
|
border: 1px solid rgba(0, 0, 0, 0.3);
|
||||||
|
border-left: 0;
|
||||||
|
border-right: 0;
|
||||||
|
}
|
||||||
|
.navhead-blue, .navbar-blue {
|
||||||
|
background-color: #4e63c9;
|
||||||
|
}
|
||||||
|
.navhead-blue a, .navbar-blue a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-blue a:hover, .navhead-blue a:active, .navbar-blue a:hover, .navbar-blue a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-blue a.disabled, .navhead-blue a.navlink.disabled, .navbar-blue a.disabled, .navbar-blue a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-blue h1, .navhead-blue h2, .navhead-blue h3, .navhead-blue h4, .navhead-blue h5, .navhead-blue h6, .navbar-blue h1, .navbar-blue h2, .navbar-blue h3, .navbar-blue h4, .navbar-blue h5, .navbar-blue h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-violet, .navbar-violet {
|
||||||
|
background-color: #ce4dcd;
|
||||||
|
}
|
||||||
|
.navhead-violet a, .navbar-violet a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-violet a:hover, .navhead-violet a:active, .navbar-violet a:hover, .navbar-violet a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-violet a.disabled, .navhead-violet a.navlink.disabled, .navbar-violet a.disabled, .navbar-violet a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-violet h1, .navhead-violet h2, .navhead-violet h3, .navhead-violet h4, .navhead-violet h5, .navhead-violet h6, .navbar-violet h1, .navbar-violet h2, .navbar-violet h3, .navbar-violet h4, .navbar-violet h5, .navbar-violet h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-purple, .navbar-purple {
|
||||||
|
background-color: #7951c0;
|
||||||
|
}
|
||||||
|
.navhead-purple a, .navbar-purple a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-purple a:hover, .navhead-purple a:active, .navbar-purple a:hover, .navbar-purple a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-purple a.disabled, .navhead-purple a.navlink.disabled, .navbar-purple a.disabled, .navbar-purple a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-purple h1, .navhead-purple h2, .navhead-purple h3, .navhead-purple h4, .navhead-purple h5, .navhead-purple h6, .navbar-purple h1, .navbar-purple h2, .navbar-purple h3, .navbar-purple h4, .navbar-purple h5, .navbar-purple h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-red, .navbar-red {
|
||||||
|
background-color: #e33d22;
|
||||||
|
}
|
||||||
|
.navhead-red a, .navbar-red a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-red a:hover, .navhead-red a:active, .navbar-red a:hover, .navbar-red a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-red a.disabled, .navhead-red a.navlink.disabled, .navbar-red a.disabled, .navbar-red a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-red h1, .navhead-red h2, .navhead-red h3, .navhead-red h4, .navhead-red h5, .navhead-red h6, .navbar-red h1, .navbar-red h2, .navbar-red h3, .navbar-red h4, .navbar-red h5, .navbar-red h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-orange, .navbar-orange {
|
||||||
|
background-color: #eb790a;
|
||||||
|
}
|
||||||
|
.navhead-orange a, .navbar-orange a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-orange a:hover, .navhead-orange a:active, .navbar-orange a:hover, .navbar-orange a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-orange a.disabled, .navhead-orange a.navlink.disabled, .navbar-orange a.disabled, .navbar-orange a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-orange h1, .navhead-orange h2, .navhead-orange h3, .navhead-orange h4, .navhead-orange h5, .navhead-orange h6, .navbar-orange h1, .navbar-orange h2, .navbar-orange h3, .navbar-orange h4, .navbar-orange h5, .navbar-orange h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-green, .navbar-green {
|
||||||
|
background-color: #75b82d;
|
||||||
|
}
|
||||||
|
.navhead-green a, .navbar-green a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-green a:hover, .navhead-green a:active, .navbar-green a:hover, .navbar-green a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-green a.disabled, .navhead-green a.navlink.disabled, .navbar-green a.disabled, .navbar-green a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-green h1, .navhead-green h2, .navhead-green h3, .navhead-green h4, .navhead-green h5, .navhead-green h6, .navbar-green h1, .navbar-green h2, .navbar-green h3, .navbar-green h4, .navbar-green h5, .navbar-green h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-skyblue, .navbar-skyblue {
|
||||||
|
background-color: #42a0f3;
|
||||||
|
}
|
||||||
|
.navhead-skyblue a, .navbar-skyblue a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-skyblue a:hover, .navhead-skyblue a:active, .navbar-skyblue a:hover, .navbar-skyblue a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-skyblue a.disabled, .navhead-skyblue a.navlink.disabled, .navbar-skyblue a.disabled, .navbar-skyblue a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-skyblue h1, .navhead-skyblue h2, .navhead-skyblue h3, .navhead-skyblue h4, .navhead-skyblue h5, .navhead-skyblue h6, .navbar-skyblue h1, .navbar-skyblue h2, .navbar-skyblue h3, .navbar-skyblue h4, .navbar-skyblue h5, .navbar-skyblue h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-dark, .navbar-dark {
|
||||||
|
background-color: #2D2D2D;
|
||||||
|
}
|
||||||
|
.navhead-dark a, .navbar-dark a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-dark a:hover, .navhead-dark a:active, .navbar-dark a:hover, .navbar-dark a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-dark a.disabled, .navhead-dark a.navlink.disabled, .navbar-dark a.disabled, .navbar-dark a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-dark h1, .navhead-dark h2, .navhead-dark h3, .navhead-dark h4, .navhead-dark h5, .navhead-dark h6, .navbar-dark h1, .navbar-dark h2, .navbar-dark h3, .navbar-dark h4, .navbar-dark h5, .navbar-dark h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-light, .navbar-light {
|
||||||
|
background-color: #eeeeec;
|
||||||
|
}
|
||||||
|
.navhead-light a, .navbar-light a {
|
||||||
|
color: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-light a:hover, .navhead-light a:active, .navbar-light a:hover, .navbar-light a:active {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
.navhead-light a.disabled, .navhead-light a.navlink.disabled, .navbar-light a.disabled, .navbar-light a.navlink.disabled {
|
||||||
|
color: rgba(0, 0, 0, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-light h1, .navhead-light h2, .navhead-light h3, .navhead-light h4, .navhead-light h5, .navhead-light h6, .navbar-light h1, .navbar-light h2, .navbar-light h3, .navbar-light h4, .navbar-light h5, .navbar-light h6 {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
.navhead-turquoise, .navbar-turquoise {
|
||||||
|
background-color: #46bd9e;
|
||||||
|
}
|
||||||
|
.navhead-turquoise a, .navbar-turquoise a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-turquoise a:hover, .navhead-turquoise a:active, .navbar-turquoise a:hover, .navbar-turquoise a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-turquoise a.disabled, .navhead-turquoise a.navlink.disabled, .navbar-turquoise a.disabled, .navbar-turquoise a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-turquoise h1, .navhead-turquoise h2, .navhead-turquoise h3, .navhead-turquoise h4, .navhead-turquoise h5, .navhead-turquoise h6, .navbar-turquoise h1, .navbar-turquoise h2, .navbar-turquoise h3, .navbar-turquoise h4, .navbar-turquoise h5, .navbar-turquoise h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-yellow, .navbar-yellow {
|
||||||
|
background-color: #f6d32d;
|
||||||
|
}
|
||||||
|
.navhead-yellow a, .navbar-yellow a {
|
||||||
|
color: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-yellow a:hover, .navhead-yellow a:active, .navbar-yellow a:hover, .navbar-yellow a:active {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
.navhead-yellow a.disabled, .navhead-yellow a.navlink.disabled, .navbar-yellow a.disabled, .navbar-yellow a.navlink.disabled {
|
||||||
|
color: rgba(0, 0, 0, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-yellow h1, .navhead-yellow h2, .navhead-yellow h3, .navhead-yellow h4, .navhead-yellow h5, .navhead-yellow h6, .navbar-yellow h1, .navbar-yellow h2, .navbar-yellow h3, .navbar-yellow h4, .navbar-yellow h5, .navbar-yellow h6 {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
.navhead-brown, .navbar-brown {
|
||||||
|
background-color: #986a44;
|
||||||
|
}
|
||||||
|
.navhead-brown a, .navbar-brown a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-brown a:hover, .navhead-brown a:active, .navbar-brown a:hover, .navbar-brown a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-brown a.disabled, .navhead-brown a.navlink.disabled, .navbar-brown a.disabled, .navbar-brown a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-brown h1, .navhead-brown h2, .navhead-brown h3, .navhead-brown h4, .navhead-brown h5, .navhead-brown h6, .navbar-brown h1, .navbar-brown h2, .navbar-brown h3, .navbar-brown h4, .navbar-brown h5, .navbar-brown h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-grey, .navbar-grey {
|
||||||
|
background-color: #77767b;
|
||||||
|
}
|
||||||
|
.navhead-grey a, .navbar-grey a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-grey a:hover, .navhead-grey a:active, .navbar-grey a:hover, .navbar-grey a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-grey a.disabled, .navhead-grey a.navlink.disabled, .navbar-grey a.disabled, .navbar-grey a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-grey h1, .navhead-grey h2, .navhead-grey h3, .navhead-grey h4, .navhead-grey h5, .navhead-grey h6, .navbar-grey h1, .navbar-grey h2, .navbar-grey h3, .navbar-grey h4, .navbar-grey h5, .navbar-grey h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-primary, .navbar-primary {
|
||||||
|
background-color: #7951c0;
|
||||||
|
}
|
||||||
|
.navhead-primary a, .navbar-primary a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-primary a:hover, .navhead-primary a:active, .navbar-primary a:hover, .navbar-primary a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-primary a.disabled, .navhead-primary a.navlink.disabled, .navbar-primary a.disabled, .navbar-primary a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-primary h1, .navhead-primary h2, .navhead-primary h3, .navhead-primary h4, .navhead-primary h5, .navhead-primary h6, .navbar-primary h1, .navbar-primary h2, .navbar-primary h3, .navbar-primary h4, .navbar-primary h5, .navbar-primary h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-secondary, .navbar-secondary {
|
||||||
|
background-color: #4e63c9;
|
||||||
|
}
|
||||||
|
.navhead-secondary a, .navbar-secondary a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-secondary a:hover, .navhead-secondary a:active, .navbar-secondary a:hover, .navbar-secondary a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-secondary a.disabled, .navhead-secondary a.navlink.disabled, .navbar-secondary a.disabled, .navbar-secondary a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-secondary h1, .navhead-secondary h2, .navhead-secondary h3, .navhead-secondary h4, .navhead-secondary h5, .navhead-secondary h6, .navbar-secondary h1, .navbar-secondary h2, .navbar-secondary h3, .navbar-secondary h4, .navbar-secondary h5, .navbar-secondary h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-warning, .navbar-warning {
|
||||||
|
background-color: #eb790a;
|
||||||
|
}
|
||||||
|
.navhead-warning a, .navbar-warning a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-warning a:hover, .navhead-warning a:active, .navbar-warning a:hover, .navbar-warning a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-warning a.disabled, .navhead-warning a.navlink.disabled, .navbar-warning a.disabled, .navbar-warning a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-warning h1, .navhead-warning h2, .navhead-warning h3, .navhead-warning h4, .navhead-warning h5, .navhead-warning h6, .navbar-warning h1, .navbar-warning h2, .navbar-warning h3, .navbar-warning h4, .navbar-warning h5, .navbar-warning h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-danger, .navbar-danger {
|
||||||
|
background-color: #e33d22;
|
||||||
|
}
|
||||||
|
.navhead-danger a, .navbar-danger a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-danger a:hover, .navhead-danger a:active, .navbar-danger a:hover, .navbar-danger a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-danger a.disabled, .navhead-danger a.navlink.disabled, .navbar-danger a.disabled, .navbar-danger a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-danger h1, .navhead-danger h2, .navhead-danger h3, .navhead-danger h4, .navhead-danger h5, .navhead-danger h6, .navbar-danger h1, .navbar-danger h2, .navbar-danger h3, .navbar-danger h4, .navbar-danger h5, .navbar-danger h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-info, .navbar-info {
|
||||||
|
background-color: #42a0f3;
|
||||||
|
}
|
||||||
|
.navhead-info a, .navbar-info a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-info a:hover, .navhead-info a:active, .navbar-info a:hover, .navbar-info a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-info a.disabled, .navhead-info a.navlink.disabled, .navbar-info a.disabled, .navbar-info a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-info h1, .navhead-info h2, .navhead-info h3, .navhead-info h4, .navhead-info h5, .navhead-info h6, .navbar-info h1, .navbar-info h2, .navbar-info h3, .navbar-info h4, .navbar-info h5, .navbar-info h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-success, .navbar-success {
|
||||||
|
background-color: #75b82d;
|
||||||
|
}
|
||||||
|
.navhead-success a, .navbar-success a {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.navhead-success a:hover, .navhead-success a:active, .navbar-success a:hover, .navbar-success a:active {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
.navhead-success a.disabled, .navhead-success a.navlink.disabled, .navbar-success a.disabled, .navbar-success a.navlink.disabled {
|
||||||
|
color: rgba(255, 255, 255, 0.25);
|
||||||
|
}
|
||||||
|
.navhead-success h1, .navhead-success h2, .navhead-success h3, .navhead-success h4, .navhead-success h5, .navhead-success h6, .navbar-success h1, .navbar-success h2, .navbar-success h3, .navbar-success h4, .navbar-success h5, .navbar-success h6 {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navhead .navbar, .navbar-transparent {
|
||||||
|
border: none;
|
||||||
|
box-shadow: none;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
padding: 0;
|
||||||
|
padding-left: 1.5rem;
|
||||||
|
padding-right: 1.5rem;
|
||||||
|
}
|
||||||
|
.navbar ul {
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
.navbar li {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.navbar .nav-item .nav-link, .navbar .navbar-brand {
|
||||||
|
padding: 0.75rem;
|
||||||
|
}
|
||||||
|
.navbar .nav-link:hover, .navbar .navbar-brand:hover {
|
||||||
|
background-color: rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-menu {
|
||||||
|
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), inset 0px -2px 0px rgba(0, 0, 0, 0.2);
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
.dropdown-menu a, .dropdown-menu a:hover, .dropdown-menu a:active {
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
|
||||||
/*# sourceMappingURL=style.css.map */
|
/*# sourceMappingURL=style.css.map */
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
Reference in a new issue