public/svelte-carousel
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

expose CSS timing function string

Browse Source
This commit is contained in:
Tonton-Blax
2021-03-18 18:18:34 +01:00
parent 5a4b46eafb
commit 3f8604a782
1 changed files with 3 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Carousel/Carousel.svelte
View File

@@ -18,6 +18,8 @@
[PREV]: showPrevPage [PREV]: showPrevPage
} }
export let timingFunction = "ease-in-out";
/** /**
* Enable Next/Prev arrows * Enable Next/Prev arrows
*/ */
@@ -213,6 +215,7 @@
> >
<div <div
class="sc-carousel__pages-container" class="sc-carousel__pages-container"
style="transition-timing-function: {timingFunction};"
use:swipeable="{{ thresholdProvider: () => pageWidth/3 }}" use:swipeable="{{ thresholdProvider: () => pageWidth/3 }}"
on:start={handleSwipeStart} on:start={handleSwipeStart}
on:move={handleSwipeMove} on:move={handleSwipeMove}
@@ -276,7 +279,6 @@
.sc-carousel__pages-container { .sc-carousel__pages-container {
width: 100%; width: 100%;
display: flex; /* to put child elements in one row */ display: flex; /* to put child elements in one row */
transition-timing-function: ease-in-out;
transition-property: transform; transition-property: transform;
} }
.sc-carousel__arrow-container { .sc-carousel__arrow-container {