Update irregularity button on campaign page

podkrepi-bg · Aug 15, 2024 · 5665f95 · 5665f95
1 parent 3975690
commit 5665f95
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 23 deletions.
diff --git a/public/locales/bg/campaigns.json b/public/locales/bg/campaigns.json
@@ -123,7 +123,7 @@
     },
     "gallery": "Галерия",
     "financial-report": "Финансови отчети",
-    "report-campaign": "Докладвайте кампанията",
+    "report-campaign": "Подайте сигнал за нередност",
     "feedback": "Обратна връзка",
     "beneficiary": {
       "name": "Бенефициент",

diff --git a/public/locales/en/campaigns.json b/public/locales/en/campaigns.json
@@ -123,7 +123,7 @@
     },
     "gallery": "Gallery",
     "financial-report": "Financial report",
-    "report-campaign": "Report the campaign",
+    "report-campaign": "Report an irregularity",
     "feedback": "Feedback",
     "beneficiary": {
       "name": "Beneficiary",

diff --git a/src/components/client/campaigns/CampaignDetails.tsx b/src/components/client/campaigns/CampaignDetails.tsx
@@ -8,7 +8,7 @@ import { CampaignResponse } from 'gql/campaigns'
 import 'react-quill/dist/quill.bubble.css'
 
 import { Divider, Grid, IconButton, Tooltip, Typography } from '@mui/material'
-import SecurityIcon from '@mui/icons-material/Security'
+import NotificationsActiveOutlinedIcon from '@mui/icons-material/NotificationsActiveOutlined'
 import { styled } from '@mui/material/styles'
 
 import DonationWishes from './DonationWishes'
@@ -38,7 +38,7 @@ const classes = {
   banner: `${PREFIX}-banner`,
   campaignTitle: `${PREFIX}-campaignTitle`,
   linkButton: `${PREFIX}-linkButton`,
-  securityIcon: `${PREFIX}-securityIcon`,
+  irregularityIcon: `${PREFIX}-irregularityIcon`,
   subscribeLink: `${PREFIX}-subscribe`,
   financeSummary: `${PREFIX}-financeSummary`,
 }
@@ -79,11 +79,11 @@ const StyledGrid = styled(Grid)(({ theme }) => ({
   },
 
   [`& .${classes.linkButton}`]: {
-    fontSize: theme.typography.pxToRem(10),
+    fontSize: theme.typography.pxToRem(16),
     letterSpacing: theme.spacing(0.01),
     lineHeight: '150%',
     textDecoration: 'underline',
-    color: 'initial',
+    color: '#11356A',
 
     '&:hover': {
       textDecoration: 'underline',
@@ -92,7 +92,7 @@ const StyledGrid = styled(Grid)(({ theme }) => ({
     },
   },
 
-  [`& .${classes.securityIcon}`]: {
+  [`& .${classes.irregularityIcon}`]: {
     width: theme.spacing(2.25),
     height: theme.spacing(2.75),
   },
@@ -221,22 +221,12 @@ export default function CampaignDetails({ campaign }: Props) {
           <DonationWishes campaignId={campaign?.id} />
         </Grid>
         <Grid container item xs={12}>
-          <Grid item xs={12} mb={1}>
-            <LinkButton
-              startIcon={<SecurityIcon color="action" className={classes.securityIcon} />}
-              href={'/contact'}
-              className={classes.linkButton}>
-              {t('campaigns:campaign.feedback')}
-            </LinkButton>
-          </Grid>
-          <Grid item xs={12}>
-            <LinkButton
-              startIcon={<SecurityIcon color="action" className={classes.securityIcon} />}
-              href={`/campaigns/${campaign.slug}/irregularity`}
-              className={classes.linkButton}>
-              {t('campaigns:campaign.report-campaign')}
-            </LinkButton>
-          </Grid>
+          <LinkButton
+            startIcon={<NotificationsActiveOutlinedIcon className={classes.irregularityIcon} />}
+            href={`/campaigns/${campaign.slug}/irregularity`}
+            className={classes.linkButton}>
+            {t('campaigns:campaign.report-campaign')}
+          </LinkButton>
         </Grid>
       </Grid>
     </StyledGrid>