arrow added | 60

temp
mahdi andalib 2 years ago
parent 4c30be3abd
commit 4da68738bd
  1. 55
      src/views/Products/layouts/Desktop/Main.js

@ -210,10 +210,10 @@ export const Main = ({
))}
</ul>
</div>
<div className="flex flex-col w-full relative">
{/* arrow */}
<div className="w-fit self-end flex flex-row items-center justify-between gap-x-2 px-2 py-1 bg-gray-50 border border-solid border-gray-200 rounded-md50">
{/* right arrow */}
{/* <div className="w-fit self-end flex flex-row items-center justify-between gap-x-2 px-2 py-1 bg-gray-50 border border-solid border-gray-200 rounded-md50">
<div className="cursor-pointer">
<img
src={dropdownIcon}
@ -221,9 +221,7 @@ export const Main = ({
className="w-5 transform -rotate-90 cursor-pointer"
/>
</div>
{/* divider */}
<div className="w-0.5 h-6 bg-gray-200"></div>
{/* left arrow */}
<div className="cursor-pointer">
<img
src={dropdownIcon}
@ -231,7 +229,7 @@ export const Main = ({
className="w-5 transform rotate-90 cursor-pointer"
/>
</div>
</div>
</div> */}
{/* carousel slider */}
{filterLoading && (
<div
@ -241,20 +239,45 @@ export const Main = ({
<Loading size={4} color="bg-green-400" />
</div>
)}
<div>
{(filterOptions?.productType
? filterOptions.productType === "دوره ویدئویی"
: true) && (
<ScrollingCarousel
rightArrow={<div>{">"}</div>}
leftArrow={<div>{"<"}</div>}
className="max-w-full"
{books.length > 0 && (
<div className="relative w-full" style={{ direction: "ltr" }}>
<Carousel
show={Math.round(window.innerWidth / 666)}
slide={2}
swiping={true}
useArrowKeys={true}
transition={0.5}
rightArrow={
<img
className="bg-gray-50 p-2 absolute top-0 transform -rotate-90 translate-y-0 translate-x-0 left-6 cursor-pointer"
src={dropdownIcon}
style={{
borderRight: "solid 2px #E5E7EB",
borderLeft: "solid 2px #E5E7EB",
borderBottom: "solid 2px #E5E7EB",
borderRadius: "4px",
}}
alt=""
/>
}
leftArrow={
<img
className="bg-gray-50 p-2 absolute top-0 transform rotate-90 translate-y-0 translate-x-0 left-0 cursor-pointer"
src={dropdownIcon}
style={{
borderRight: "solid 2px #E5E7EB",
borderLeft: "solid 2px #E5E7EB",
borderBottom: "solid 2px #E5E7EB",
borderRadius: "4px",
}}
alt=""
/>
}
>
{Items(2)}
</ScrollingCarousel>
)}
</div>
</Carousel>
</div>
)}
<div className="w-full flex flex-row flex-wrap mt-0 border-t-2 border-solid border-gray-100 overflow-y-hidden gap-4 justify-evenly pt-3">
{Items(1)}
</div>

Loading…
Cancel
Save