Skip to content

Commit 07a4550

Browse files
committed
feat(MultiSelect): add dark theme support
1 parent 842d414 commit 07a4550

File tree

1 file changed

+77
-23
lines changed

1 file changed

+77
-23
lines changed

scss/themes/dark/_variables.scss

Lines changed: 77 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -342,6 +342,59 @@ $form-select-theme-map: (
342342
// "form-select-disabled-border-color": $form-select-disabled-border-color-dt,
343343
) !default;
344344

345+
$form-multi-select-color-dt: $input-color-dt !default;
346+
$form-multi-select-bg-dt: $input-bg-dt !default;
347+
$form-multi-select-border-color-dt: $input-border-color-dt !default;
348+
349+
$form-multi-select-focus-color-dt: $input-focus-color-dt !default;
350+
$form-multi-select-focus-bg-dt: $input-focus-bg-dt !default;
351+
$form-multi-select-focus-border-color-dt: $input-focus-border-color-dt !default;
352+
353+
$form-multi-select-disabled-color-dt: $disabled-dt !default;
354+
$form-multi-select-disabled-bg-dt: $input-disabled-bg-dt !default;
355+
356+
// $form-multi-select-tag-bg: $light !default;
357+
$form-multi-select-tag-border-color-dt: $input-border-color-dt !default;
358+
359+
$form-multi-select-search-color-dt: $input-color-dt !default;
360+
$form-multi-select-search-bg-dt: transparent !default;
361+
$form-multi-select-search-border-color-dt: $input-border-color-dt !default;
362+
363+
$form-multi-select-options-color-dt: $body-color-dt !default;
364+
$form-multi-select-options-bg-dt: $bg-elevation-8 !default;
365+
$form-multi-select-options-border-color-dt: $input-border-color-dt !default;
366+
367+
$form-multi-select-option-hover-color-dt: $body-color-dt !default;
368+
$form-multi-select-option-hover-bg-dt: $light-dt !default;
369+
370+
$form-multi-select-option-selected-bg-dt: $light-dt !default;
371+
// $form-multi-select-option-selected-indicator-bg: $form-check-input-checked-bg-color !default;
372+
// $form-multi-select-option-selected-indicator-bg-image: $form-check-input-checked-bg-image !default;
373+
// $form-multi-select-option-selected-indicator-border-color: $form-multi-select-option-selected-indicator-bg !default;
374+
375+
// $form-multi-select-option-disabled-color: $gray-600 !default;
376+
377+
$form-multi-select-theme-map: (
378+
"form-multi-select-color": $form-multi-select-color-dt,
379+
"form-multi-select-bg": $form-multi-select-bg-dt,
380+
"form-multi-select-border-color": $form-multi-select-border-color-dt,
381+
"form-multi-select-disabled-color": $form-multi-select-disabled-color-dt,
382+
"form-multi-select-disabled-bg": $form-multi-select-disabled-bg-dt,
383+
"form-multi-select-focus-color": $form-multi-select-focus-color-dt,
384+
"form-multi-select-focus-bg": $form-multi-select-focus-bg-dt,
385+
"form-multi-select-focus-border-color": $form-multi-select-focus-border-color-dt,
386+
"form-multi-select-tag-border-color": $form-multi-select-tag-border-color-dt,
387+
"form-multi-select-search-color": $form-multi-select-search-color-dt,
388+
"form-multi-select-search-bg": $form-multi-select-search-bg-dt,
389+
"form-multi-select-search-border-color": $form-multi-select-search-border-color-dt,
390+
"form-multi-select-options-color": $form-multi-select-options-color-dt,
391+
"form-multi-select-options-bg": $form-multi-select-options-bg-dt,
392+
"form-multi-select-options-border-color": $form-multi-select-options-border-color-dt,
393+
"form-multi-select-option-hover-color": $form-multi-select-option-hover-color-dt,
394+
"form-multi-select-option-hover-bg": $form-multi-select-option-hover-bg-dt,
395+
"form-multi-select-option-selected-bg": $form-multi-select-option-selected-bg-dt,
396+
) !default;
397+
345398
// Header
346399

347400
$header-bg-dt: $bg-elevation-3 !default;
@@ -649,32 +702,33 @@ $toast-theme-map: (
649702
// --cui-tooltip-color
650703

651704
$theme-map: (
652-
"root": map-merge($theme-root-dt, $link-theme-map),
705+
"root": map-merge($theme-root-dt, $link-theme-map),
653706
"utilities": (
654-
"bg": $theme-colors-dt,
655-
"text": $theme-colors-dt
707+
"bg": $theme-colors-dt,
708+
"text": $theme-colors-dt
656709
),
657-
"accordion": $accordion-theme-map,
710+
"accordion": $accordion-theme-map,
658711
// "alert": $alert-theme-variants-dt,
659-
"breadcrumb": $breadcrumb-theme-map,
712+
"breadcrumb": $breadcrumb-theme-map,
660713
// "btn": $button-theme-variants-dt,
661714
// "btn-outline": $button-outline-theme-variants-dt,
662-
"btn-close": $close-theme-map,
663-
"card": $card-theme-map,
664-
"dropdown": $dropdown-theme-map,
665-
"footer": $footer-theme-map,
666-
"form-control": $form-control-theme-map,
667-
"form-check": $form-check-theme-map,
668-
"form-select": $form-select-theme-map,
669-
"header": $header-theme-map,
670-
"input-group": $input-group-theme-map,
671-
"list-group": $list-group-theme-map,
672-
"modal": $modal-theme-map,
673-
"nav": $nav-theme-map,
674-
"pagination": $pagination-theme-map,
675-
"popover": $popover-theme-map,
676-
"progress": $progress-theme-map,
677-
"sidebar": $sidebar-theme-map,
678-
"table": map-merge($table-theme-map, $table-variants-dt),
679-
"toast": $toast-theme-map
715+
"btn-close": $close-theme-map,
716+
"card": $card-theme-map,
717+
"dropdown": $dropdown-theme-map,
718+
"footer": $footer-theme-map,
719+
"form-control": $form-control-theme-map,
720+
"form-check": $form-check-theme-map,
721+
"form-select": $form-select-theme-map,
722+
"form-multi-select": $form-multi-select-theme-map,
723+
"header": $header-theme-map,
724+
"input-group": $input-group-theme-map,
725+
"list-group": $list-group-theme-map,
726+
"modal": $modal-theme-map,
727+
"nav": $nav-theme-map,
728+
"pagination": $pagination-theme-map,
729+
"popover": $popover-theme-map,
730+
"progress": $progress-theme-map,
731+
"sidebar": $sidebar-theme-map,
732+
"table": map-merge($table-theme-map, $table-variants-dt),
733+
"toast": $toast-theme-map
680734
) !default;

0 commit comments

Comments
 (0)