From 5f4cb1fd8b84e69092ac56a643b1618006f0442c Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Thu, 16 Dec 2021 18:29:18 +0100
Subject: Add thumbnails to cards

---
 assets/css/layouts/_card-list.scss | 28 ++++++++++++++--------------
 1 file changed, 14 insertions(+), 14 deletions(-)

(limited to 'assets/css/layouts')

diff --git a/assets/css/layouts/_card-list.scss b/assets/css/layouts/_card-list.scss
index e6d1297..3bbcc44 100644
--- a/assets/css/layouts/_card-list.scss
+++ b/assets/css/layouts/_card-list.scss
@@ -10,19 +10,23 @@
         font-size:  1rem;
 
         @include element('cards') {
-            margin-top: $line-height * .625rem;
-            filter:     drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)});
+            display:        flex;
+            flex-direction: column;
+            gap:            2px;
+            margin-top:     $line-height * .625rem;
+            filter:         drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)});
 
-            @include modifier('grid') {
+            @include modifier('grid', 'gallery') {
                 display:               grid;
                 grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
-                gap:                   6px;
-    
-                @include element('card') {
-                    @include next-twin-element {
-                        margin-top: 0;
-                    }
-                }
+            }
+
+            @include modifier('grid') {
+                gap: 6px;
+            }
+
+            @include modifier('gallery') {
+                gap: 30px;
             }
 
             @media print {
@@ -32,10 +36,6 @@
 
         @include element('card') {
             box-shadow: none;
-
-            @include next-twin-element {
-                margin-top: 2px;
-            }
         }
     }
 }
-- 
cgit v1.2.3-70-g09d2