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

Update docs

Browse Source
This commit is contained in:
Vadim
2021-06-30 23:54:13 +03:00
parent 538bfc52ea
commit b2890fe111
3 changed files with 64 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/index.css
View File

@@ -1,10 +1,9 @@
html,body{position:relative;width:100%;height:100%;margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;}
code[class*="language-"],pre[class*="language-"] {color:#ccc;background:none;font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;}pre[class*="language-"] {padding:1em;margin:.5em 0;overflow:auto;}:not(pre) > code[class*="language-"],pre[class*="language-"] {background:#2d2d2d;}:not(pre) > code[class*="language-"] {padding:.1em;border-radius:.3em;white-space:normal;}.token.comment,.token.block-comment,.token.prolog,.token.doctype,.token.cdata {color:#999;}.token.punctuation {color:#ccc;}.token.tag,.token.attr-name,.token.namespace,.token.deleted {color:#e2777a;}.token.function-name {color:#6196cc;}.token.boolean,.token.number,.token.function {color:#f08d49;}.token.property,.token.class-name,.token.constant,.token.symbol {color:#f8c555;}.token.selector,.token.important,.token.atrule,.token.keyword,.token.builtin {color:#cc99cd;}.token.string,.token.char,.token.attr-value,.token.regex,.token.variable {color:#7ec699;}.token.operator,.token.entity,.token.url {color:#67cdcc;}.token.important,.token.bold {font-weight:bold;}.token.italic {font-style:italic;}.token.entity {cursor:help;}.token.inserted {color:green;}
.img-container.svelte-14lrqxf.svelte-14lrqxf{display:block;width:100%;height:200px}.img-container.svelte-14lrqxf>img.svelte-14lrqxf{width:100%;height:100%;object-fit:cover;-webkit-user-drag:none}.table-wrapper.svelte-14lrqxf.svelte-14lrqxf{max-width:100%;overflow-x:auto}table.svelte-14lrqxf.svelte-14lrqxf{border-collapse:collapse}tr.svelte-14lrqxf.svelte-14lrqxf{border-bottom:2px solid #009800}td.svelte-14lrqxf.svelte-14lrqxf{padding:2px 10px}th.svelte-14lrqxf.svelte-14lrqxf{padding:5px 10px}.custom-arrow.svelte-14lrqxf.svelte-14lrqxf{width:20px;background-color:#000000;opacity:0.3;position:absolute;top:0;bottom:0;z-index:1;transition:opacity 150ms ease;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent}.custom-arrow.svelte-14lrqxf.svelte-14lrqxf:hover{opacity:0.5}.custom-arrow.svelte-14lrqxf>i.svelte-14lrqxf{border:solid #1e1e1e;border-width:0 5px 5px 0;padding:5px;position:relative}.custom-arrow-prev.svelte-14lrqxf.svelte-14lrqxf{left:0}.custom-arrow-prev.svelte-14lrqxf>i.svelte-14lrqxf{transform:rotate(135deg);right:-4px}.custom-arrow-next.svelte-14lrqxf.svelte-14lrqxf{right:0}.custom-arrow-next.svelte-14lrqxf>i.svelte-14lrqxf{transform:rotate(-45deg);left:-4px}.custom-dots.svelte-14lrqxf.svelte-14lrqxf{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;padding:0 20px}
.color-container.svelte-1bsdhrs.svelte-1bsdhrs{height:150px;width:100%;display:flex;align-items:center;justify-content:center;user-select:none}.color-container.svelte-1bsdhrs>p.svelte-1bsdhrs{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;font-style:italic;font-size:18px}
.divider.svelte-1dny3ln{margin-top:30px;margin-bottom:30px;height:1px}
.color-container.svelte-1bsdhrs.svelte-1bsdhrs{height:150px;width:100%;display:flex;align-items:center;justify-content:center;user-select:none}.color-container.svelte-1bsdhrs>p.svelte-1bsdhrs{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;font-style:italic;font-size:18px}
.custom-dot__dot-container.svelte-1ufq367{height:25px;width:25px;background-color:#727272;border-radius:50%;opacity:0.7;display:flex;align-items:center;justify-content:center;margin:5px;cursor:pointer;-webkit-tap-highlight-color:transparent}.custom-dot__dot-container.svelte-1ufq367:hover{opacity:0.9}.custom-dot__dot-container_active.svelte-1ufq367{background-color:#009800}.custom-dot__symbol.svelte-1ufq367{font-size:14px;font-weight:bold;color:#eaeaea}
.color-container.svelte-1bsdhrs.svelte-1bsdhrs{height:150px;width:100%;display:flex;align-items:center;justify-content:center;user-select:none}.color-container.svelte-1bsdhrs>p.svelte-1bsdhrs{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;font-style:italic;font-size:18px}
.sc-carousel__carousel-container.svelte-1pac7rj{display:flex;width:100%;flex-direction:column;align-items:center}.sc-carousel__content-container.svelte-1pac7rj{position:relative;display:flex;width:100%}.sc-carousel__pages-window.svelte-1pac7rj{flex:1;display:flex;overflow:hidden;box-sizing:border-box}.sc-carousel__pages-container.svelte-1pac7rj{width:100%;display:flex;transition-property:transform}.sc-carousel__arrow-container.svelte-1pac7rj{padding:5px;box-sizing:border-box;display:flex;align-items:center;justify-content:center}
.albums-container.svelte-tqqkfc.svelte-tqqkfc{display:flex;justify-content:center;flex-wrap:wrap}.album-container.svelte-tqqkfc.svelte-tqqkfc{width:250px;padding:10px;background-color:#c6c6c6;border-radius:5px;margin:5px}.album-title.svelte-tqqkfc.svelte-tqqkfc{font-size:16px}.album-size.svelte-tqqkfc.svelte-tqqkfc{font-size:10px;color:#585858}.album-tag.svelte-tqqkfc.svelte-tqqkfc{background-color:#8f8f8f;border-radius:5px;padding:1px 5px;color:#ffffff;margin-top:3px;margin-bottom:3px;display:inline-block;font-size:10px}.album-tag.svelte-tqqkfc.svelte-tqqkfc:not(:last-child){margin-right:3px}.album-arrow.svelte-tqqkfc.svelte-tqqkfc{width:20px;background-color:#000000;opacity:0;position:absolute;top:0;bottom:0;z-index:1;transition:opacity 150ms ease;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent}.album-arrow.svelte-tqqkfc>i.svelte-tqqkfc{border:solid #1e1e1e;border-width:0 5px 5px 0;padding:5px;position:relative}.album-container.svelte-tqqkfc:hover .album-arrow.svelte-tqqkfc{opacity:0.5}.album-arrow-prev.svelte-tqqkfc.svelte-tqqkfc{left:0}.album-arrow-prev.svelte-tqqkfc>i.svelte-tqqkfc{transform:rotate(135deg);right:-4px}.album-arrow-next.svelte-tqqkfc.svelte-tqqkfc{right:0}.album-arrow-next.svelte-tqqkfc>i.svelte-tqqkfc{transform:rotate(-45deg);left:-4px}
.docs__main-layout__main-container.svelte-17evj66.svelte-17evj66{background-color:#eaeaea}.docs__main-layout__header-container.svelte-17evj66.svelte-17evj66{display:flex;flex-direction:column;align-items:center;justify-content:center;height:300px;padding:10px;box-sizing:border-box;background-color:#f0e68c}.docs__main-layout__logo.svelte-17evj66.svelte-17evj66{height:80%;max-width:100%;object-fit:contain}.docs__main-layout__links-container.svelte-17evj66.svelte-17evj66{display:flex;justify-content:center;padding:10px}.docs__main-layout__links-container.svelte-17evj66>a.svelte-17evj66{text-decoration:none;color:#009800;font-size:18px}.docs__main-layout__links-container.svelte-17evj66>a.svelte-17evj66:not(:last-child){margin-right:10px}.docs__main-layout__content-container.svelte-17evj66.svelte-17evj66{margin:0 auto}@media screen and (min-width:0px){.docs__main-layout__content-container.svelte-17evj66.svelte-17evj66{width:95%}}@media screen and (min-width:768px){.docs__main-layout__content-container.svelte-17evj66.svelte-17evj66{width:70%}}@media screen and (min-width:992px){.docs__main-layout__content-container.svelte-17evj66.svelte-17evj66{width:60%}}@media screen and (min-width:1200px){.docs__main-layout__content-container.svelte-17evj66.svelte-17evj66{width:50%}}

4
docs/index.js
View File

File diff suppressed because one or more lines are too long

62
src/docs/Carousel.svx
View File

@@ -350,7 +350,7 @@ Arguments:
| Argument | Type | Default | Description |
|--------------------|-------------|---------|---------------------------------------|
| `pageIndex` | `number` | | Page number |
| `options.animated` | `boolean` | `true` | Should it be animated or not |
| `options.animated` | `boolean` | `true` | Should it be animated or not |
</div>
@@ -371,6 +371,66 @@ Arguments:
<button class="button" on:click={goToStartPage}>Go</button>
```
## `goToPrev`
Navigates to the previous page
Arguments:
<div class="table-wrapper">
| Argument | Type | Default | Description |
|--------------------|-------------|---------|---------------------------------------|
| `options.animated` | `boolean` | `true` | Should it be animated or not |
</div>
```jsx
<script>
// ...
let carousel;
function goToPrevPage() {
carousel.goToPrev({ animated: false })
}
</script>
<Carousel
bind:this={carousel}
>
<!-- -->
</Carousel>
<button class="button" on:click={goToPrevPage}>Go</button>
```
## `goToNext`
Navigates to the next page
Arguments:
<div class="table-wrapper">
| Argument | Type | Default | Description |
|--------------------|-------------|---------|---------------------------------------|
| `options.animated` | `boolean` | `true` | Should it be animated or not |
</div>
```jsx
<script>
// ...
let carousel;
function goToNextPage() {
carousel.goToNext({ animated: false })
}
</script>
<Carousel
bind:this={carousel}
>
<!-- -->
</Carousel>
<button class="button" on:click={goToNextPage}>Go</button>
```
<Divider />
<style>