kopia lustrzana https://github.com/shoelace-style/shoelace
Improve menu item focus color
rodzic
a64b57245c
commit
63eb5a773f
|
@ -6,6 +6,10 @@ Components with the <sl-badge type="warning" pill>Experimental</sl-badge> badge
|
|||
|
||||
_During the beta period, these restrictions may be relaxed in the event of a mission-critical bug._ 🐛
|
||||
|
||||
## Next
|
||||
|
||||
- Updated `sl-menu-item` focus styles
|
||||
|
||||
## 2.0.0-beta.26
|
||||
|
||||
- 🚨 BREAKING CHANGE: Fixed animations bloat
|
||||
|
|
|
@ -15,16 +15,18 @@
|
|||
letter-spacing: var(--sl-letter-spacing-normal);
|
||||
text-align: left;
|
||||
color: var(--sl-color-gray-700);
|
||||
border-radius: var(--sl-border-radius-medium);
|
||||
padding: var(--sl-spacing-xx-small) var(--sl-spacing-x-large);
|
||||
transition: var(--sl-transition-fast) fill;
|
||||
user-select: none;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
margin: 0 var(--sl-spacing-x-small);
|
||||
|
||||
&.menu-item--focused:not(.menu-item--disabled) {
|
||||
outline: none;
|
||||
background-color: var(--sl-color-primary-50);
|
||||
color: var(--sl-color-primary-500);
|
||||
background-color: var(--sl-color-primary-500);
|
||||
color: var(--sl-color-white);
|
||||
}
|
||||
|
||||
&.menu-item--disabled {
|
||||
|
|
|
@ -185,8 +185,8 @@
|
|||
}
|
||||
|
||||
.sl-theme-dark sl-menu-item::part(base):focus {
|
||||
background-color: var(--sl-color-primary-950);
|
||||
color: var(--sl-color-primary-500);
|
||||
background-color: var(--sl-color-primary-600);
|
||||
color: var(--sl-color-white);
|
||||
}
|
||||
|
||||
.sl-theme-dark sl-menu-item[disabled]::part(base) {
|
||||
|
|
Ładowanie…
Reference in New Issue