@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
49 lines (46 loc) • 2.16 kB
CSS
/*
* Autocomplete theme
*
*/
/*
* Utilities
*/
.dnb-autocomplete--open .dnb-input .dnb-input__shell .dnb-input__shell, .dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover ~ .dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell {
--border-color: var(--token-color-stroke-action-hover);
--border-width: 0.125rem;
box-shadow: 0 0 0 var(--border-width) var(--border-color);
border-color: transparent;
}
.dnb-autocomplete--open .dnb-input .dnb-input__shell .dnb-input__submit-button__button, .dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover ~ .dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__submit-button__button {
border-radius: 0;
color: var(--token-color-text-neutral-inverse);
background-color: var(--token-color-background-action-pressed);
box-shadow: none;
}
.dnb-autocomplete--show-indicator .dnb-autocomplete__input .dnb-input__icon {
color: transparent;
}
.dnb-autocomplete__shell, .dnb-autocomplete__input {
border-radius: var(--autocomplete-border-radius);
}
.dnb-autocomplete__status--error:not(.dnb-autocomplete--open) .dnb-form-label:hover ~ .dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell {
--border-color: var(--token-color-stroke-error);
--border-width: 0.125rem;
box-shadow: 0 0 0 var(--border-width) var(--border-color);
border-color: transparent;
}
.dnb-autocomplete__root .dnb-drawer-list__option__item:nth-of-type(1) {
font-weight: var(--font-weight-basis);
}
.dnb-autocomplete__root .dnb-drawer-list__option:not([disabled]) .dnb-drawer-list__option__item:nth-of-type(n + 2) {
color: var(--token-color-text-neutral-alternative);
}
.dnb-autocomplete__root .dnb-drawer-list__option__item--highlight {
font-weight: var(--font-weight-bold);
}
.dnb-autocomplete__root .dnb-drawer-list__option--selected:not([disabled]) .dnb-drawer-list__option__item:nth-of-type(n + 2) {
color: var(--token-color-text-neutral-inverse);
}
.dnb-autocomplete__root .dnb-drawer-list__option--selected .dnb-anchor {
color: var(--token-color-text-neutral-inverse);
}