feat: web site update

hellof2e · Apr 9, 2024 · e411034 · e411034
1 parent 665648e
commit e411034
Show file tree

Hide file tree

Showing 4 changed files with 344 additions and 9 deletions.
diff --git a/src/assets/styles/theme.scss b/src/assets/styles/theme.scss
@@ -25,14 +25,25 @@
   --text-code-font-color: #476582;
 
   animation: rainbow 40s linear infinite;
+
+  --vp-c-white: #ffffff;
+  --vp-c-black: #000000;
+  --vp-c-neutral: var(--vp-c-black);
+  --vp-c-neutral-inverse: var(--vp-c-white);
+
   --vp-nav-height: 64px;
   --vp-button-brand-bg: var(--vp-c-brand-1);
   --vp-home-hero-name-color: transparent;
   --vp-home-hero-name-background: -webkit-linear-gradient(120deg, var(--vp-c-brand-1) 30%, var(--vp-c-brand-next));
   --vp-home-hero-image-background-image: linear-gradient(-45deg, var(--vp-c-brand-1) 30%, var(--vp-c-brand-next));
   --vp-home-hero-image-filter: blur(80px);
 
-
+  --vp-c-brand-1: #00a98e;
+  --vp-c-brand-light: #4ad1b4;
+  --vp-c-brand-lighter: #78fadc;
+  --vp-c-brand-dark: #008269;
+  --vp-c-brand-darker: #005d47;
+  --vp-c-brand-next: #009ff7;
   --vp-button-brand-border: var(--vp-c-brand-light);
   --vp-button-brand-text: var(--vp-c-white);
   --vp-button-brand-hover-border: var(--vp-c-brand-light);

diff --git a/src/views/Main.vue b/src/views/Main.vue
@@ -14,7 +14,7 @@
 
           <div class="actions">
             <a
-              class="get-started"
+              class="link-btn get-started"
               :href="`${
                 isZhLang ? `#/zh-CN/docs/introduce` : `#/en-US/docs/introduce`
               }`"

diff --git a/src/views/main.scss b/src/views/main.scss
@@ -83,23 +83,24 @@
   padding-top: 32px;
 }
 
-.get-started {
+.link-btn {
   display: flex;
   align-items: center;
   text-align: center;
   padding: 0 1.25rem;
   border-radius: 100px;
   font-size: 16px;
-  background-color: var(--vp-button-brand-bg);
-  color: #fff;
   font-weight: 600;
   transition: background-color .2s ease-out;
+}
+.get-started {
+  background-color: var(--vp-button-brand-bg);
+  color: #fff;
 
   &:hover{
     background-color: var(--vp-button-brand-hover-bg);
     border-color: var(--vp-button-brand-hover-border);
     color: var(--vp-button-brand-hover-text);
-    background-color: var(--vp-button-brand-hover-bg);
   }
 }