From 455339f7fa35f7621dc7d298870f973d1309020e Mon Sep 17 00:00:00 2001
From: Lukas Kasticky <lukas@kasticky.me>
Date: Sat, 25 May 2024 11:15:47 +0000
Subject: [PATCH] Allow use of card component with `role="article"`
---
scss/_index.scss | 2 +-
scss/components/_card.scss | 5 +++--
2 files changed, 4 insertions(+), 3 deletions(-)
diff --git a/scss/_index.scss b/scss/_index.scss
index 33d57bea7..5c931e9a4 100644
--- a/scss/_index.scss
+++ b/scss/_index.scss
@@ -35,7 +35,7 @@
// Components
@use "components/accordion"; // details, summary
-@use "components/card"; // article
+@use "components/card"; // article, role="article"
@use "components/dropdown"; // details.dropdown
@use "components/group"; // role="group"
@use "components/loading"; // aria-busy=true
diff --git a/scss/components/_card.scss b/scss/components/_card.scss
index 19d8358f7..d635566f3 100644
--- a/scss/components/_card.scss
+++ b/scss/components/_card.scss
@@ -3,10 +3,11 @@
@if map.get($modules, "components/card") {
/**
- * Card (<article>)
+ * Card (<article>, role="article")
*/
- #{$parent-selector} article {
+ #{$parent-selector} article,
+ #{$parent-selector} [role="article"] {
margin-bottom: var(#{$css-var-prefix}block-spacing-vertical);
padding: var(#{$css-var-prefix}block-spacing-vertical)
var(#{$css-var-prefix}block-spacing-horizontal);