feat(list): Revamp of unordered list - FRONT-4304 (#3284)

ec-europa · Mar 13, 2024 · bb33ec0 · bb33ec0 · github-actions · Mar 13, 2024
1 parent 2a1664f
commit bb33ec0
Showing 1 changed file with 8 additions and 14 deletions.
diff --git a/src/implementations/vanilla/components/unordered-list/unordered-list.scss b/src/implementations/vanilla/components/unordered-list/unordered-list.scss
@@ -16,33 +16,37 @@ $list: null !default;
   list-style-position: outside;
   list-style-type: map.get($list, 'unordered', 'marker');
   margin: 0;
+  padding-bottom: var(--s-2xs);
   padding-inline-start: var(--s-3xl);
 }
 
 .ecl-unordered-list__item,
 %ecl-unordered-list__item {
   margin-inline-start: var(--s-m);
-  margin-top: var(--s-m);
+  padding-bottom: var(--s-2xs);
+  padding-top: var(--s-2xs);
   max-width: var(--max-w);
   padding-inline-start: var(--s-xs);
 
   &:first-of-type {
-    margin-top: var(--s-xs);
+    padding-top: var(--s-2xs);
   }
 
   &:last-of-type {
-    margin-bottom: var(--s-xs);
+    padding-bottom: 0;
   }
 }
 
 .ecl-unordered-list .ecl-unordered-list,
 .ecl-unordered-list .ecl-ordered-list,
 %ecl-unordered-list--nested {
   list-style-type: map.get($list, 'unordered', 'sublist-marker');
-  margin-top: var(--s-xs);
+  padding-bottom: 0;
+  padding-top: var(--s-2xs);
   padding-inline-start: calc(var(--s-3xl) - var(--s-m) - var(--s-xs));
 
   .ecl-unordered-list__item {
+    padding-top: var(--s-2xs);
     padding-inline-start: 0;
   }
 }
@@ -95,13 +99,3 @@ $list: null !default;
     }
   }
 }
-
-.ecl-unordered-list
-  .ecl-unordered-list
-  .ecl-unordered-list__item:first-of-type {
-  margin-top: var(--s-m);
-}
-
-.ecl-unordered-list .ecl-unordered-list .ecl-unordered-list__item:last-of-type {
-  margin-bottom: 0;
-}