mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
Add navbar color modifiers (#849)
* Add navbar color modifiers * Use border-color instead of +arrow for navbar dropdowns
This commit is contained in:
parent
6d531b9f4e
commit
1a5dc72c1b
@ -37,6 +37,32 @@ $navbar-divider-background-color: $border !default
|
||||
background-color: $navbar-background-color
|
||||
min-height: $navbar-height
|
||||
position: relative
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
$color-invert: nth($pair, 2)
|
||||
&.is-#{$name}
|
||||
background-color: $color
|
||||
color: $color-invert
|
||||
.navbar-item,
|
||||
.navbar-link
|
||||
color: $color-invert
|
||||
a.navbar-item,
|
||||
.navbar-link
|
||||
&:hover,
|
||||
&.is-active
|
||||
background-color: darken($color, 2.5%)
|
||||
color: $color-invert
|
||||
+desktop
|
||||
.navbar-link
|
||||
&::after
|
||||
border-color: $color-invert
|
||||
.navbar-dropdown a.navbar-item:not(.is-active):not(:hover),
|
||||
.navbar-dropdown .navbar-item:not(a)
|
||||
color: $navbar-item
|
||||
.navbar-item.has-dropdown:hover .navbar-link,
|
||||
.navbar-item.has-dropdown.is-active .navbar-link
|
||||
background-color: darken($color, 2.5%)
|
||||
color: $color-invert
|
||||
& > .container
|
||||
align-items: stretch
|
||||
display: flex
|
||||
|
Loading…
Reference in New Issue
Block a user