diff --git a/layouts/partials/logo.html b/layouts/partials/logo.html
index 4a2649eec9..2f8b9399ea 100644
--- a/layouts/partials/logo.html
+++ b/layouts/partials/logo.html
@@ -49,10 +49,10 @@
Relearn
\ No newline at end of file
diff --git a/static/css/theme.css b/static/css/theme.css
index aa260e8d84..e0608bcf87 100644
--- a/static/css/theme.css
+++ b/static/css/theme.css
@@ -105,14 +105,15 @@ th {
}
#header-wrapper {
- background-color: #7dc903; /* var(--MENU-HEADER-BG-color) */
+ /* initially use section background to avoid flickering on load when a
+ non default variant is active */
+ background-color: rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
color: #e0e0e0; /* var(--MENU-SEARCH-color) */
text-align: center;
- border-bottom: 4px solid #7dc903; /* var(--MENU-HEADER-BORDER-color) */
+ border-bottom: 4px solid rgba( 0, 0, 0, 0 ); /* var(--MENU-SECTIONS-BG-color) */
padding: 1rem;
position: relative;
}
-
#header a {
display: inline-block;
}
@@ -1490,6 +1491,13 @@ h6 a {
.default-animation{
transition: none;
}
+
+ /* our silly dinosaur browser wants to have the real colors */
+ #header-wrapper {
+ background-color: #7dc903; /* var(--MENU-HEADER-BG-color) */
+ border-bottom: 4px solid #7dc903; /* var(--MENU-HEADER-BORDER-color) */
+ }
+
/* clears the 'X' from Internet Explorer's search input */
input[type=search]::-ms-clear { display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal { display: none; width : 0; height: 0; }
@@ -1499,7 +1507,6 @@ h6 a {
.showVariantSwitch{
display: getamodernbrowser;
}
-
/* dumb IE11 doesn't understand initial, so we force a fallback here */
.showLangSwitch,
.showVisitedLinks,
diff --git a/static/css/variant.css b/static/css/variant.css
index a2c4198245..2d08c30965 100644
--- a/static/css/variant.css
+++ b/static/css/variant.css
@@ -23,7 +23,9 @@
--INTERNAL-TAG-BG-color: var(--TAG-BG-color, var(--INTERNAL-MENU-HEADER-BG-color));
- --INTERNAL-MENU-HEADER-BG-color: var(--MENU-HEADER-BG-color, #7dc903);
+ /* initially use section background to avoid flickering on load when a non default variant is active;
+ this is only possible because every color variant defines this variable, otherwise we would have been lost */
+ --INTERNAL-MENU-HEADER-BG-color: var(--MENU-HEADER-BG-color, rgba( 0, 0, 0, 0 ));
--INTERNAL-MENU-HEADER-BORDER-color: var(--MENU-HEADER-BORDER-color, var(--INTERNAL-MENU-HEADER-BG-color));
--INTERNAL-MENU-HOME-LINK-color: var(--MENU-HOME-LINK-color, #323232);