diff --git a/src/css/docsearch.css b/src/css/docsearch.css index a43f3e1832..552436c0f8 100644 --- a/src/css/docsearch.css +++ b/src/css/docsearch.css @@ -96,7 +96,7 @@ html[data-theme="dark"] { /* Modal */ --docsearch-modal-background: #090a15; /* Search box */ - --docsearch-searchbox-background: var(--ifm-background-color); + --docsearch-searchbox-background: var(--gray-900) !important; --docsearch-searchbox-focus-background: var(--gray-800) !important; /* Hit */ --docsearch-hit-color: var(--ifm-font-color-base); @@ -121,7 +121,7 @@ html[data-theme="dark"] { --docsearch-footer-shadow: 0px -4px 8px 0px #00000033, 0px 1px 0px 0px #494c6a80 inset; --docsearch-modal-shadow: 0px 3px 8px 0px #000309, 1px 1px 0px 0px #2c2e40 inset; --docsearch-muted-color: var(--gray-500); - --docsearch-searchbox-background: var(--ifm-background-color); + --docsearch-searchbox-background: var(--gray-900) !important; --docsearch-key-shadow: inset 0 -2px 0 0 #282d55, inset 0 0 1px 1px #51577d, 0 2px 2px 0 rgba(3, 4, 9, 0.3); diff --git a/src/css/theming.css b/src/css/theming.css index f6b2f97d4b..2143d7e182 100644 --- a/src/css/theming.css +++ b/src/css/theming.css @@ -5,6 +5,7 @@ } :root { + --docsearch-searchbox-background: var(--ifm-color-secondary); --docsearch-modal-width: 1248px; --ifm-color-primary: #2e8555; --ifm-color-primary-dark: #29784c; @@ -159,6 +160,7 @@ /* For readability concerns, you should choose a lighter palette in dark mode. */ /* PRIMITES WITH THEME DEFINED BY TOGGLER */ html[data-theme="dark"] { + --docsearch-searchbox-background: var(--gray-900) !important; --ifm-blockquote-border-color: transparent; --ifm-color-primary: #25c2a0; --ifm-color-primary-dark: #21af90; @@ -251,6 +253,7 @@ html[data-theme="dark"] { @media (prefers-color-scheme: dark) { /* Theme: Dark OS + Light docs = Light docs */ :root[data-theme="light"] { + --docsearch-searchbox-background: var(--ifm-color-secondary); --ifm-color-primary: #2e8555; --ifm-background-color: #fff; --ifm-color-primary-dark: #29784c; @@ -377,6 +380,7 @@ html[data-theme="dark"] { } :root[data-theme="dark"] { + --docsearch-searchbox-background: var(--gray-900) !important; --ifm-color-primary: #25c2a0; --ifm-color-primary-dark: #21af90; --ifm-color-primary-darker: #1fa588;