fix(theme-default): fix new anchor style

vuepress · Jan 24, 2024 · 04ebdd2 · 04ebdd2
1 parent 7a4b223
commit 04ebdd2
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 3 deletions.
diff --git a/themes/theme-default/src/client/styles/layout.scss b/themes/theme-default/src/client/styles/layout.scss
@@ -126,7 +126,7 @@
 }
 
 .theme-default-content {
-  a:not(.anchor-header):hover {
+  a:not(.header-anchor):hover {
     text-decoration: underline;
   }
 

diff --git a/themes/theme-default/src/client/styles/normalize.scss b/themes/theme-default/src/client/styles/normalize.scss
@@ -92,9 +92,29 @@ h6 {
     outline: none;
   }
 
-  &:hover .header-anchor {
-    color: var(--c-text-accent);
+  .header-anchor {
+    color: inherit;
     text-decoration: none;
+    position: relative;
+
+    &:hover ::before {
+      content: '¶';
+      position: absolute;
+      left: -0.75em;
+      color: var(--c-brand);
+    }
+
+    &:focus-visible {
+      outline: none;
+
+      &::before {
+        content: '¶';
+        position: absolute;
+        left: -0.75em;
+        color: var(--c-brand);
+        outline: auto;
+      }
+    }
   }
 }