css: style search background separately from the header navbar.

Otherwise it's too much of a pain with bright-colored headers. No
visual change to the builtin themes, just adding flexibility for 3rd
party ones.

diff --git a/css/m-documentation.css b/css/m-documentation.css
index 6cea1aae2b2026d0f54e955d8f17c958684dcf8a..6c0966f6dc958faeacb70281ffc0d9b97f8631d6 100644 (file)
--- a/css/m-documentation.css
+++ b/css/m-documentation.css
@@ -234,7 +234,7 @@ a.m-doc-search-icon:focus svg, a.m-doc-search-icon:hover svg, a.m-doc-search-ico
   right: 0;
   top: 0;
   bottom: 0;
-  background-color: var(--header-background-color-landing);
+  background-color: var(--search-overlay-color);
 }
 .m-doc-search:target {
   display: block;
@@ -256,7 +256,7 @@ a.m-doc-search-icon:focus svg, a.m-doc-search-icon:hover svg, a.m-doc-search-ico
   float: right;
 }
 .m-doc-search-content {
-  background-color: var(--header-background-color);
+  background-color: var(--search-background-color);
   border-radius: var(--border-radius);
   padding: 1rem;
 }

diff --git a/css/m-theme-dark.css b/css/m-theme-dark.css
index 2a0d6232d6ed0f0c54ecaa4d49fbb86627c1a56f..d19f46891e9e765b41f2b2786d0661dc091f3947 100644 (file)
--- a/css/m-theme-dark.css
+++ b/css/m-theme-dark.css
@@ -83,6 +83,10 @@
   /* Cover image */
   --cover-image-background-color: #0f1217;
 
+  /* Search (used only by m-documentation.css) */
+  --search-overlay-color: var(--header-background-color-landing);
+  --search-background-color: var(--header-background-color);
+
   /* Article */
   --article-header-color: #f0f0f0;
   --article-footer-color: #c5c5c5;

diff --git a/css/m-theme-light.css b/css/m-theme-light.css
index e2f593f8f281d835efd875838c0b697bea883e1b..3896cb0e51f9621fb279a09273d09a2b7565d6c1 100644 (file)
--- a/css/m-theme-light.css
+++ b/css/m-theme-light.css
@@ -81,6 +81,10 @@
   /* Cover image */
   --cover-image-background-color: #666666;
 
+  /* Search (used only by m-documentation.css) */
+  --search-overlay-color: var(--header-background-color-landing);
+  --search-background-color: var(--header-background-color);
+
   /* Article */
   --article-header-color: #7a7a7a;
   --article-footer-color: #969696;