specificity issue no-marker option

Amsterdam · May 7, 2024 · e360c1e · e360c1e
1 parent fe72348
commit e360c1e
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/packages/css/src/components/ordered-list/ordered-list.scss b/packages/css/src/components/ordered-list/ordered-list.scss
@@ -38,12 +38,12 @@
   }
 }
 
-.ams-ordered-list--small {
+.ams-ordered-list--small:not(.ams-ordered-list--no-markers) {
   font-size: var(--ams-ordered-list-small-font-size);
   line-height: var(--ams-ordered-list-small-line-height);
 }
 
-.ams-ordered-list--large {
+.ams-ordered-list--large:not(.ams-ordered-list--no-markers) {
   font-size: var(--ams-ordered-list-large-font-size);
   line-height: var(--ams-ordered-list-large-line-height);
 }

diff --git a/storybook/src/components/OrderedList/OrderedList.stories.tsx b/storybook/src/components/OrderedList/OrderedList.stories.tsx
@@ -25,6 +25,13 @@ const meta = {
   argTypes: {
     reversed: { control: 'boolean' },
     start: { control: 'number' },
+    size: {
+      control: {
+        type: 'radio',
+        labels: { small: 'small', undefined: 'medium', large: 'large' },
+      },
+      options: ['small', undefined, 'large'],
+    },
   },
   decorators: [inverseColorDecorator],
 } satisfies Meta<typeof OrderedList>