Pulls out link module

4 files changed, 28 insertions, 32 deletions

diff --git a/public/css/modules/index.css b/public/css/modules/index.css
index 78fbd69..0a778e1 100644
--- a/public/css/modules/index.css
+++ b/public/css/modules/index.css
@@ -1 +1,2 @@
-@import './btn.css';
\ No newline at end of file
+@import './btn.css';
+@import './link.css';
\ No newline at end of file
diff --git a/public/css/modules/link.css b/public/css/modules/link.css
new file mode 100644
index 0000000..005c82e
--- /dev/null
+++ b/public/css/modules/link.css
@@ -0,0 +1,25 @@
+.link {
+  color: var(--special-text-color);
+  text-decoration: underline;
+  text-decoration-color: var(--special-text-color);
+  border: dotted transparent 2px;
+  border-radius: 0.375rem;
+  transition:
+    text-decoration-color 300ms,
+    color 300ms,
+    border-color 300ms,
+    font-weight 300ms;
+}
+
+.link:hover, .group-hover:hover .link {
+  text-decoration-color: transparent;
+}
+
+.link:focus {
+  border-color: var(--special-text-color);
+}
+
+.link:active {
+  font-weight: 700;
+  color: var(--special-text-highlight-color);
+}
\ No newline at end of file
diff --git a/public/main.css b/public/main.css
index 4c5276a..598ee65 100644
--- a/public/main.css
+++ b/public/main.css
@@ -53,32 +53,6 @@ p:not(:first) {
   margin-block-start: var(--spacing-block-md);
 }
 
-.link {
-  color: var(--special-text-color);
-  text-decoration: underline;
-  text-decoration-color: var(--special-text-color);
-  border: dotted transparent 2px;
-  border-radius: 0.375rem;
-  transition:
-    text-decoration-color 300ms,
-    color 300ms,
-    border-color 300ms,
-    font-weight 300ms;
-}
-
-.link:hover {
-  text-decoration-color: transparent;
-}
-
-.link:focus {
-  border-color: var(--special-text-color);
-}
-
-.link:active {
-  font-weight: 700;
-  color: var(--special-text-highlight-color);
-}
-
 td {
   padding-block-start: var(--spacing-block-sm);
 }
@@ -151,10 +125,6 @@ ol li {
   transition-duration: 300ms;
 }
 
-.news-index__item:hover .link {
-  text-decoration-color: transparent;
-}
-
 .news-index__item :first-child {
   margin-block-start: 0;
 }
diff --git a/src/components/NewsPreviewLink.astro b/src/components/NewsPreviewLink.astro
index 8486fe7..90cce61 100644
--- a/src/components/NewsPreviewLink.astro
+++ b/src/components/NewsPreviewLink.astro
@@ -14,7 +14,7 @@ const locale = getLocaleFromPath(Astro.url.pathname);
 const t = translate(locale);
 ---
 
-<a class="news-index__item" href={`/${locale}/news/${newsItem.slug.replace('/', '-')}`}>
+<a class="news-index__item group-hover" href={`/${locale}/news/${newsItem.slug.replace('/', '-')}`}>
   <Fragment
     set:html={`
     <${headingLevel}>${newsItem.data.title}</${headingLevel}>