Merge pull request #650 from nebari-dev/fix/blog-underline-styling

khuyentran1401 · web-flow · commit 159778bbb2c5 · 2026-05-05T20:46:20.000+07:00
fix(blog): remove link underlines on titles, authors, and sidebar
diff --git a/docs/src/scss/application.scss b/docs/src/scss/application.scss
@@ -8,6 +8,7 @@
 
 // Components
 @import "../theme/components/admonitions";
+@import "../theme/components/blog";
 @import "../theme/components/footer";
 @import "../theme/components/markdown";
 @import "../theme/components/menu";
diff --git a/docs/src/theme/components/blog.scss b/docs/src/theme/components/blog.scss
@@ -0,0 +1,51 @@
+// ==============================================================================
+// Blog
+//
+// The global `a { text-decoration: underline }` mixin in core.scss adds an
+// underline to every link, which makes blog post titles, author names, and
+// the "Recent posts" sidebar entries look noisy. Opt the blog out of the
+// underline-at-rest behavior and restore an underline on hover so clickable
+// links keep their affordance — same opt-out pattern used by navbar/menu/
+// footer/admonitions.
+//
+// Scoped to Docusaurus' stable `.blog-wrapper` class (applied to <html> on
+// every blog route except /blog/archive). The archive selector below uses
+// `.plugin-blog`, also added to <html> by the blog plugin.
+// ==============================================================================
+
+.blog-wrapper {
+  header h1,
+  header h2,
+  header h1 a,
+  header h2 a,
+  .avatar a,
+  .avatar__name a,
+  aside nav a {
+    text-decoration: none;
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+}
+
+[data-theme="dark"] .blog-wrapper {
+  header h1,
+  header h2,
+  header h1 a,
+  header h2 a,
+  .avatar a,
+  .avatar__name a,
+  aside nav a {
+    text-decoration: none;
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+}
+
+.plugin-blog main ul li a {
+  text-decoration: none;
+  &:hover {
+    text-decoration: underline;
+  }
+}
