diff --git a/src/components/client/index/sections/CompletedCampaignsSection/CompletedCampaignsSection.styled.tsx b/src/components/client/index/sections/CompletedCampaignsSection/CompletedCampaignsSection.styled.tsx index 01e9ec2d7..867f65825 100644 --- a/src/components/client/index/sections/CompletedCampaignsSection/CompletedCampaignsSection.styled.tsx +++ b/src/components/client/index/sections/CompletedCampaignsSection/CompletedCampaignsSection.styled.tsx @@ -30,6 +30,13 @@ export const CarouselWrapper = styled(Slider)(() => ({ }, })) +export const CardWrapper = styled(Grid)(() => ({ + [theme.breakpoints.up('sm')]: { + margin: theme.spacing(0, 1.25), + paddingRight: theme.spacing(2.5), + }, +})) + export const CompletedCampaignLink = styled(Link)(() => ({ height: theme.spacing(37.5), backgroundSize: 'cover', diff --git a/src/components/client/index/sections/CompletedCampaignsSection/CompletedCampaignsSection.tsx b/src/components/client/index/sections/CompletedCampaignsSection/CompletedCampaignsSection.tsx index 1f0057de3..7ab799609 100644 --- a/src/components/client/index/sections/CompletedCampaignsSection/CompletedCampaignsSection.tsx +++ b/src/components/client/index/sections/CompletedCampaignsSection/CompletedCampaignsSection.tsx @@ -24,6 +24,7 @@ import { CampaignTitle, CompletedCampaignLink, MoneyWrapperFlex, + CardWrapper, } from './CompletedCampaignsSection.styled' export default function CompletedCampaignsSection() { @@ -45,11 +46,7 @@ export default function CompletedCampaignsSection() { {completedCampaigns?.map((campaign, index) => ( - + {campaign.title} - + ))} diff --git a/src/components/client/index/sections/CompletedCampaignsSection/helpers/CompletedCampaignsCarouselSettings.tsx b/src/components/client/index/sections/CompletedCampaignsSection/helpers/CompletedCampaignsCarouselSettings.tsx index 02a90a895..783e925a6 100644 --- a/src/components/client/index/sections/CompletedCampaignsSection/helpers/CompletedCampaignsCarouselSettings.tsx +++ b/src/components/client/index/sections/CompletedCampaignsSection/helpers/CompletedCampaignsCarouselSettings.tsx @@ -5,6 +5,7 @@ export const settings: Settings = { speed: 500, slidesToShow: 4, slidesToScroll: 1, + arrows: false, dots: true, lazyLoad: 'ondemand', autoplay: true, @@ -24,7 +25,7 @@ export const settings: Settings = { }, }, { - breakpoint: 500, + breakpoint: 600, settings: { slidesToShow: 1, }, diff --git a/src/components/client/index/sections/PlatformStatisticsSection/PlatformStatisticsSection.styled.tsx b/src/components/client/index/sections/PlatformStatisticsSection/PlatformStatisticsSection.styled.tsx index 0a08a3f2b..c24d71384 100644 --- a/src/components/client/index/sections/PlatformStatisticsSection/PlatformStatisticsSection.styled.tsx +++ b/src/components/client/index/sections/PlatformStatisticsSection/PlatformStatisticsSection.styled.tsx @@ -69,7 +69,7 @@ export const HelpThoseInNeedButton = styled(LinkButton)(() => ({ minWidth: theme.spacing(50), '& span': { - display: 'inline-block', + display: 'inline-flex', }, }, }))