Improve the image style.

cotes2020 · cotes2020 · commit d473c7140e04 · 2020-09-02T22:07:14.000+08:00
diff --git a/assets/css/_addon/main.scss b/assets/css/_addon/main.scss
@@ -734,6 +734,10 @@ a {
 
 } // a
 
+img {
+  max-width: 100%;
+}
+
 .post {
   h1 {
     margin-top: 3rem;
@@ -823,20 +827,14 @@ div.post-content .table-wrapper {
   }
   p {
     font-size: 1.08rem;
-  }
-  img {
-    max-width: 100%;
-    margin-top: .5rem;
-    margin-bottom: 1.5rem;
-    position: relative;
-    left: 50%;
-    -webkit-transform: translateX(-50%);
-    -ms-transform: translateX(-50%);
-    transform: translateX(-50%);
+    > img {
+      margin-top: .5rem;
+      margin-bottom: 1.5rem;
+      @include align-center;
+    }
   }
 }
 
-
 .tag:hover {
   @extend %tag-hover;
 }
diff --git a/assets/css/_addon/module.scss b/assets/css/_addon/module.scss
@@ -98,3 +98,11 @@
   font-weight: $font-weight;
   font-family: 'Roboto Condensed', 'Microsoft Yahei', sans-serif;
 }
+
+@mixin align-center {
+  position: relative;
+  left: 50%;
+  -webkit-transform: translateX(-50%);
+  -ms-transform: translateX(-50%);
+  transform: translateX(-50%);
+}
diff --git a/assets/css/post.scss b/assets/css/post.scss
@@ -45,6 +45,7 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
   .post-preview-img {
     margin-top: 0;
     margin-bottom: 2.5rem;
+    @include align-center;
   }
 }
 
@@ -341,19 +342,10 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
 
 /* Hide SideBar and TOC */
 @media all and (max-width: 830px) {
-  .post img {
-    position: relative;
-    left: 50%;
-    -webkit-transform: translateX(-50%);
-    -ms-transform: translateX(-50%);
-    transform: translateX(-50%);
-  }
-
   .post-navigation {
     padding-left: 0;
     padding-right: 0;
     margin-left: -.5rem;
     margin-right: -.5rem;
   }
-
 }
