🎨 Improve backmatter styles

jupyter-book · Nov 18, 2023 · 96aae9b · 96aae9b
1 parent 8aa0be8
commit 96aae9b
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/.changeset/funny-wolves-dance.md b/.changeset/funny-wolves-dance.md
@@ -0,0 +1,5 @@
+---
+'@myst-theme/site': patch
+---
+
+Improve backmatter styles
diff --git a/packages/site/src/components/Backmatter.tsx b/packages/site/src/components/Backmatter.tsx
@@ -27,16 +27,19 @@ export function Backmatter({
 }) {
   if (!content) return null;
   return (
-    <div className="flex flex-col w-full md:flex-row">
+    <div className="flex flex-col w-full md:flex-row group/backmatter">
       <h2
         id={id}
-        className="mt-5 text-base font-semibold group md:w-[200px] self-start md:flex-none opacity-90"
+        className="mt-5 text-base font-semibold group md:w-[200px] self-start md:flex-none opacity-90 group-hover/backmatter:opacity-100"
       >
         {title}
         <HashLink id={id} title={`Link to ${title}`} hover className="ml-2" />
       </h2>
       <div className="grow">
-        <ContentBlocks mdast={content} className="opacity-80 col-screen" />
+        <ContentBlocks
+          mdast={content}
+          className="opacity-90 group-hover/backmatter:opacity-100 col-screen"
+        />
       </div>
     </div>
   );