From 6c3e24396221368e25d7a72081f34ae1d08daabb Mon Sep 17 00:00:00 2001 From: Jens Langhammer Date: Thu, 4 Jan 2024 15:48:03 +0100 Subject: [PATCH] start on dark theme support Signed-off-by: Jens Langhammer --- .../elements/ak-dual-select/components/styles.css.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/web/src/elements/ak-dual-select/components/styles.css.ts b/web/src/elements/ak-dual-select/components/styles.css.ts index f2c057bf6..bb71c377c 100644 --- a/web/src/elements/ak-dual-select/components/styles.css.ts +++ b/web/src/elements/ak-dual-select/components/styles.css.ts @@ -89,6 +89,16 @@ export const globalVariables = css` --pf-c-dual-list-selector--selection-desc--FontSize: var(--pf-global--FontSize--xs); --pf-c-dual-list-selector--selection-desc--Color: var(--pf-global--Color--dark-200); } + :host([theme="dark"]) { + --pf-c-dual-list-selector__menu--BorderColor: var(--ak-dark-background-lighter); + --pf-c-dual-list-selector__item-text--Color: var(--ak-dark-foreground); + --pf-c-dual-list-selector__list-item-row--BackgroundColor: var( + --ak-dark-background-light-ish + ); + --pf-c-dual-list-selector__list-item-row--hover--BackgroundColor: var( + --ak-dark-background-lighter; + ); + } `; export const mainStyles = css`