diff --git a/src/components/client/index/sections/ActiveCampaignsSection/ActiveCampaignsSection.styled.tsx b/src/components/client/index/sections/ActiveCampaignsSection/ActiveCampaignsSection.styled.tsx index 59d772da3..5c82add39 100644 --- a/src/components/client/index/sections/ActiveCampaignsSection/ActiveCampaignsSection.styled.tsx +++ b/src/components/client/index/sections/ActiveCampaignsSection/ActiveCampaignsSection.styled.tsx @@ -40,20 +40,24 @@ export const ActiveCampaignsWrapper = styled(Grid)(() => ({ export const SeeAllButtonWrapper = styled(Grid)(() => ({ display: 'flex', placeContent: 'center', - marginTop: theme.spacing(10), + marginTop: theme.spacing(6), })) export const SeeAllButton = styled(LinkButton)(() => ({ - fontFamily: "'Lato', sans-serif", + fontFamily: 'sans-serif', fontSize: theme.typography.pxToRem(16), fontWeight: 600, - color: theme.palette.common.black, - letterSpacing: '0.4px', - textDecoration: 'underline', - marginTop: 0, + color: '#252222', + letterSpacing: '0.46px', + backgroundColor: theme.palette.primary.light, + lineHeight: theme.spacing(3.25), + width: theme.spacing(28.5), + height: theme.spacing(6), + boxShadow: + '0px 3px 1px -2px rgba(0, 0, 0, 0.2),0px 2px 2px 0px rgba(0, 0, 0, 0.14),0px 1px 5px 0px rgba(0, 0, 0, 0.12)', '&:hover': { - backgroundColor: 'transparent', - textDecoration: 'underline', + boxShadow: + '0px 3px 1px -2px rgba(0, 0, 0, 0.2),0px 2px 2px 0px rgba(0, 0, 0, 0.14),0px 1px 5px 0px rgba(0, 0, 0, 0.12)', }, })) diff --git a/src/components/client/index/sections/ActiveCampaignsSection/ActiveCampaignsSection.tsx b/src/components/client/index/sections/ActiveCampaignsSection/ActiveCampaignsSection.tsx index 5e43ff626..34feaa7e0 100644 --- a/src/components/client/index/sections/ActiveCampaignsSection/ActiveCampaignsSection.tsx +++ b/src/components/client/index/sections/ActiveCampaignsSection/ActiveCampaignsSection.tsx @@ -1,5 +1,7 @@ import { useTranslation } from 'next-i18next' +import ArrowForwardIcon from '@mui/icons-material/ArrowForward' + import { useCampaignList } from 'common/hooks/campaigns' import { routes } from 'common/routes' import { CampaignState } from 'components/client/campaigns/helpers/campaign.enums' @@ -28,9 +30,14 @@ export default function ActiveCampaignsSection() { {activeCampaigns?.map((campaign, index) => ( ))} - {' '} + - {t('campaign.see-all')} + }> + {t('campaign.see-all')} + )