Fixed issue sphinx-doc#54 - incorrect breakpoints causing clipping

Also now respects theme_page_width for layout switching.
spookylukey · Jul 22, 2020 · 3cbfd7b · 3cbfd7b
1 parent 3b68afc
commit 3cbfd7b
Showing 1 changed file with 18 additions and 70 deletions.
diff --git a/alabaster/static/alabaster.css_t b/alabaster/static/alabaster.css_t
@@ -550,67 +550,14 @@ a:hover tt, a:hover code {
 }
 
 
-@media screen and (max-width: 870px) {
-
-    div.sphinxsidebar {
-    	display: none;
-    }
-
-    div.document {
-       width: 100%;
-
-    }
-
-    div.documentwrapper {
-    	margin-left: 0;
-    	margin-top: 0;
-    	margin-right: 0;
-    	margin-bottom: 0;
-    }
-
-    div.bodywrapper {
-    	margin-top: 0;
-    	margin-right: 0;
-    	margin-bottom: 0;
-    	margin-left: 0;
-    }
-
-    ul {
-    	margin-left: 0;
-    }
-
-	li > ul {
-        /* Matches the 30px from the "ul, ol" selector above */
-		margin-left: 30px;
-	}
-
-    .document {
-    	width: auto;
-    }
-
-    .footer {
-    	width: auto;
-    }
-
-    .bodywrapper {
-    	margin: 0;
-    }
-
-    .footer {
-    	width: auto;
-    }
-
-    .github {
-        display: none;
-    }
-
-
-
+{%- if theme_fixed_sidebar|lower == 'true' %}
+div.sphinxsidebar {
+    position: fixed;
+    margin-left: 0;
 }
+{%- endif %}
 
-
-
-@media screen and (max-width: 875px) {
+@media screen and (max-width: {{ theme_page_width }}) {
 
     body {
         margin: 0;
@@ -620,6 +567,10 @@ a:hover tt, a:hover code {
     div.documentwrapper {
         float: none;
         background: {{ theme_base_bg }};
+        margin-left: 0;
+        margin-top: 0;
+        margin-right: 0;
+        margin-bottom: 0;
     }
 
     div.sphinxsidebar {
@@ -628,6 +579,7 @@ a:hover tt, a:hover code {
         width: 102.5%;
         {%- if theme_fixed_sidebar|lower == 'true' %}
         margin: -20px -30px 20px -30px;
+        position: static;
         {%- else %}
         margin: 50px -30px -20px -30px;
         {%- endif %}
@@ -679,23 +631,19 @@ a:hover tt, a:hover code {
         width: auto;
     }
 
-    .footer {
-        width: auto;
-    }
-
     .github {
         display: none;
     }
-}
 
-{%- if theme_fixed_sidebar|lower == 'true' %}
-@media screen and (min-width: 876px) {
-    div.sphinxsidebar {
-        position: fixed;
-        margin-left: 0;
+    ul {
+    	margin-left: 0;
+    }
+
+    li > ul {
+       /* Matches the 30px from the "ul, ol" selector above */
+        margin-left: 30px;
     }
 }
-{%- endif %}
 
 
 /* misc. */