feat: 自定义vitepress主题

test/.vitepress/theme/index.ts

@@ -0,0 +1,12 @@
+import { CustomTheme } from 'custom-vitepress-theme'
+import { h } from 'vue'
+
+import './override.css'
+
+export default {
+  ...CustomTheme,
+  Layout() {
+    return h(CustomTheme.Layout, null, {
+    })
+  }
+}

test/.vitepress/theme/override.css

@@ -0,0 +1,97 @@
+:root {
+  --c-main-color:#80adff;
+}
+
+
+/* card */
+
+.news-box {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  margin: 0 auto;
+  padding: 20px 0;
+}
+.news-box .card-item {
+  flex-basis: 25%;
+  padding: 15px;
+  transition: all 0.3s ease;
+}
+.news-box .card-item .item-box {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  border-radius: 15px;
+  padding: 15px;
+  margin-bottom: 140px;
+  background: #f8f8fc;
+  transition: all 0.3s ease;
+}
+.news-box .card-item .item-box .icon {
+  font-size: 48px;
+  color: var(--c-main-color);
+}
+.news-box .card-item .item-box .title {
+  font-size: 18px;
+  line-height: 2;
+  font-weight: 500;
+  color: #020312;
+}
+.news-box .card-item .item-box .desc {
+  font-size: 16px;
+  line-height: 2;
+  color: #717e96;
+  overflow: hidden;
+}
+.news-box .card-item .item-box .desc {
+  font-size: 16px;
+  line-height: 2;
+  color: #717e96;
+}
+.news-box .card-item:hover .item-box {
+  background: var(--c-main-color);
+  transition: all 0.3s ease;
+}
+.news-box .card-item .item-box.active {
+  background: var(--c-main-color);
+  margin-bottom: 0;
+}
+
+.news-box .card-item:hover .item-box .icon,
+.news-box .card-item:hover .item-box .title,
+.news-box .card-item:hover .item-box .desc,
+.news-box .card-item .item-box.active .icon,
+.news-box .card-item .item-box.active .title,
+.news-box .card-item .item-box.active .desc {
+  color: #fff;
+}
+@media (max-width: 1200px) {
+  .banner .banner-left {
+    font-size: 14px;
+  }
+  .banner .banner-left .desc {
+    font-size: 12px;
+  }
+  .note-box {
+    flex-wrap: wrap;
+  }
+  .note-box .note-item {
+    flex-basis: 100%;
+  }
+  .news-box {
+    flex-wrap: wrap;
+  }
+  .news-box .card-item {
+    flex-basis: 100%;
+  }
+  .news-box .card-item .item-box {
+    margin-bottom: 0;
+  }
+
+  .news-box .card-item .item-box .title {
+    font-size: 14px;
+  }
+  .news-box .card-item .item-box .desc {
+    font-size: 12px;
+  }
+}