Refactors links-gallery CSS component

1 files changed, 20 insertions, 10 deletions

diff --git a/public/main.css b/public/main.css
index 49335d4..4fad865 100644
--- a/public/main.css
+++ b/public/main.css
@@ -366,14 +366,14 @@ footer {
   border-radius: 50%;
 }
 
-.lallans-issues-gallery {
+.link-gallery {
   display: flex;
   flex-wrap: wrap;
   gap: var(--spacing-inline-sm);
   padding-block: var(--spacing-block-md);
 }
 
-.lallans-issues-gallery__issue-container {
+.link-gallery__container {
   display: flex;
   flex-direction: column;
   width: fit-content;
@@ -403,21 +403,31 @@ footer {
   height: auto;
 }
 
-.lallans-issues-gallery__issue-cover-image {
+.link-gallery--lallans {
+  --gallery-item-width: 6rem;
+  --gallery-item-height: auto;
+}
+
+.link-gallery__image {
   align-self: start;
-  width: 100%;
-  max-width: 6rem;
-  height: auto;
+  max-width: var(--gallery-item-width);
+  max-height: var(--gallery-item-height);
 }
 
-.lallans-issues-gallery__issue-title {
+.link-gallery__image img {
+  max-width: 100%;
+  max-height: 100%;
+}
+
+.link-gallery__title {
   justify-self: end;
-  max-width: 6rem;
-  overflow: hidden;
+  max-width: var(--gallery-item-width);
+  min-height: 4.7ex;
   text-overflow: ellipsis;
   display: -webkit-box;
+  -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
-  -webkit-line-clamp: 1;
+  overflow: hidden;
   text-align: center;
 }