html压缩+图片同步

themes/yilia/source-src/css/core/_reset.scss

@@ -158,19 +158,19 @@ svg:not(:root) {
 
 // 1. Contain overflow in all browsers.
 // 2. Improve readability of pre-formatted text in all browsers.
-pre {
-  overflow: auto; // 1
-  white-space: pre; // 2
-  white-space: pre-wrap; // 2
-  word-wrap: break-word; // 2
-}
+// pre {
+//   overflow: auto; // 1
+//   white-space: pre; // 2
+//   white-space: pre-wrap; // 2
+//   word-wrap: break-word; // 2
+// }
 
 // 1. Address odd `em`-unit font size rendering in all browsers.
 code,
 kbd,
 pre,
 samp {
-  font-family: monospace, monospace; // 1
+  font-family: monospace; // 1
   font-size: 1em; // 2
 }
 

themes/yilia/source-src/css/highlight.scss

@@ -1,12 +1,10 @@
 .article-entry pre,
 .article-entry .highlight {
-  background: #272822;
   margin: 10px 0;
-  padding: 10px 10px;
   overflow: auto;
   color: #fff;
   font-size: 0.9em;
-  line-height: 22.400000000000002px;
+  line-height: 22.4px;
 }
 .article-entry .highlight .gutter pre,
 .article-entry .highlight .gutter pre .line,
@@ -31,47 +29,52 @@
 
 .article-entry .highlight {
   border-radius: 4px;
-}
-.article-entry .highlight pre {
-  border: none;
-  margin: 0;
-  padding: 0;
-}
-.article-entry .highlight table {
-  margin: 0;
-  width: auto;
-}
-.article-entry .highlight td {
-  border: none;
-  padding: 0;
+  pre {
+    border: none;
+    margin: 0;
+    padding: 0;
+  }
+  table {
+    margin: 0;
+    width: auto;
+  }
+  td {
+    border: none;
+    padding: 0;
+    &.gutter {
+      background-color: #000;
+      pre {
+        text-align: right;
+        padding: 0 10px;
+        text-shadow: none;
+      }
+    }
+    &.code {
+      background-color: #363636;
+      padding: 10px;
+    }
+  }
+  .line {
+    min-height: 19px;
+  }
 }
 .article-entry .highlight figcaption {
   color: highlight-comment;
   line-height: 1em;
   margin-bottom: 1em;
+  &::after {
+    clear: both;
+  }
+  a {
+    float: right;
+  }
 }
-.article-entry .highlight figcaption:before,
-.article-entry .highlight figcaption:after {
+.article-entry .highlight figcaption::before,
+.article-entry .highlight figcaption::after {
   content: "";
   display: table;
 }
-.article-entry .highlight figcaption:after {
-  clear: both;
-}
-.article-entry .highlight figcaption a {
-  float: right;
-}
-.article-entry .highlight .gutter pre {
-  text-align: right;
-  padding-right: 20px;
-}
-.article-entry .highlight .gutter pre .line {
-  text-shadow: none;
-}
-.article-entry .highlight .line {
-  color: #fff;
-  min-height: 19px;
-}
+
 .article-entry .gist {
   margin: 0 -20px;
   border-style: solid;