@lyra/base
Version:
Lyra plugin containing the base components and roles for a Lyra configuration
44 lines (34 loc) • 1 kB
CSS
@import 'part:@lyra/base/theme/variables-style';
.item {
background-color: var(--selectable-item-color);
color: var(--selectable-item-text-color);
cursor: default;
transition: background-color 0.1s linear;
@nest &:hover {
transition: background-color 0.1s linear;
@media (--screen-medium) {
background-color: var(--selectable-item-color-hover);
color: var(--selectable-item-color-hover--inverted);
}
}
@nest &:focus {
outline: none;
@media (--screen-medium) {
background-color: var(--selectable-item-color-focus);
color: var(--selectable-item-color-focus--inverted);
}
}
@nest &:active {
background-color: var(--selectable-item-color-active);
}
}
.selected {
background-color: var(--selected-item-color);
color: var(--selected-item-color--inverted);
}
.highlighted {
background-color: var(--selectable-item-color-highlighted);
@nest &.selected {
background-color: var(--selectable-item-color-highlighted);
}
}