diff options
Diffstat (limited to 'src/components/atoms/lists/description-list.module.scss')
| -rw-r--r-- | src/components/atoms/lists/description-list.module.scss | 42 |
1 files changed, 27 insertions, 15 deletions
diff --git a/src/components/atoms/lists/description-list.module.scss b/src/components/atoms/lists/description-list.module.scss index 4758816..caa2711 100644 --- a/src/components/atoms/lists/description-list.module.scss +++ b/src/components/atoms/lists/description-list.module.scss @@ -6,18 +6,6 @@ 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); @@ -27,16 +15,40 @@ &__description { flex: 0 0 auto; margin: 0; + } + + &__item { + display: flex; + } + + &--inline &__item { + flex-flow: column wrap; @include mix.media("screen") { - @include mix.dimensions("sm") { - &:not(:first-of-type) { + @include mix.dimensions("xs") { + flex-flow: row wrap; + gap: var(--spacing-2xs); + + .list__description:not(:first-of-type) { &::before { content: "/"; - margin: 0 var(--spacing-2xs); + margin-right: var(--spacing-2xs); } } } } } + + &--column#{&}--responsive { + @include mix.media("screen") { + @include mix.dimensions("xs") { + flex-flow: row wrap; + gap: var(--spacing-lg); + } + } + } + + &--column &__item { + flex-flow: column wrap; + } } |
