Reduce padding and margins for smaller screens

python · Jun 21, 2021 · 6bc4dd1 · 6bc4dd1
1 parent 387b19b
commit 6bc4dd1
Showing 1 changed file with 13 additions and 4 deletions.
diff --git a/pep_sphinx_extensions/pep_theme/static/mq.css b/pep_sphinx_extensions/pep_theme/static/mq.css
@@ -1,18 +1,28 @@
 @charset "UTF-8";
 /* Media Queries */
-@media (min-width: 0em) {
-    section#pep-page-section {
-        padding: .5rem 1rem 0;
+@media (max-width: 32.5em) {
+    /* Reduce padding & margins for the smallest screens */
+    section#pep-page-section > header > h1 {
+        padding-right: 0;
+        border-right: none;
+    }
+    ul.breadcrumbs {
+        padding: 0 0 .5rem;
     }
     nav#pep-sidebar {
         display: none;
     }
+    table th,
+    table td {
+        padding: 0 0.1rem;
+    }
 }
 @media (min-width: 32.5em) {
     section#pep-page-section {
         max-width: 40em;
         width: 100%;
         margin: 0 auto;
+        padding: .5rem 1rem 0;
     }
 }
 @media (min-width: 54em) {
@@ -30,7 +40,6 @@
         width: 24%;
         float: left;
         margin-right: 2%;
-        display: initial;
     }
 }
 @media (min-width: 60em) {