63 lines
1.4 KiB
SCSS
63 lines
1.4 KiB
SCSS
|
//
|
||
|
|
// Mixins: Navbar
|
||
|
|
//
|
||
|
|
|
||
|
|
// Navbar Variant
|
||
|
|
@mixin navbar-variant($name, $color) {
|
||
|
|
.navbar-#{$name} {
|
||
|
|
background-color: $color;
|
||
|
|
color: color-yiq($color);
|
||
|
|
|
||
|
|
&.navbar-light {
|
||
|
|
.form-control-navbar {
|
||
|
|
&::placeholder {
|
||
|
|
color: rgba($gray-800, .8);
|
||
|
|
}
|
||
|
|
&,
|
||
|
|
+ .input-group-append > .btn-navbar {
|
||
|
|
background-color: darken($color, 4%);
|
||
|
|
border-color: darken($color, 9%);
|
||
|
|
color: rgba($gray-800, .8);
|
||
|
|
}
|
||
|
|
|
||
|
|
&:focus {
|
||
|
|
&::placeholder {
|
||
|
|
color: $gray-800;
|
||
|
|
}
|
||
|
|
&,
|
||
|
|
+ .input-group-append .btn-navbar {
|
||
|
|
background-color: darken($color, 5%);
|
||
|
|
border-color: darken($color, 9%) !important;
|
||
|
|
color: $gray-800;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
&.navbar-dark {
|
||
|
|
.form-control-navbar {
|
||
|
|
&::placeholder {
|
||
|
|
color: rgba($white, .8);
|
||
|
|
}
|
||
|
|
&,
|
||
|
|
+ .input-group-append > .btn-navbar {
|
||
|
|
background-color: lighten($color, 4%);
|
||
|
|
border-color: lighten($color, 9%);
|
||
|
|
color: rgba($white, .8);
|
||
|
|
}
|
||
|
|
|
||
|
|
&:focus {
|
||
|
|
&::placeholder {
|
||
|
|
color: $white;
|
||
|
|
}
|
||
|
|
&,
|
||
|
|
+ .input-group-append .btn-navbar {
|
||
|
|
background-color: lighten($color, 5%);
|
||
|
|
border-color: lighten($color, 9%) !important;
|
||
|
|
color: $white;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|