SwiperNav.js
1.99 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
import React from "react";
const SwiperNav = () => {
return (
<>
<button className="custom-swiper-button-prev border-0 bg-transparent m-2">
<svg
xmlns="http://www.w3.org/2000/svg"
width="31"
height="30"
viewBox="0 0 31 30"
fill="none"
>
<path
d="M15.5 0C23.7713 0 30.5 6.71112 30.5 14.9607C30.5 23.2104 23.7713 29.9215 15.5 29.9215C7.22873 29.9215 0.5 23.2104 0.5 14.9607C0.5 6.71112 7.22873 0 15.5 0ZM10.8662 15.8422L17.1163 22.0758C17.36 22.3189 17.68 22.4411 18 22.4411C18.32 22.4411 18.64 22.3189 18.8838 22.0758C19.3725 21.5883 19.3725 20.8004 18.8838 20.3129L13.5175 14.9607L18.8837 9.60853C19.3725 9.12108 19.3725 8.33313 18.8837 7.84568C18.395 7.35823 17.605 7.35823 17.1163 7.84568L10.8662 14.0793C10.3775 14.5668 10.3775 15.3547 10.8662 15.8422Z"
fill="#CDCDCD"
/>
</svg>
</button>
<button className="custom-swiper-button-next border-0 bg-transparent m-2">
<svg
xmlns="http://www.w3.org/2000/svg"
width="31"
height="30"
viewBox="0 0 31 30"
fill="none"
>
<path
d="M15.5 0C7.22873 0 0.5 6.71112 0.5 14.9607C0.5 23.2104 7.22873 29.9215 15.5 29.9215C23.7713 29.9215 30.5 23.2104 30.5 14.9607C30.5 6.71112 23.7713 0 15.5 0ZM20.1338 15.8422L13.8837 22.0758C13.64 22.3189 13.32 22.4411 13 22.4411C12.68 22.4411 12.36 22.3189 12.1162 22.0758C11.6275 21.5883 11.6275 20.8004 12.1162 20.3129L17.4825 14.9607L12.1163 9.60853C11.6275 9.12108 11.6275 8.33313 12.1163 7.84568C12.605 7.35823 13.395 7.35823 13.8837 7.84568L20.1338 14.0793C20.6225 14.5668 20.6225 15.3547 20.1338 15.8422Z"
fill="#CDCDCD"
/>
</svg>
</button>
</>
);
};
export default SwiperNav;