feat:移植工程

src/styles/blog/blog.archive.module.scss

@@ -0,0 +1,51 @@
+@use "blog.variable.module.scss" as blog;
+
+.blog-archive {
+  display: flex;
+  flex-direction: column;
+  gap: 3vh;
+  padding: 10vh 2vw;
+
+  ::v-deep(.el-date-editor) {
+    align-self: center;
+  }
+
+  .total {
+    align-self: center;
+    font-size: blog.$normal-font-size;
+    color: blog.$normal-text-color;
+  }
+
+  .time-line {
+    height: 100%;
+    padding: 10px;
+    overflow: auto;
+
+    .item {
+      height: 5vh;
+
+      .date {
+        color: blog.$normal-text-color;
+        margin-right: 5px;
+      }
+
+      .title {
+        font-size: blog.$normal-font-size;
+        color: blog.$normal-text-color;
+        cursor: pointer;
+        text-decoration: underline;
+        text-underline-offset: 0.2rem;
+      }
+
+      .title:hover {
+        color: blog.$hover-text-color;
+      }
+    }
+  }
+}
+
+@media screen and (max-width: 768px) {
+  .blog-archive {
+    padding: 20px 10px;
+  }
+}