css: make it possible to specify a different color for header breadcrumb.

With brightly-colored headers the usual dim color doesn't make sense.
No visual change to the builtin themes, only adding flexibility for 3rd
party styles.

diff --git a/css/m-layout.css b/css/m-layout.css
index 71d246c932c4ac4b8ecb1b0752bd8612668fff3e..5d22db0e0e78e0a3add323d2dd0d1382798e49e3 100644 (file)
--- a/css/m-layout.css
+++ b/css/m-layout.css
@@ -86,7 +86,7 @@ body > header > nav #m-navbar-brand .m-thin {
   font-weight: normal;
 }
 body > header > nav #m-navbar-brand .m-breadcrumb {
-  color: var(--dim-color);
+  color: var(--header-breadcrumb-color);
 }
 body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before {
   content:'\2630';

diff --git a/css/m-theme-dark.css b/css/m-theme-dark.css
index d19f46891e9e765b41f2b2786d0661dc091f3947..cdefaebca27bcad839fe467df0134c5f33cd4ed9 100644 (file)
--- a/css/m-theme-dark.css
+++ b/css/m-theme-dark.css
@@ -64,6 +64,7 @@
   /* Header */
   --header-border-width: 0 0 0.25rem 0;
   --header-color: #ffffff;
+  --header-breadcrumb-color: #747474; /* same as --dim-color */
   --header-background-color: #22272e;
   --header-background-color-landing: rgba(34, 39, 46, 0.75);
   --header-background-color-jumbo: rgba(34, 39, 46, 0.25);

diff --git a/css/m-theme-light.css b/css/m-theme-light.css
index 3896cb0e51f9621fb279a09273d09a2b7565d6c1..cbed31a27699420376ec242d936c8cd9e507bbf0 100644 (file)
--- a/css/m-theme-light.css
+++ b/css/m-theme-light.css
@@ -62,6 +62,7 @@
   /* Header */
   --header-border-width: 0.25rem 0 0 0;
   --header-color: #000000;
+  --header-breadcrumb-color: #bdbdbd; /* same as --dim-color */
   --header-background-color: #ffffff;
   --header-background-color-landing: rgba(255, 255, 255, 0.75);
   --header-background-color-jumbo: rgba(255, 255, 255, 0.25);