docs: 优化文档 css (#653)

web/.vitepress/theme/components/HomeAuthorize.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="authorize">
+  <div class="home">
     <div class="container">
       <h2>授权</h2>
       <h3>类库</h3>
@@ -21,26 +21,12 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@media (min-width: 640px) {
+@import '../css/home';
-  .authorize {
-    padding: 0 48px;
-  }
-}
-@media (min-width: 960px) {
-  .authorize {
-    padding: 0 64px;
-  }
-}
 
-.authorize {
+.home {
   margin-top: 50px;
-  padding: 0 24px;
-}
 
   .container {
-  max-width: 1152px;
-  margin: 0 auto;
-
     p {
       display: block;
       margin-block-start: 1em;
@@ -76,4 +62,5 @@ export default {
       margin-inline-end: 0;
     }
   }
+}
 </style>

web/.vitepress/theme/components/HomePrimary.vue

@@ -16,26 +16,12 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@media (min-width: 640px) {
+@import '../css/home';
-  .home {
-    padding: 0 48px;
-  }
-}
-@media (min-width: 960px) {
-  .home {
-    padding: 0 64px;
-  }
-}
 
 .home {
-  margin-bottom: 50px;
-  padding: 0 24px;
-}
-
   .container {
-  max-width: 1152px;
+    margin-bottom: 50px;
     text-align: center;
-  margin: 0 auto;
 
     img {
       display: inline-block;
@@ -48,7 +34,6 @@ export default {
       border-width: 2px;
       border-style: solid;
       border-radius: 4px;
-    transition: background-color var(--t-color);
       box-sizing: border-box;
 
       &.primary {
@@ -58,4 +43,5 @@ export default {
       }
     }
   }
+}
 </style>

web/.vitepress/theme/css/home.scss

@@ -0,0 +1,19 @@
+@media (min-width: 640px) {
+    .home {
+        padding: 0 48px;
+    }
+}
+@media (min-width: 960px) {
+    .home {
+        padding: 0 64px;
+    }
+}
+
+.home {
+    padding: 0 24px;
+
+    .container {
+        max-width: 1152px;
+        margin: 0 auto;
+    }
+}