feat: add --rp-c-link

web-infra-dev · Apr 30, 2024 · 8fc2d0d · 8fc2d0d
1 parent a66a626
commit 8fc2d0d
Show file tree

Hide file tree

Showing 7 changed files with 11 additions and 62 deletions.
diff --git a/packages/theme-default/src/components/Aside/index.scss b/packages/theme-default/src/components/Aside/index.scss
@@ -19,16 +19,7 @@
 .aside-active {
   &,
   &:hover {
-    color: var(--rp-c-brand-dark);
+    color: var(--rp-c-link);
     background-color: var(--rp-c-brand-tint);
   }
 }
-
-.dark {
-  .aside-active {
-    &,
-    &:hover {
-      color: var(--rp-c-brand-light);
-    }
-  }
-}
diff --git a/packages/theme-default/src/components/Nav/index.module.scss b/packages/theme-default/src/components/Nav/index.module.scss
@@ -40,17 +40,10 @@
 .singleItem:hover {
   background-color: var(--rp-c-bg-mute);
   cursor: pointer;
-  color: var(--rp-c-brand-dark);
+  color: var(--rp-c-link);
   border-radius: var(--rp-radius);
 }
 
-:global(.dark) {
-  .activeItem,
-  .singleItem:hover {
-    color: var(--rp-c-brand-light);
-  }
-}
-
 .navBarTitle {
   flex-shrink: 0;
 }

diff --git a/packages/theme-default/src/components/Overview/index.module.scss b/packages/theme-default/src/components/Overview/index.module.scss
@@ -26,7 +26,7 @@
   h3,
   h3 > a {
     letter-spacing: -0.01em;
-    color: var(--rp-c-brand);
+    color: var(--rp-c-link);
     font-size: 18px;
     margin-bottom: 1em;
     transition: color 0.5s;
@@ -38,11 +38,6 @@
     line-height: 1.3;
   }
 
-  h3 > a:hover {
-    transition: color 0.5s;
-    color: var(--rp-c-brand-dark);
-  }
-
   h3:before {
     display: none;
   }
@@ -81,15 +76,6 @@
   }
 }
 
-:global(.dark) {
-  :global(.overview-index) {
-    h3,
-    h3 > a {
-      color: var(--rp-c-brand-light);
-    }
-  }
-}
-
 .overview-groups a {
   display: block;
   font-size: 15px;

diff --git a/packages/theme-default/src/components/Sidebar/index.module.scss b/packages/theme-default/src/components/Sidebar/index.module.scss
@@ -106,7 +106,7 @@
 
 .menuItemActive {
   background-color: var(--rp-c-brand-tint);
-  color: var(--rp-c-brand);
+  color: var(--rp-c-link);
   font-weight: bolder;
   position: relative;
 }
@@ -122,12 +122,6 @@
   transition: all 0.2s ease;
 }
 
-:global(.dark) {
-  .menuItemActive {
-    color: var(--rp-c-brand-light);
-  }
-}
-
 .menuGroupActive {
   background-color: var(--rp-c-bg-mute);
 }

diff --git a/packages/theme-default/src/components/Tabs/index.module.scss b/packages/theme-default/src/components/Tabs/index.module.scss
@@ -42,15 +42,8 @@
 }
 
 .selected {
-  color: var(--rp-c-brand-dark);
-  border-color: var(--rp-c-brand-dark);
-}
-
-:global(.dark) {
-  .selected {
-    color: var(--rp-c-brand-light);
-    border-color: var(--rp-c-brand-light);
-  }
+  color: var(--rp-c-link);
+  border-color: currentColor;
 }
 
 .no-scrollbar::-webkit-scrollbar {

diff --git a/packages/theme-default/src/layout/DocLayout/docComponents/index.module.scss b/packages/theme-default/src/layout/DocLayout/docComponents/index.module.scss
@@ -37,7 +37,7 @@
 :global(summary a) {
   &:not(:global(.header-anchor)) {
     font-weight: 500;
-    color: var(--rp-c-brand-dark);
+    color: var(--rp-c-link);
     transition: color 0.25s;
   }
 
@@ -47,18 +47,6 @@
   }
 }
 
-:global(.dark) {
-  .link,
-  :global(summary) .link,
-  :global(summary a) {
-    &:not(:global(.header-anchor)) {
-      font-weight: 500;
-      color: var(--rp-c-brand-light);
-      transition: color 0.25s;
-    }
-  }
-}
-
 :global(.header-anchor) {
   color: var(--rp-c-brand);
 }

diff --git a/packages/theme-default/src/styles/vars.css b/packages/theme-default/src/styles/vars.css
@@ -47,6 +47,8 @@
   --rp-radius: 1rem;
   --rp-radius-small: 0.5rem;
   --rp-radius-large: 1.5rem;
+
+  --rp-c-link: var(--rp-c-brand-dark);
 }
 
 .dark {
@@ -65,6 +67,8 @@
 
   /* Will be used in overview page */
   --rp-c-text-code: #c9def1;
+
+  --rp-c-link: var(--rp-c-brand-light);
 }
 
 :root {