From 3119a7e4bf49305f98ba8fa45e8d8f74389aa3f6 Mon Sep 17 00:00:00 2001
From: Matt Ickstadt <mattico8@gmail.com>
Date: Wed, 25 Jul 2018 16:02:31 -0500
Subject: [PATCH] Fix several CSS bugs

---
 src/theme/css/chrome.css    | 8 ++++----
 src/theme/css/variables.css | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/theme/css/chrome.css b/src/theme/css/chrome.css
index 5c236284..fe15bb76 100644
--- a/src/theme/css/chrome.css
+++ b/src/theme/css/chrome.css
@@ -23,7 +23,7 @@ a > .hljs {
     position: sticky;
     top: 0;
     z-index: 101;
-    margin: auto (- var(--page-padding));
+    margin: auto calc(0px - var(--page-padding));
 }
 #menu-bar > #menu-bar-sticky-container {
     display: flex;
@@ -36,7 +36,7 @@ a > .hljs {
 .js #menu-bar > #menu-bar-sticky-container {
     transition: transform 0.3s;
 }
-.menu-bar.bordered > #menu-bar-sticky-container  {
+#menu-bar.bordered > #menu-bar-sticky-container  {
     border-bottom-color: var(--table-border-color);
 }
 #menu-bar i, #menu-bar .icon-button {
@@ -160,7 +160,7 @@ html:not(.sidebar-visible) #menu-bar:not(:hover).folded > #menu-bar-sticky-conta
     .nav-wrapper { display: block; }
 }
 
-@media only screen and (max-width: var(--page-plus-sidebar-width) + var(--sidebar-width)) {
+@media only screen and (max-width: calc(var(--page-plus-sidebar-width) + var(--sidebar-width))) {
     .sidebar-visible .nav-wide-wrapper { display: none; }
     .sidebar-visible .nav-wrapper { display: block; }
 }
@@ -309,7 +309,7 @@ ul#searchresults span.teaser em {
     line-height: 2em;
 }
 .sidebar-hidden .sidebar {
-    transform: translateX(- var(--sidebar-width));
+    transform: translateX(calc(0px - var(--sidebar-width)));
 }
 .sidebar::-webkit-scrollbar {
     background: var(--sidebar-bg);
diff --git a/src/theme/css/variables.css b/src/theme/css/variables.css
index 7e1c79a5..aea51b63 100644
--- a/src/theme/css/variables.css
+++ b/src/theme/css/variables.css
@@ -6,8 +6,8 @@
     --page-padding: 15px;
     --content-max-width: 750px;
     --content-min-width: 320px;
-    --page-plus-sidebar-width: var(--content-max-width) + var(--sidebar-width) + var(--page-padding) * 2;
-    --sidebar-reflow-width: var(--sidebar-width) + var(--content-min-width);
+    --page-plus-sidebar-width: calc(var(--content-max-width) + var(--sidebar-width) + var(--page-padding) * 2);
+    --sidebar-reflow-width: calc(var(--sidebar-width) + var(--content-min-width));
     --narrow-device-max-width: 420px;
 }