agaric/patternlibrary
10
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Make navbar focus states match hover states

Browse source
This commit is contained in:
benjamin melançon 2018-12-26 22:26:40 -05:00
parent 27da326d6a
commit 93525f799a
1 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
agaric/sass/agaric/_component.navbar.scss
View file

@ -158,7 +158,8 @@ a:target:hover {
}
}
.navbar-dropdown a:hover.navbar-item {
.navbar-dropdown a:hover.navbar-item,
.navbar-dropdown a:focus.navbar-item {
border-color: $white;
@include tablet {
color: $white;
@ -215,7 +216,8 @@ a.navbar-link.is-active {
bottom: -3px;
border-top: 3px solid currentColor;
}
&:hover {
&:hover,
&:focus {
color: $white;
background-color: $dark;
&::before {
@ -226,6 +228,7 @@ a.navbar-link.is-active {
}
.navbar-item.has-dropdown:hover .navbar-link,
.navbar-item.has-dropdown:focus .navbar-link,
.navbar-item.has-dropdown.is-active .navbar-link {
@include tablet {
color: $white;
@ -235,7 +238,10 @@ a.navbar-link.is-active {
a.navbar-item:hover,
a.navbar-link:hover,
.hero.is-dark a.navbar-item:not(.button):not(.dropdown-item):not(.tag):hover
a.navbar-item:focus,
a.navbar-link:focus,
.hero.is-dark a.navbar-item:not(.button):not(.dropdown-item):not(.tag):hover,
.hero.is-dark a.navbar-item:not(.button):not(.dropdown-item):not(.tag):focus
{
color: $dark;
background-color: $white;