mirror of
https://github.com/discourse/discourse.git
synced 2025-02-07 20:08:26 +00:00
0431942f3d
This new iteration of select-kit focuses on following best principales and disallowing mutations inside select-kit components. A best effort has been made to avoid breaking changes, however if you content was a flat array, eg: ["foo", "bar"] You will need to set valueProperty=null and nameProperty=null on the component. Also almost every component should have an `onChange` handler now to decide what to do with the updated data. **select-kit will not mutate your data by itself anymore**
58 lines
1.1 KiB
SCSS
58 lines
1.1 KiB
SCSS
.select-kit {
|
|
&.dropdown-select-box {
|
|
&.toolbar-popup-menu-options {
|
|
.select-kit-body {
|
|
box-shadow: none;
|
|
padding: 0.5em 0.5em 0.25em 0.5em;
|
|
width: 230px;
|
|
}
|
|
|
|
.toolbar-popup-menu-options-heading {
|
|
width: 100%;
|
|
}
|
|
|
|
.select-kit-row {
|
|
margin-bottom: 0.25em;
|
|
padding: 0.5em 0.25em;
|
|
background: $primary-low;
|
|
transition: all 0.25s;
|
|
|
|
.name,
|
|
.d-icon {
|
|
font-size: $font-0;
|
|
font-weight: normal;
|
|
color: $primary;
|
|
}
|
|
|
|
.d-icon {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
&.is-highlighted {
|
|
background: $primary-medium;
|
|
|
|
.name,
|
|
.d-icon {
|
|
color: $secondary;
|
|
}
|
|
}
|
|
|
|
&:hover {
|
|
background: $primary-medium;
|
|
color: $secondary;
|
|
}
|
|
|
|
&.is-selected {
|
|
color: $primary;
|
|
background: $primary-low;
|
|
}
|
|
|
|
&.is-selected.is-highlighted {
|
|
background: $primary-medium;
|
|
color: $primary;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|