mirror of
https://github.com/picocss/pico.git
synced 2025-04-25 18:56:15 -04:00
style(dropdowns): Better support for :focus
This commit is contained in:
parent
f7ed336ac0
commit
2906e37f7a
26 changed files with 55 additions and 94 deletions
|
@ -73,15 +73,16 @@ details[role="list"] {
|
|||
margin-bottom: calc(var(--form-element-spacing-vertical) * 0.5);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--dropdown-focus-background-color);
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin: calc(var(--form-element-spacing-vertical) * -0.5) calc(var(--form-element-spacing-horizontal) * -1);
|
||||
padding: calc(var(--form-element-spacing-vertical) * 0.5) var(--form-element-spacing-horizontal);
|
||||
color: var(--dropdown-color);
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--dropdown-hover-background-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -117,7 +117,7 @@
|
|||
--dropdown-border-color: #{mix($grey-900, $grey-800)};
|
||||
--dropdown-box-shadow: var(--card-box-shadow);
|
||||
--dropdown-color: var(--color);
|
||||
--dropdown-focus-background-color: #{rgba(mix($grey-900, $grey-800), 0.75)};
|
||||
--dropdown-hover-background-color: #{rgba(mix($grey-900, $grey-800), 0.75)};
|
||||
|
||||
// Modal (<dialog>)
|
||||
--modal-overlay-background-color: #{rgba(mix($grey-900, $grey-800), 0.9)};
|
||||
|
|
|
@ -117,7 +117,7 @@
|
|||
--dropdown-border-color: #{mix($grey-100, $grey-50)};
|
||||
--dropdown-box-shadow: var(--card-box-shadow);
|
||||
--dropdown-color: var(--color);
|
||||
--dropdown-focus-background-color: #{$grey-50};
|
||||
--dropdown-hover-background-color: #{$grey-50};
|
||||
|
||||
// Modal (<dialog>)
|
||||
--modal-overlay-background-color: #{rgba($grey-100, 0.8)};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue