discours.io/webapp
5
0
Fork 0
Code Issues Pull Requests Actions Projects Wiki Activity

Change slides per view (#303)

Browse Source
This commit is contained in:
Ilya Y 2023-11-09 10:51:26 +03:00 committed by GitHub
parent f2b709e3f9
commit 3a1e82d522
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/_shared/SolidSwiper/ArticleCardSwiper.tsx
View File

@ -10,7 +10,6 @@ import { ArticleCard } from '../../Feed/ArticleCard'
type Props = {
slides: Shout[]
slidesPerView?: number
title?: string
}
@ -41,11 +40,10 @@ export const ArticleCardSwiper = (props: Props) => {
thumbs-swiper={'.thumbSwiper'}
observer={true}
onSlideChange={handleSlideChange}
slides-per-view={1}
space-between={26}
breakpoints={{
576: { slidesPerView: props.slidesPerView ?? 1.5 },
992: { spaceBetween: 52 }
576: { spaceBetween: 20, slidesPerView: 1 },
992: { spaceBetween: 52, slidesPerView: 1.5 }
}}
loop={true}
speed={800}
@ -89,9 +87,9 @@ export const ArticleCardSwiper = (props: Props) => {
>
<Icon name="swiper-r-arr" class={styles.icon} />
</div>
<div class={styles.counter}>
{slideIndex() + 1} / {props.slides.length}
</div>
{/*<div class={styles.counter}>*/}
{/* {slideIndex() + 1} / {props.slides.length}*/}
{/*</div>*/}
</div>
</Show>
</div>

3
src/components/_shared/SolidSwiper/Swiper.module.scss
View File

@ -129,8 +129,9 @@
overflow: hidden;
width: calc(100% - 130px);
@include media-breakpoint-down(sm) {
@media only screen and (max-width: 576px) {
width: 100%;
background: red;
}
.counter {