From b01fd640bbbc174eaab72e00cbb5a2806de46030 Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Tue, 22 Jul 2025 19:33:29 +0200
Subject: Add borderless/shadow to card list

---
 src/layouts/_card-list.scss      | 21 +++++++++++++++++++++
 src/layouts/_card-list.vars.scss |  7 +++++++
 2 files changed, 28 insertions(+)

(limited to 'src')

diff --git a/src/layouts/_card-list.scss b/src/layouts/_card-list.scss
index 69ca588..cca6e72 100644
--- a/src/layouts/_card-list.scss
+++ b/src/layouts/_card-list.scss
@@ -51,6 +51,27 @@
                     border-start-end-radius:   0;
                 }
             }
+
+            @include bem.modifier('borderless') {
+                border-color: props.get(vars.$card-bg-color);
+
+                @include bem.elem('card') {
+                    &:not(:last-child) {
+                        &::after {
+                            inset-inline: calc(-1 * props.get(vars.$merge-padding) - 2 * props.get(vars.$border-width));
+                        }
+                    }
+                }
+            }
+
+            @include bem.modifier('shadow') {
+                box-shadow:
+                    props.get(vars.$shadow-x)
+                    props.get(vars.$shadow-y)
+                    props.get(vars.$shadow-blur)
+                    props.get(vars.$shadow-grow)
+                    props.get(vars.$shadow-color);
+            }
         }
 
         @include bem.modifier('quiet') {
diff --git a/src/layouts/_card-list.vars.scss b/src/layouts/_card-list.vars.scss
index b4f30d9..4810834 100644
--- a/src/layouts/_card-list.vars.scss
+++ b/src/layouts/_card-list.vars.scss
@@ -29,6 +29,13 @@ $masonry-h--col-gap:        props.def(--l-card-list--masonry-h--col-gap, props.g
 $masonry-h--row-height:     props.def(--l-card-list--masonry-h--row-height, props.get(core.$size--3200)) !default;
 $masonry-h--quiet--row-gap: props.def(--l-card-list--masonry-h--quiet--row-gap, props.get(core.$size--800)) !default;
 
+$shadow-x:    props.def(--l-card-list--shadow-x, props.get(card.$shadow-x)) !default;
+$shadow-y:    props.def(--l-card-list--shadow-y, props.get(card.$shadow-y)) !default;
+$shadow-blur: props.def(--l-card-list--shadow-blur, props.get(card.$shadow-blur)) !default;
+$shadow-grow: props.def(--l-card-list--shadow-grow, props.get(card.$shadow-grow)) !default;
+
 $card-bg-color:      props.def(--l-card-list--bg-color, props.get(card.$bg-color), 'color') !default;
 $border-color:       props.def(--l-card-list--border-color, props.get(card.$border-color), 'color') !default;
+$shadow-color:       props.def(--l-card-list--shadow-color, props.get(card.$shadow-color), 'color') !default;
+
 $border-color-dark:  props.def(--l-card-list--border-color, props.get(core.$theme, --bg-l1), 'dark') !default;
-- 
cgit v1.2.3-70-g09d2