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')}
+
)