feat(color): replace brand colors

Octobug · Mar 20, 2024 · 394d80e · 394d80e
1 parent 3c840c5
commit 394d80e
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 52 deletions.
diff --git a/.vitepress/theme/components/Annotations.vue b/.vitepress/theme/components/Annotations.vue
@@ -49,20 +49,12 @@ const { frontmatter } = useData();
 
 .sort {
   color: var(--vp-c-neutral-inverse);
-  background-color: var(--vp-c-brand-3);
+  background-color: var(--vp-c-brand-2);
   padding: 1px 8px;
 }
 
 .sort:hover {
-  background-color: var(--vp-c-brand-1);
-}
-
-.dark .sort {
-  background-color: var(--vp-c-brand-1);
-}
-
-.dark .sort:hover {
-  background-color: var(--vp-c-brand-2);
+  background-color: var(--vp-c-neutral);
 }
 
 .dot {
@@ -71,27 +63,16 @@ const { frontmatter } = useData();
 }
 
 .tag {
-  color: var(--vp-c-brand-3);
+  color: var(--vp-c-brand-2);
   line-height: 20px;
-  border: 2px solid var(--vp-c-brand-3);
+  border: 2px solid var(--vp-c-brand-2);
   padding: 1px 5px;
   margin-top: 1rem;
   margin-right: 0.7rem;
 }
 
 .tag:hover {
-  border: 2px solid var(--vp-c-brand-3);
-  background-color: var(--vp-c-brand-3);
-  color: var(--vp-c-neutral-inverse);
-}
-
-.dark .tag {
-  color: var(--vp-c-brand-1);
-  border: 2px solid var(--vp-c-brand-1);
-}
-
-.dark .tag:hover {
+  background-color: var(--vp-c-brand-2);
   color: var(--vp-c-neutral-inverse);
-  background-color: var(--vp-c-brand-1);
 }
 </style>
diff --git a/.vitepress/theme/components/Badge.vue b/.vitepress/theme/components/Badge.vue
@@ -45,34 +45,21 @@ defineProps({
 
 .link:hover,
 a.active {
-  color: var(--vp-c-text-2);
-  box-shadow: 0 0 0 1px var(--vp-c-text-2);
-  background-color: var(--vp-c-default-2);
+  color: var(--vp-c-brand-1);
+  box-shadow: 0 0 0 1px var(--vp-c-brand-2);
+  background-color: var(--vp-c-default-soft);
 }
 
 .link:hover .digit,
 a.active .digit {
   color: var(--vp-c-default-3);
-  background-color: var(--vp-c-text-2);
-}
-
-.dark .link:hover,
-.dark a.active {
-  color: var(--vp-c-brand-1);
-  box-shadow: 0 0 0 1px var(--vp-c-brand-1);
-  background-color: var(--vp-c-brand-soft);
-}
-
-.dark .link:hover .digit,
-.dark a.active .digit {
-  color: var(--vp-c-default-3);
-  background-color: var(--vp-c-brand-1);
+  background-color: var(--vp-c-brand-2);
 }
 </style>
 
 <style module scoped>
 .badge {
-  color: var(--ct-c-default-0);
+  color: var(--vp-c-brand-soft);
   display: inline-block;
   border-radius: 4px;
   box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
@@ -95,7 +82,7 @@ a.active .digit {
 
 .number {
   display: inline-block;
-  color: var(--vp-c-text-2);
+  color: var(--vp-c-brand-3);
   background-color: var(--vp-c-default-soft);
   padding-top: 1px;
   padding-bottom: 1px;

diff --git a/.vitepress/theme/style.css b/.vitepress/theme/style.css
@@ -44,15 +44,17 @@
  * -------------------------------------------------------------------------- */
 
 :root {
+  --vp-code-color: var(--vp-c-indigo-1);
+
   --vp-c-default-1: var(--vp-c-gray-1);
   --vp-c-default-2: var(--vp-c-gray-2);
   --vp-c-default-3: var(--vp-c-gray-3);
   --vp-c-default-soft: var(--vp-c-gray-soft);
 
-  --vp-c-brand-1: var(--vp-c-indigo-1);
-  --vp-c-brand-2: var(--vp-c-indigo-2);
-  --vp-c-brand-3: var(--vp-c-indigo-3);
-  --vp-c-brand-soft: var(--vp-c-indigo-soft);
+  --vp-c-brand-1: var(--vp-c-neutral);
+  --vp-c-brand-2: var(--vp-c-text-1);
+  --vp-c-brand-3: var(--vp-c-text-2);
+  --vp-c-brand-soft: var(--vp-c-text-3);
 
   --vp-c-tip-1: var(--vp-c-brand-1);
   --vp-c-tip-2: var(--vp-c-brand-2);
@@ -140,7 +142,6 @@
 :root {
   /* Custom vars */
   --ct-c-shadow: #d7d7d7;
-  --ct-c-default-0: #aaaaaa;
 
   /* Profile */
   --ct-avatar-border: white;
@@ -149,10 +150,6 @@
   --ct-avatar-small: 6rem;
 }
 
-.dark {
-  --ct-c-default-0: #777777;
-}
-
 .VPContent>.VPHome {
   margin-bottom: 4rem;
 }