Add carousel-start modifier (#2889)

saadeghi · Mar 9, 2024 · 61e7d2b · 61e7d2b
1 parent f270829
commit 61e7d2b
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 0 deletions.
diff --git a/src/components/unstyled/carousel.css b/src/components/unstyled/carousel.css
@@ -10,6 +10,9 @@
     @apply box-content flex flex-none;
     scroll-snap-align: start;
   }
+  &-start .carousel-item {
+    scroll-snap-align: start;
+  }
   &-center .carousel-item {
     scroll-snap-align: center;
   }

diff --git a/src/docs/src/routes/(docs)/components/carousel/+page.svelte.md b/src/docs/src/routes/(docs)/components/carousel/+page.svelte.md
@@ -20,6 +20,7 @@ layout: components
 data="{[
   { type:'component', class: 'carousel', desc: 'Container element' },
   { type:'component', class: 'carousel-item', desc: 'Carousel item' },
+  { type:'modifier', class: 'carousel-start', desc: 'Snap elements to start(default)' },
   { type:'modifier', class: 'carousel-center', desc: 'Snap elements to center' },
   { type:'modifier', class: 'carousel-end', desc: 'Snap elements to end' },
   { type:'modifier', class: 'carousel-vertical', desc: 'Vertical carousel' },