From 36890cfafeba6e30782df1260d7f9e678c7da4bf Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Mon, 2 Oct 2023 17:01:57 +0200 Subject: refactor(components): rewrite DescriptionList component * add a `spacing` prop * replace `layout` prop with `isInline` prop * remove `items` prop (and classNames props) in favor of new components: Description, Group, Term * remove `withSeparator` prop (CSS content is announced by screen readers and Firefox/Safari have no support for alternative text so the consumer should add itself an element with `aria-hidden` if it need a separator) Be aware, Meta component and its consumers can be visually broken, they should be refactored before using them in production. --- src/styles/pages/partials/_article-lists.scss | 15 ++++----------- 1 file changed, 4 insertions(+), 11 deletions(-) (limited to 'src/styles/pages/partials/_article-lists.scss') diff --git a/src/styles/pages/partials/_article-lists.scss b/src/styles/pages/partials/_article-lists.scss index e872d3c..562ee70 100644 --- a/src/styles/pages/partials/_article-lists.scss +++ b/src/styles/pages/partials/_article-lists.scss @@ -13,24 +13,17 @@ } dl { - display: flex; - flex-flow: row wrap; - gap: var(--spacing-2xs); + @extend %inline-description-list; + width: fit-content; margin: var(--spacing-sm) 0; - - & & { - margin: var(--spacing-2xs) 0 0; - } } dt { - color: var(--color-fg-light); - font-weight: 600; + @extend %term; } dd { - margin: 0; - word-break: break-all; + @extend %description; } } -- cgit v1.2.3