feat(centralui): compact multi-select dropdowns for the audit filter bar
Replace the four stacked chip-button groups (Channel, Kind, Status, Site) on the Audit Log filter bar with a reusable MultiSelectDropdown component, so the bar collapses from four full-width chip blocks to four inline dropdowns sharing one wrapped filter row. Bootstrap dropdown + checkbox menu (data-bs-auto-close =outside); no third-party UI libraries.
This commit is contained in:
@@ -0,0 +1,32 @@
|
||||
/* Compact multi-select dropdown. Tuned to sit inline with form-select-sm /
|
||||
form-control-sm controls in a filter row. */
|
||||
|
||||
.msd-toggle {
|
||||
min-width: 9rem;
|
||||
max-width: 15rem;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* Keep a long option list from running off-screen — scroll within the menu. */
|
||||
.msd-menu {
|
||||
max-height: 16rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* The whole row is a <label> so a click anywhere toggles the checkbox; the
|
||||
menu stays open thanks to data-bs-auto-close="outside". */
|
||||
.msd-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Neutralise the default form-check-input top margin so the box lines up with
|
||||
the option text inside the dropdown-item. */
|
||||
.msd-check {
|
||||
flex: 0 0 auto;
|
||||
margin: 0;
|
||||
}
|
||||
Reference in New Issue
Block a user