Merge pull request iissnan#1526 from Asing1001/master

Adjust code block display in mobile for better UX
habren · Mar 30, 2017 · ed476ee · ed476ee
2 parents c8e1cf5 + 83be732
commit ed476ee
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/source/css/_common/components/highlight/highlight.styl b/source/css/_common/components/highlight/highlight.styl
@@ -81,6 +81,7 @@ pre {
   }
 
   .code pre {
+    width: 100%
     padding-left: 10px
     padding-right: 10px
     background-color: $highlight-background

diff --git a/source/css/_common/components/post/post-expand.styl b/source/css/_common/components/post/post-expand.styl
@@ -10,12 +10,21 @@
   }
 
   .post-body {
-    pre, .highlight {
+    pre {
       padding: 10px;
       .gutter pre {
         padding-right: 10px;
       }
     }
+
+    .highlight {
+      margin-left: -40px;
+      margin-right: -40px;
+      padding: 0;
+      .gutter pre {
+        padding-right: 10px;
+      }
+    }
   }
 }