dokku/dokku-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix screenshots

Browse Source
This commit is contained in:
texm
2023-04-26 12:21:47 +08:00
parent 3b47426362
commit 27bdc129bc
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
web/src/routes/Screenshots.svelte
View File

@@ -8,18 +8,18 @@
{alt: "service overview", src: `${base}/images/service-overview.webp`}, {alt: "service overview", src: `${base}/images/service-overview.webp`},
] ]
const nextIdx = i => ((i + 1) % carouselImages.length); const len = carouselImages.length;
const prevIdx = i => (carouselImages - i) const modIdx = i => (1 + (i + len) % len);
</script> </script>
<div class="mockup-window rounded-xl bg-base-200 w-auto h-fit shadow-lg shadow-secondary"> <div class="mockup-window rounded-xl bg-base-200 w-auto h-fit shadow-lg shadow-secondary">
<div class="w-full carousel rounded-box"> <div class="w-full carousel rounded-box">
{#each carouselImages as image, i} {#each carouselImages as image, i}
<div id="img{1 + i}" class="carousel-item relative w-full"> <div id="img{modIdx(i)}" class="carousel-item relative w-full">
<img src={image.src} class="w-full" alt={image.alt} /> <img src={image.src} class="w-full" alt={image.alt} />
<div class="absolute flex justify-between transform -translate-y-1/2 left-5 right-5 top-1/2"> <div class="absolute flex justify-between transform -translate-y-1/2 left-5 right-5 top-1/2">
<a href="#img{1 + prevIdx(i)}" class="btn btn-circle">❮</a> <a href="#img{modIdx(i - 1)}" class="btn btn-circle">❮</a>
<a href="#img{1 + nextIdx(i)}" class="btn btn-circle">❯</a> <a href="#img{modIdx(i + 1)}" class="btn btn-circle">❯</a>
</div> </div>
</div> </div>
{/each} {/each}