fix: fix various spacing issues (#238)

6 files changed, 39 insertions, 53 deletions

diff --git a/src/sass/_base.scss b/src/sass/_base.scss
index efe6a10..e44dab1 100644
--- a/src/sass/_base.scss
+++ b/src/sass/_base.scss
@@ -228,9 +228,14 @@ img {
       font-weight: normal;
     }
 
-    > :first-child {
+    > :first-child,
+    > :first-child > :first-child {
       margin-top: 0;
     }
+
+    section {
+      margin-top: $padding-32;
+    }
   }
 
   &__control {
@@ -310,11 +315,6 @@ img {
   &--main > ul > li > label > a {
     font-weight: bold;
   }
-
-  &--tags,
-  &--more {
-    padding-top: $padding-8;
-  }
 }
 
 .gdoc-nav__entry,
diff --git a/src/sass/_chroma_base.scss b/src/sass/_chroma_base.scss
index c8fdcc8..812df77 100644
--- a/src/sass/_chroma_base.scss
+++ b/src/sass/_chroma_base.scss
@@ -1,7 +1,6 @@
 @mixin chroma_base {
   .chroma {
     color: var(--code-font-color);
-    margin: 1rem 0;
   }
   .chroma code {
     background-color: var(--code-background);
@@ -45,7 +44,29 @@
     > pre.chroma code {
       padding: 1rem;
       width: 100%;
-      overflow: auto;
+      overflow-x: auto;
     }
   }
+
+  /* LineTable */
+  .chroma .lntable {
+    border-spacing: 0;
+    padding: 0;
+    margin: 0;
+    border: 0;
+    width: 100%;
+    display: block;
+  }
+  .chroma .lntable td:first-child code {
+    background-color: var(--code-accent-color-lite);
+    border-right: $border-1 solid var(--code-accent-color);
+    padding: 0.5em 0;
+  }
+  .chroma .lntable td code {
+    padding: 0.5em 0;
+  }
+  .chroma .lntable td:nth-child(2) {
+    width: 100%;
+    margin-left: 2em;
+  }
 }
diff --git a/src/sass/_chroma_dark.scss b/src/sass/_chroma_dark.scss
index 4275b11..d7e0af9 100644
--- a/src/sass/_chroma_dark.scss
+++ b/src/sass/_chroma_dark.scss
@@ -18,28 +18,6 @@
     margin: 0;
     border: 0;
   }
-  /* LineTable */
-  .chroma .lntable {
-    border-spacing: 0;
-    padding: 0;
-    margin: 0;
-    border: 0;
-    width: 100%;
-    overflow: auto;
-    display: block;
-  }
-  .chroma .lntable td:first-child code {
-    background-color: var(--code-accent-color-lite);
-    border-right: $border-1 solid var(--code-accent-color);
-    padding: 0.5em 0;
-  }
-  .chroma .lntable td code {
-    padding: 0.5em 0;
-  }
-  .chroma .lntable td:nth-child(2) {
-    width: 100%;
-    margin-left: 2em;
-  }
   /* LineHighlight */
   .chroma .hl {
     display: block;
diff --git a/src/sass/_chroma_light.scss b/src/sass/_chroma_light.scss
index 49d5662..bc43f82 100644
--- a/src/sass/_chroma_light.scss
+++ b/src/sass/_chroma_light.scss
@@ -19,28 +19,6 @@
     margin: 0;
     border: 0;
   }
-  /* LineTable */
-  .chroma .lntable {
-    border-spacing: 0;
-    padding: 0;
-    margin: 0;
-    border: 0;
-    width: 100%;
-    overflow: auto;
-    display: block;
-  }
-  .chroma .lntable td:first-child code {
-    background-color: var(--code-accent-color-lite);
-    border-right: $border-1 solid var(--code-accent-color);
-    padding: 0.5em 0;
-  }
-  .chroma .lntable td code {
-    padding: 0.5em 0;
-  }
-  .chroma .lntable td:nth-child(2) {
-    width: 100%;
-    margin-left: 2em;
-  }
   /* LineHighlight */
   .chroma .hl {
     display: block;
diff --git a/src/sass/_markdown.scss b/src/sass/_markdown.scss
index 905a13a..6bcd089 100644
--- a/src/sass/_markdown.scss
+++ b/src/sass/_markdown.scss
@@ -2,13 +2,18 @@
   line-height: 1.6em;
 
   > :first-child {
-    margin-top: 0;
+    margin-top: 0 !important;
   }
 
   &--nested {
     :first-child {
       margin-top: 0;
     }
+
+    > pre {
+      margin-top: 0 !important;
+    }
+
     > :last-child {
       margin-bottom: 0;
     }
diff --git a/src/sass/_mobile.scss b/src/sass/_mobile.scss
index a8bc829..811676f 100644
--- a/src/sass/_mobile.scss
+++ b/src/sass/_mobile.scss
@@ -60,6 +60,10 @@
     display: none;
   }
 
+  .flex-mobile-column {
+    flex-direction: column;
+  }
+
   .gdoc-footer {
     &__item--row {
       width: 100%;