From f9b1856da8c17755a2387e8cf6a2642831acc46c Mon Sep 17 00:00:00 2001
From: vintro <vince@plasticlabs.ai>
Date: Fri, 13 Dec 2024 23:38:30 -0800
Subject: [PATCH 1/8] simple cards for folder view with tag sorting

---
 quartz/components/PageList.tsx            | 14 +---
 quartz/components/pages/FolderContent.tsx | 61 +++++++++++++-
 quartz/styles/base.scss                   | 97 +++++++++++++++++++++++
 3 files changed, 158 insertions(+), 14 deletions(-)

diff --git a/quartz/components/PageList.tsx b/quartz/components/PageList.tsx
index 1e5d232df0691..28e35d8b96945 100644
--- a/quartz/components/PageList.tsx
+++ b/quartz/components/PageList.tsx
@@ -42,7 +42,7 @@ export const PageList: QuartzComponent = ({ cfg, fileData, allFiles, limit }: Pr
         const tags = page.frontmatter?.tags ?? []
 
         return (
-          <li class="section-li">
+          <li class="section-li" data-tags={JSON.stringify(tags)}>
             <div class="section">
               {page.dates && (
                 <p class="meta">
@@ -56,18 +56,6 @@ export const PageList: QuartzComponent = ({ cfg, fileData, allFiles, limit }: Pr
                   </a>
                 </h3>
               </div>
-              <ul class="tags">
-                {tags.map((tag) => (
-                  <li>
-                    <a
-                      class="internal tag-link"
-                      href={resolveRelative(fileData.slug!, `tags/${tag}` as FullSlug)}
-                    >
-                      {tag}
-                    </a>
-                  </li>
-                ))}
-              </ul>
             </div>
           </li>
         )
diff --git a/quartz/components/pages/FolderContent.tsx b/quartz/components/pages/FolderContent.tsx
index 55f1e427da35e..ab3338b3638bb 100644
--- a/quartz/components/pages/FolderContent.tsx
+++ b/quartz/components/pages/FolderContent.tsx
@@ -33,6 +33,15 @@ export default ((opts?: Partial<FolderContentOptions>) => {
       const isDirectChild = fileParts.length === folderParts.length + 1
       return prefixed && isDirectChild
     })
+
+    // Get all unique tags
+    const allTags = new Set<string>()
+    allPagesInFolder.forEach(file => {
+      const tags = file.frontmatter?.tags ?? []
+      tags.forEach(tag => allTags.add(tag))
+    })
+    const sortedTags = Array.from(allTags).sort()
+
     const cssClasses: string[] = fileData.frontmatter?.cssclasses ?? []
     const classes = ["popover-hint", ...cssClasses].join(" ")
     const listProps = {
@@ -45,14 +54,63 @@ export default ((opts?: Partial<FolderContentOptions>) => {
         ? fileData.description
         : htmlToJsx(fileData.filePath!, tree)
 
+    // Add client-side filtering script
+    const filterScript = `
+      document.addEventListener('DOMContentLoaded', () => {
+        const selectedTags = new Set()
+        const cards = document.querySelectorAll('.section-li')
+        const countEl = document.querySelector('.folder-count')
+        const originalCount = ${allPagesInFolder.length}
+
+        function updateVisibility() {
+          let visibleCount = 0
+          cards.forEach(card => {
+            const tags = JSON.parse(card.dataset.tags || '[]')
+            const shouldShow = selectedTags.size === 0 || 
+              tags.some(tag => selectedTags.has(tag))
+            card.style.display = shouldShow ? '' : 'none'
+            if (shouldShow) visibleCount++
+          })
+          if (countEl) {
+            countEl.textContent = ${JSON.stringify(i18n(cfg.locale).pages.folderContent.itemsUnderFolder({count: 0}))}
+              .replace('0', visibleCount.toString())
+          }
+        }
+
+        document.querySelectorAll('.tag-filter-btn').forEach(btn => {
+          btn.addEventListener('click', () => {
+            const tag = btn.dataset.tag
+            if (selectedTags.has(tag)) {
+              selectedTags.delete(tag)
+              btn.classList.remove('selected')
+            } else {
+              selectedTags.add(tag)
+              btn.classList.add('selected')
+            }
+            updateVisibility()
+          })
+        })
+      })
+    `
+
     return (
       <div class={classes}>
         <article>
           <p>{content}</p>
         </article>
         <div class="page-listing">
+          <div class="tag-filter">
+            {sortedTags.map(tag => (
+              <button
+                data-tag={tag}
+                class="tag-filter-btn"
+              >
+                {tag}
+              </button>
+            ))}
+          </div>
           {options.showFolderCount && (
-            <p>
+            <p class="folder-count">
               {i18n(cfg.locale).pages.folderContent.itemsUnderFolder({
                 count: allPagesInFolder.length,
               })}
@@ -62,6 +120,7 @@ export default ((opts?: Partial<FolderContentOptions>) => {
             <PageList {...listProps} />
           </div>
         </div>
+        <script dangerouslySetInnerHTML={{ __html: filterScript }} />
       </div>
     )
   }
diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index b21ded923875e..95787c2c44d68 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -545,3 +545,100 @@ input {
   padding: 0.5rem;
 }
 
+// Blog listing styles
+.page-listing {
+  margin-top: 2rem;
+
+  .tag-filter {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5rem;
+    margin-bottom: 2rem;
+
+    .tag-filter-btn {
+      padding: 0.4rem 0.8rem;
+      border-radius: 20px;
+      border: 1px solid var(--lightgray);
+      background: var(--light);
+      color: var(--gray);
+      font-size: 0.9rem;
+      font-family: var(--bodyFont);
+      cursor: pointer;
+      transition: all 0.2s ease;
+
+      &:hover {
+        border-color: var(--secondary);
+        color: var(--secondary);
+      }
+
+      &.selected {
+        background: var(--secondary);
+        color: var(--light);
+        border-color: var(--secondary);
+      }
+
+      &::before {
+        content: "#";
+        opacity: 0.7;
+        margin-right: 0.2rem;
+      }
+    }
+  }
+
+  .section-ul {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+    gap: 1.5rem;
+    margin-top: 1.5rem;
+  }
+
+  .section-li {
+    margin: 0;
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    border-radius: 12px;
+    background: var(--light);
+    border: 1px solid var(--lightgray);
+    overflow: hidden;
+
+    &:hover {
+      transform: translateY(-3px);
+      box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
+    }
+
+    .section {
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+      padding: 1.25rem;
+      gap: 0.7rem;
+
+      .meta {
+        order: -1;
+        font-size: 0.9rem;
+        color: var(--gray);
+      }
+
+      .desc {
+        flex: 1;
+        
+        h3 {
+          margin: 0;
+          font-size: 1.3rem;
+          line-height: 1.4;
+          
+          a {
+            text-decoration: none;
+            background: none;
+            padding: 0;
+            
+            &:hover {
+              color: var(--secondary);
+              background: none;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+

From bcfa99fe2232b0ad31d16dcc3b8f8174e8bd38e3 Mon Sep 17 00:00:00 2001
From: vintro <vince@plasticlabs.ai>
Date: Fri, 13 Dec 2024 23:48:47 -0800
Subject: [PATCH 2/8] fix tag filtering

---
 quartz/components/PageList.tsx            |  7 +--
 quartz/components/pages/FolderContent.tsx | 55 +++++++++++++++++------
 2 files changed, 44 insertions(+), 18 deletions(-)

diff --git a/quartz/components/PageList.tsx b/quartz/components/PageList.tsx
index 28e35d8b96945..b91b05db33bc2 100644
--- a/quartz/components/PageList.tsx
+++ b/quartz/components/PageList.tsx
@@ -40,9 +40,10 @@ export const PageList: QuartzComponent = ({ cfg, fileData, allFiles, limit }: Pr
       {list.map((page) => {
         const title = page.frontmatter?.title
         const tags = page.frontmatter?.tags ?? []
+        const tagsStr = JSON.stringify(tags)
 
         return (
-          <li class="section-li" data-tags={JSON.stringify(tags)}>
+          <li class="section-li" data-tags={tagsStr}>
             <div class="section">
               {page.dates && (
                 <p class="meta">
@@ -68,8 +69,4 @@ PageList.css = `
 .section h3 {
   margin: 0;
 }
-
-.section > .tags {
-  margin: 0;
-}
 `
diff --git a/quartz/components/pages/FolderContent.tsx b/quartz/components/pages/FolderContent.tsx
index ab3338b3638bb..b5dadd667ff6c 100644
--- a/quartz/components/pages/FolderContent.tsx
+++ b/quartz/components/pages/FolderContent.tsx
@@ -56,30 +56,47 @@ export default ((opts?: Partial<FolderContentOptions>) => {
 
     // Add client-side filtering script
     const filterScript = `
-      document.addEventListener('DOMContentLoaded', () => {
+      function initializeTagFiltering() {
         const selectedTags = new Set()
         const cards = document.querySelectorAll('.section-li')
         const countEl = document.querySelector('.folder-count')
-        const originalCount = ${allPagesInFolder.length}
-
+        const tagButtons = document.querySelectorAll('.tag-filter-btn')
+        
+        // Debug logging
+        console.log('Found ' + cards.length + ' cards')
+        console.log('Found ' + tagButtons.length + ' tag buttons')
+        
         function updateVisibility() {
           let visibleCount = 0
           cards.forEach(card => {
-            const tags = JSON.parse(card.dataset.tags || '[]')
-            const shouldShow = selectedTags.size === 0 || 
-              tags.some(tag => selectedTags.has(tag))
-            card.style.display = shouldShow ? '' : 'none'
-            if (shouldShow) visibleCount++
+            try {
+              const tagsAttr = card.getAttribute('data-tags')
+              console.log('Card tags:', tagsAttr)
+              const tags = JSON.parse(tagsAttr || '[]')
+              const shouldShow = selectedTags.size === 0 || 
+                tags.some(tag => selectedTags.has(tag))
+              card.style.display = shouldShow ? '' : 'none'
+              if (shouldShow) visibleCount++
+            } catch (e) {
+              console.error('Error processing card:', e)
+            }
           })
+          
           if (countEl) {
-            countEl.textContent = ${JSON.stringify(i18n(cfg.locale).pages.folderContent.itemsUnderFolder({count: 0}))}
-              .replace('0', visibleCount.toString())
+            const countText = ${JSON.stringify(i18n(cfg.locale).pages.folderContent.itemsUnderFolder({count: 0}))}
+            countEl.textContent = countText.replace('0', visibleCount.toString())
           }
+          
+          // Debug logging
+          console.log('Selected tags:', Array.from(selectedTags))
+          console.log('Visible count:', visibleCount)
         }
 
-        document.querySelectorAll('.tag-filter-btn').forEach(btn => {
+        tagButtons.forEach(btn => {
           btn.addEventListener('click', () => {
-            const tag = btn.dataset.tag
+            const tag = btn.getAttribute('data-tag')
+            console.log('Clicked tag:', tag)
+            
             if (selectedTags.has(tag)) {
               selectedTags.delete(tag)
               btn.classList.remove('selected')
@@ -90,7 +107,18 @@ export default ((opts?: Partial<FolderContentOptions>) => {
             updateVisibility()
           })
         })
-      })
+      }
+
+      // Try to initialize immediately
+      initializeTagFiltering()
+      
+      // Also try after a short delay to ensure DOM is ready
+      setTimeout(initializeTagFiltering, 100)
+      
+      // Also initialize on DOMContentLoaded if it hasn't fired yet
+      if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', initializeTagFiltering)
+      }
     `
 
     return (
@@ -104,6 +132,7 @@ export default ((opts?: Partial<FolderContentOptions>) => {
               <button
                 data-tag={tag}
                 class="tag-filter-btn"
+                type="button"
               >
                 {tag}
               </button>

From e8d43767284af49fe3be11f976401e6512892990 Mon Sep 17 00:00:00 2001
From: vintro <vince@plasticlabs.ai>
Date: Fri, 13 Dec 2024 23:57:06 -0800
Subject: [PATCH 3/8] improve tag filtering

---
 quartz/components/pages/FolderContent.tsx | 49 ++++++++++++++---------
 1 file changed, 30 insertions(+), 19 deletions(-)

diff --git a/quartz/components/pages/FolderContent.tsx b/quartz/components/pages/FolderContent.tsx
index b5dadd667ff6c..d37985e5b3ce2 100644
--- a/quartz/components/pages/FolderContent.tsx
+++ b/quartz/components/pages/FolderContent.tsx
@@ -56,22 +56,30 @@ export default ((opts?: Partial<FolderContentOptions>) => {
 
     // Add client-side filtering script
     const filterScript = `
+      let isInitialized = false;
+
       function initializeTagFiltering() {
+        // Prevent double initialization
+        if (isInitialized) {
+          return;
+        }
+
         const selectedTags = new Set()
         const cards = document.querySelectorAll('.section-li')
         const countEl = document.querySelector('.folder-count')
         const tagButtons = document.querySelectorAll('.tag-filter-btn')
         
-        // Debug logging
-        console.log('Found ' + cards.length + ' cards')
-        console.log('Found ' + tagButtons.length + ' tag buttons')
+        if (!cards.length || !tagButtons.length) {
+          return; // Don't initialize if elements aren't present
+        }
+
+        isInitialized = true;
         
         function updateVisibility() {
           let visibleCount = 0
           cards.forEach(card => {
             try {
               const tagsAttr = card.getAttribute('data-tags')
-              console.log('Card tags:', tagsAttr)
               const tags = JSON.parse(tagsAttr || '[]')
               const shouldShow = selectedTags.size === 0 || 
                 tags.some(tag => selectedTags.has(tag))
@@ -86,38 +94,41 @@ export default ((opts?: Partial<FolderContentOptions>) => {
             const countText = ${JSON.stringify(i18n(cfg.locale).pages.folderContent.itemsUnderFolder({count: 0}))}
             countEl.textContent = countText.replace('0', visibleCount.toString())
           }
-          
-          // Debug logging
-          console.log('Selected tags:', Array.from(selectedTags))
-          console.log('Visible count:', visibleCount)
         }
 
         tagButtons.forEach(btn => {
-          btn.addEventListener('click', () => {
-            const tag = btn.getAttribute('data-tag')
-            console.log('Clicked tag:', tag)
-            
+          // Remove any existing listeners first
+          const newBtn = btn.cloneNode(true)
+          btn.parentNode.replaceChild(newBtn, btn)
+          
+          newBtn.addEventListener('click', () => {
+            const tag = newBtn.getAttribute('data-tag')
             if (selectedTags.has(tag)) {
               selectedTags.delete(tag)
-              btn.classList.remove('selected')
+              newBtn.classList.remove('selected')
             } else {
               selectedTags.add(tag)
-              btn.classList.add('selected')
+              newBtn.classList.add('selected')
             }
             updateVisibility()
           })
         })
       }
 
-      // Try to initialize immediately
+      // Initialize on first load
       initializeTagFiltering()
       
-      // Also try after a short delay to ensure DOM is ready
-      setTimeout(initializeTagFiltering, 100)
-      
-      // Also initialize on DOMContentLoaded if it hasn't fired yet
+      // Handle client-side navigation
+      document.addEventListener('nav', () => {
+        isInitialized = false;
+        setTimeout(initializeTagFiltering, 0)
+      })
+
+      // Backup initialization for edge cases
       if (document.readyState === 'loading') {
         document.addEventListener('DOMContentLoaded', initializeTagFiltering)
+      } else {
+        setTimeout(initializeTagFiltering, 0)
       }
     `
 

From 479cd717a417d006f182b201a470ef2517b4e659 Mon Sep 17 00:00:00 2001
From: vintro <vince@plasticlabs.ai>
Date: Sat, 14 Dec 2024 00:03:40 -0800
Subject: [PATCH 4/8] disable hover preview in the folder pages

---
 quartz/components/pages/FolderContent.tsx |  2 +-
 quartz/styles/base.scss                   | 27 +++++++++++++++++++++++
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/quartz/components/pages/FolderContent.tsx b/quartz/components/pages/FolderContent.tsx
index d37985e5b3ce2..d52984bb85842 100644
--- a/quartz/components/pages/FolderContent.tsx
+++ b/quartz/components/pages/FolderContent.tsx
@@ -43,7 +43,7 @@ export default ((opts?: Partial<FolderContentOptions>) => {
     const sortedTags = Array.from(allTags).sort()
 
     const cssClasses: string[] = fileData.frontmatter?.cssclasses ?? []
-    const classes = ["popover-hint", ...cssClasses].join(" ")
+    const classes = ["popover-hint", "disable-card-preview", ...cssClasses].join(" ")
     const listProps = {
       ...props,
       allFiles: allPagesInFolder,
diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 95787c2c44d68..81582c7745cc1 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -639,6 +639,33 @@ input {
         }
       }
     }
+
+    .internal {
+      &[href*=".html"],
+      &:not([href*="."]) {
+        &::before, &::after {
+          display: none !important;
+        }
+      }
+
+      // Keep the hover effect
+      &:hover {
+        color: var(--secondary);
+      }
+    }
+  }
+}
+
+// Disable preview popups for folder listing cards
+.disable-card-preview {
+  .popover {
+    display: none !important;
+  }
+
+  .internal {
+    &::before, &::after {
+      display: none !important;
+    }
   }
 }
 

From bfb69d1afee8f4ef8a8b4753d8ed64a90955e3d6 Mon Sep 17 00:00:00 2001
From: vintro <vince@plasticlabs.ai>
Date: Sat, 14 Dec 2024 13:39:31 -0800
Subject: [PATCH 5/8] update hover darkening behavior on cards, tags

---
 quartz/styles/base.scss | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 81582c7745cc1..9555fdada060e 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -568,7 +568,8 @@ input {
 
       &:hover {
         border-color: var(--secondary);
-        color: var(--secondary);
+        color: var(--tertiary);
+        background-color: var(--highlight);
       }
 
       &.selected {
@@ -603,6 +604,7 @@ input {
     &:hover {
       transform: translateY(-3px);
       box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
+      background-color: var(--highlight);
     }
 
     .section {
@@ -630,9 +632,10 @@ input {
             text-decoration: none;
             background: none;
             padding: 0;
+            transition: color 0.2s ease, background-color 0.2s ease;
             
             &:hover {
-              color: var(--secondary);
+              color: var(--tertiary);
               background: none;
             }
           }

From a5842bc1922f09fdfad738b151b6513a81a85e5b Mon Sep 17 00:00:00 2001
From: vintro <vince@plasticlabs.ai>
Date: Tue, 17 Dec 2024 16:09:29 -0500
Subject: [PATCH 6/8] ensure requests aren't being made on hover

---
 quartz/components/PageList.tsx | 2 +-
 quartz/styles/base.scss        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/quartz/components/PageList.tsx b/quartz/components/PageList.tsx
index b91b05db33bc2..b996700370edc 100644
--- a/quartz/components/PageList.tsx
+++ b/quartz/components/PageList.tsx
@@ -52,7 +52,7 @@ export const PageList: QuartzComponent = ({ cfg, fileData, allFiles, limit }: Pr
               )}
               <div class="desc">
                 <h3>
-                  <a href={resolveRelative(fileData.slug!, page.slug!)} class="internal">
+                  <a href={resolveRelative(fileData.slug!, page.slug!)} class="internal" data-no-popover="true">
                     {title}
                   </a>
                 </h3>
diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 9555fdada060e..0ae3d542ce2cd 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -653,7 +653,7 @@ input {
 
       // Keep the hover effect
       &:hover {
-        color: var(--secondary);
+        color: var(--tertiary);
       }
     }
   }

From 7a272be743a3411a3d84723c81ff448b0cfbcd1c Mon Sep 17 00:00:00 2001
From: vintro <vince@plasticlabs.ai>
Date: Tue, 17 Dec 2024 16:19:51 -0500
Subject: [PATCH 7/8] fix tag display on tag card view

---
 quartz/styles/base.scss | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 0ae3d542ce2cd..c7f4b3c3c3d6f 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -659,6 +659,11 @@ input {
   }
 }
 
+// Hide tags in tag page cards
+[data-slug^="tags/"] .section-li .section .tags {
+  display: none;
+}
+
 // Disable preview popups for folder listing cards
 .disable-card-preview {
   .popover {

From b9b23a10ea73b6657421a2b7d38e8e65a27ddb19 Mon Sep 17 00:00:00 2001
From: vintro <vince@plasticlabs.ai>
Date: Tue, 17 Dec 2024 16:29:35 -0500
Subject: [PATCH 8/8] fix: whole card clickable

---
 quartz/components/PageList.tsx | 25 +++++++++++-----------
 quartz/styles/base.scss        | 38 ++++++++++++++++++++++------------
 2 files changed, 37 insertions(+), 26 deletions(-)

diff --git a/quartz/components/PageList.tsx b/quartz/components/PageList.tsx
index b996700370edc..831d962f8b89b 100644
--- a/quartz/components/PageList.tsx
+++ b/quartz/components/PageList.tsx
@@ -41,23 +41,22 @@ export const PageList: QuartzComponent = ({ cfg, fileData, allFiles, limit }: Pr
         const title = page.frontmatter?.title
         const tags = page.frontmatter?.tags ?? []
         const tagsStr = JSON.stringify(tags)
+        const href = resolveRelative(fileData.slug!, page.slug!)
 
         return (
           <li class="section-li" data-tags={tagsStr}>
-            <div class="section">
-              {page.dates && (
-                <p class="meta">
-                  <Date date={getDate(cfg, page)!} locale={cfg.locale} />
-                </p>
-              )}
-              <div class="desc">
-                <h3>
-                  <a href={resolveRelative(fileData.slug!, page.slug!)} class="internal" data-no-popover="true">
-                    {title}
-                  </a>
-                </h3>
+            <a href={href} class="section-link">
+              <div class="section">
+                {page.dates && (
+                  <p class="meta">
+                    <Date date={getDate(cfg, page)!} locale={cfg.locale} />
+                  </p>
+                )}
+                <div class="desc">
+                  <h3>{title}</h3>
+                </div>
               </div>
-            </div>
+            </a>
           </li>
         )
       })}
diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index c7f4b3c3c3d6f..181501c09e0ea 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -595,16 +595,38 @@ input {
 
   .section-li {
     margin: 0;
-    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
     border-radius: 12px;
     background: var(--light);
     border: 1px solid var(--lightgray);
     overflow: hidden;
+    position: relative;
+
+    .section-link {
+      text-decoration: none;
+      color: var(--darkgray);
+      background: none !important;
+      display: block;
+      height: 100%;
+
+      &:hover {
+        background: none !important;
+        color: var(--darkgray);
+      }
+    }
 
     &:hover {
       transform: translateY(-3px);
       box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
       background-color: var(--highlight);
+
+      .section {
+        .desc {
+          h3 {
+            color: var(--tertiary);
+          }
+        }
+      }
     }
 
     .section {
@@ -627,18 +649,8 @@ input {
           margin: 0;
           font-size: 1.3rem;
           line-height: 1.4;
-          
-          a {
-            text-decoration: none;
-            background: none;
-            padding: 0;
-            transition: color 0.2s ease, background-color 0.2s ease;
-            
-            &:hover {
-              color: var(--tertiary);
-              background: none;
-            }
-          }
+          transition: color 0.2s ease;
+          color: var(--secondary);
         }
       }
     }