refacotr(css): Refactor css for easy maintenance

1. Refactored CSS for robustness 2. Add dark-mode choose 3. Add sans and serif
2022-01-17 19:51:11 +08:00
parent 468c390ea7
commit 4682bede9f
26 changed files with 2519 additions and 2872 deletions
--- a/source/css/pages/_post.scss
+++ b/source/css/pages/_post.scss
@@ -0,0 +1,60 @@
+@import "../base/variables";
+
+// 文章
+.post {
+    >.title {
+        margin-top: 4rem;
+
+        >h1 {
+            >a {
+                letter-spacing: 0.0625rem;
+                font-size: 2rem;
+                line-height: 2rem;
+                color: #262626;
+
+                @include darkmode {
+                    color: #dbdbdb;
+                }
+
+                &:hover {
+                    color: #26262680;
+
+                    @include darkmode {
+                        color: #dbdbdb80;
+                    }
+                }
+            }
+        }
+
+        >.info {
+            padding-bottom: 1rem;
+            margin-bottom: 1rem;
+            border-bottom: 1px solid #d9d9d9;
+
+            @include darkmode {
+                border-bottom: 1px solid #434343;
+            }
+
+            >span {
+                margin: 0 0.25rem;
+                font-weight: 400;
+                font-size: 0.75rem;
+                color: #8c8c8c;
+
+                @include darkmode {
+                    color: #7d7d7d;
+                }
+
+                i {
+                    position: relative;
+                    top: 0.125rem;
+                    color: #8c8c8c;
+
+                    @include darkmode {
+                        color: #7d7d7d;
+                    }
+                }
+            }
+        }
+    }
+}