Skip to content

Commit

Permalink
Merge pull request #4528 from Modern-artist/stickCarouselArrow
Browse files Browse the repository at this point in the history
In layer5/learn page slick-slider(carousel) arrows are not aligned.
  • Loading branch information
Nikhil-Ladha committed Jul 16, 2023
2 parents 113ce07 + e38a3d4 commit 7082f55
Showing 1 changed file with 5 additions and 19 deletions.
24 changes: 5 additions & 19 deletions src/sections/Learn/LearnPage-Sections/workshops.js
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,7 @@ export const WorkshopsListWrapper = styled.div`
background: ${props => props.theme.secondaryColor};
width: 2.75rem;
height: 2.75rem;
padding: 8px;
border-radius: 2rem;
&:hover {
Expand Down Expand Up @@ -216,30 +217,15 @@ const WorkshopsSection = () => {

const hasMounted = useHasMounted();

/* currentSlide, slideCount is needed to prevent another console error
ref: https://github.com/akiran/react-slick/issues/1195#issuecomment-390383615
*/
// eslint-disable-next-line no-unused-vars
const SlickButtonFix = ({ currentSlide, slideCount, children, ...props }) => {
const childrenWithProps = React.cloneElement(children, { ...props });
return (
<>
{ childrenWithProps }
</>
);
};

var settings = {
infinite: false,
speed: 400,
slidesToShow: 1,
slidesToScroll: 1,
nextArrow: (<SlickButtonFix>
<FiArrowRight />
</SlickButtonFix>),
prevArrow: (<SlickButtonFix>
<FiArrowLeft />
</SlickButtonFix>),
nextArrow: (
<FiArrowRight />),
prevArrow: (
<FiArrowLeft />),
responsive: [
{
breakpoint: 700,
Expand Down

0 comments on commit 7082f55

Please sign in to comment.