This commit is contained in:
parent
facc192da5
commit
0c7e669d1c
|
|
@ -16,12 +16,9 @@
|
|||
|
||||
.navBtn {
|
||||
flex-shrink: 0;
|
||||
width: 3.125rem;
|
||||
height: 3.125rem;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rem 0 .75rem 0rem rgba(20, 53, 92, 0.2);
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
/* width: 3.125rem;
|
||||
height: 3.125rem; */
|
||||
/* background: #FFFFFF; */
|
||||
cursor: pointer;
|
||||
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -44,13 +44,12 @@ export default function SwiperCardSection({ data, disableHover=false }: { data:
|
|||
<SectionTitle title={data.title} />
|
||||
<div className={styles.carouselWrapper} >
|
||||
{activeIndex > 0 && (
|
||||
<button
|
||||
type="button"
|
||||
<div
|
||||
className={styles.navBtn}
|
||||
onClick={() => swiperRef?.slidePrev()}
|
||||
>
|
||||
<svg style={{ transform: 'rotate(180deg)' }} fill="#14355C" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8355" width="24" height="24"><path d="M384.213333 170.666667l341.333334 341.333333-341.333334 341.333333L298.666667 768l256.213333-256L298.666667 256z" fill="#14355C" p-id="8356"></path></svg>
|
||||
</button>
|
||||
<svg style={{ transform: 'rotate(180deg)' }} xmlns="http://www.w3.org/2000/svg" fill="none" version="1.1" width="86" height="86" viewBox="0 0 86 86"><defs><filter id="master_svg0_199_76389" filterUnits="objectBoundingBox" color-interpolation-filters="sRGB" x="-0.48" y="-0.4800000366210965" width="1.96" height="1.9600000732421932"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="0" dx="0"/><feGaussianBlur stdDeviation="6"/><feColorMatrix type="matrix" values="0 0 0 0 0.0784313753247261 0 0 0 0 0.2078431397676468 0 0 0 0 0.3607843220233917 0 0 0 0.20000000298023224 0"/><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/></filter></defs><g transform="matrix(-1,0,0,1,136,0)"><path d="M93,67.99999600000001C79.192875,67.99999600000001,68,56.806992,68,42.999998000000005C68,29.192875,79.192875,18,93,18C106.80699899999999,18,118,29.192875,118,42.999998000000005C118,56.806992,106.80699899999999,67.99999600000001,93,67.99999600000001C93,67.99999600000001,93,67.99999600000001,93,67.99999600000001Z" fill-rule="evenodd" fill="#FFFFFF" fill-opacity="1" filter="url(#master_svg0_199_76389)"/><path d="M97.996325,51.596814248229975C97.996325,51.596814248229975,95.3826752,54.25306224822998,95.3826752,54.25306224822998C95.3826752,54.25306224822998,86.16099745,44.74343824822998,86.16099745,44.74343824822998C85.2206375,43.77371324822998,85.22064,42.23238724822998,86.16100001,41.26268674822998C86.16100001,41.26268674822998,95.3826752,31.75306224822998,95.3826752,31.75306224822998C95.3826752,31.75306224822998,97.996325,34.40931244822998,97.996325,34.40931244822998C97.996325,34.40931244822998,89.7006497,43.00306224822998,89.7006497,43.00306224822998C89.7006497,43.00306224822998,97.996325,51.596814248229975,97.996325,51.596814248229975C97.996325,51.596814248229975,97.996325,51.596814248229975,97.996325,51.596814248229975Z" fill-rule="evenodd" fill="#14355C" fill-opacity="1"/></g></svg>
|
||||
</div>
|
||||
)}
|
||||
<Swiper
|
||||
onSwiper={setSwiperRef}
|
||||
|
|
@ -78,13 +77,12 @@ export default function SwiperCardSection({ data, disableHover=false }: { data:
|
|||
))}
|
||||
</Swiper>
|
||||
{activeIndex < data.cardItems.length - 1 && (
|
||||
<button
|
||||
type="button"
|
||||
<div
|
||||
className={`${styles.navBtn} ${styles.nextBtn}`}
|
||||
onClick={() => swiperRef?.slideNext()}
|
||||
>
|
||||
<svg fill="#14355C" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8355" width="24" height="24"><path d="M384.213333 170.666667l341.333334 341.333333-341.333334 341.333333L298.666667 768l256.213333-256L298.666667 256z" fill="#14355C" p-id="8356"></path></svg>
|
||||
</button>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" version="1.1" width="86" height="86" viewBox="0 0 86 86"><defs><filter id="master_svg0_199_76389" filterUnits="objectBoundingBox" color-interpolation-filters="sRGB" x="-0.48" y="-0.4800000366210965" width="1.96" height="1.9600000732421932"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="0" dx="0"/><feGaussianBlur stdDeviation="6"/><feColorMatrix type="matrix" values="0 0 0 0 0.0784313753247261 0 0 0 0 0.2078431397676468 0 0 0 0 0.3607843220233917 0 0 0 0.20000000298023224 0"/><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/></filter></defs><g transform="matrix(-1,0,0,1,136,0)"><path d="M93,67.99999600000001C79.192875,67.99999600000001,68,56.806992,68,42.999998000000005C68,29.192875,79.192875,18,93,18C106.80699899999999,18,118,29.192875,118,42.999998000000005C118,56.806992,106.80699899999999,67.99999600000001,93,67.99999600000001C93,67.99999600000001,93,67.99999600000001,93,67.99999600000001Z" fill-rule="evenodd" fill="#FFFFFF" fill-opacity="1" filter="url(#master_svg0_199_76389)"/><path d="M97.996325,51.596814248229975C97.996325,51.596814248229975,95.3826752,54.25306224822998,95.3826752,54.25306224822998C95.3826752,54.25306224822998,86.16099745,44.74343824822998,86.16099745,44.74343824822998C85.2206375,43.77371324822998,85.22064,42.23238724822998,86.16100001,41.26268674822998C86.16100001,41.26268674822998,95.3826752,31.75306224822998,95.3826752,31.75306224822998C95.3826752,31.75306224822998,97.996325,34.40931244822998,97.996325,34.40931244822998C97.996325,34.40931244822998,89.7006497,43.00306224822998,89.7006497,43.00306224822998C89.7006497,43.00306224822998,97.996325,51.596814248229975,97.996325,51.596814248229975C97.996325,51.596814248229975,97.996325,51.596814248229975,97.996325,51.596814248229975Z" fill-rule="evenodd" fill="#14355C" fill-opacity="1"/></g></svg>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
Loading…
Reference in New Issue