From 06396f8e942c58254ee4e87f610d3e33197e0d73 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Thu, 7 Apr 2022 19:00:13 +0200
Subject: chore: add a DescriptionList component

---
 .../atoms/lists/description-list.module.scss       | 42 ++++++++++++++++++++++
 1 file changed, 42 insertions(+)
 create mode 100644 src/components/atoms/lists/description-list.module.scss

(limited to 'src/components/atoms/lists/description-list.module.scss')

diff --git a/src/components/atoms/lists/description-list.module.scss b/src/components/atoms/lists/description-list.module.scss
new file mode 100644
index 0000000..4758816
--- /dev/null
+++ b/src/components/atoms/lists/description-list.module.scss
@@ -0,0 +1,42 @@
+@use "@styles/abstracts/mixins" as mix;
+
+.list {
+  display: flex;
+  flex-flow: column wrap;
+  gap: var(--spacing-2xs);
+  margin: 0;
+
+  &__item {
+    display: flex;
+    flex-flow: column wrap;
+    gap: var(--spacing-2xs);
+
+    @include mix.media("screen") {
+      @include mix.dimensions("sm") {
+        flex-flow: row wrap;
+      }
+    }
+  }
+
+  &__term {
+    flex: 0 0 max-content;
+    color: var(--color-fg-light);
+    font-weight: 600;
+  }
+
+  &__description {
+    flex: 0 0 auto;
+    margin: 0;
+
+    @include mix.media("screen") {
+      @include mix.dimensions("sm") {
+        &:not(:first-of-type) {
+          &::before {
+            content: "/";
+            margin: 0 var(--spacing-2xs);
+          }
+        }
+      }
+    }
+  }
+}
-- 
cgit v1.2.3