From c09711e30aeed4b97376ad121716ee4ed0898503 Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Mon, 21 Jul 2025 18:11:01 +0200
Subject: Flat card

---
 src/objects/_card.scss | 22 +++++-----------------
 1 file changed, 5 insertions(+), 17 deletions(-)

(limited to 'src/objects/_card.scss')

diff --git a/src/objects/_card.scss b/src/objects/_card.scss
index 9f70420..4f8c7fb 100644
--- a/src/objects/_card.scss
+++ b/src/objects/_card.scss
@@ -20,12 +20,6 @@
         border-color:     props.get(vars.$border-color);
         border-radius:    props.get(vars.$rounding);
         transition:       transform .2s;
-        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.multi('&:link, &:visited, &:enabled', 'modifier' 'interactive') {
             &:hover,
@@ -45,14 +39,12 @@
             }
 
             &:focus-visible {
-                margin:        calc(-1 * props.get(vars.$key-focus--border-width));
+                margin:        calc(-1 * props.get(vars.$key-focus--border-width) + 1px);
                 border:        props.get(vars.$key-focus--border-offset) solid transparent;
-                border-radius: calc(props.get(vars.$rounding) + props.get(vars.$key-focus--border-offset));
+                border-radius: calc(props.get(vars.$rounding) + props.get(vars.$key-focus--border-offset) - 1px);
                 outline:       props.get(vars.$key-focus--border-color) solid props.get(vars.$key-focus--border-width);
                 box-shadow:
-                    0
-                    0
-                    0
+                    0 0 0
                     calc(props.get(vars.$key-focus--border-width) + props.get(vars.$key-focus--outline-width))
                     props.get(vars.$key-focus--outline-color);
             }
@@ -179,7 +171,9 @@
                 }
 
                 &:focus-visible {
+                    margin:     0;
                     outline:    none;
+                    border:     0;
                     box-shadow: none;
 
                     @include bem.elem('image') {
@@ -204,12 +198,6 @@
                 background-color: props.get(vars.$quiet--image-color);
                 background-clip:  padding-box;
                 border-radius:    props.get(vars.$rounding);
-                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.elem('body') {
-- 
cgit v1.2.3-70-g09d2