Add tag for successfull camapign (#1107)

src/components/campaigns/CampaignCard.tsx

@@ -20,6 +20,7 @@ import { Favorite } from '@mui/icons-material'
 import KeyboardDoubleArrowRightIcon from '@mui/icons-material/KeyboardDoubleArrowRight'
 import { campaignListPictureUrl } from 'common/util/campaignImageUrls'
 import Image from 'next/image'
+import SuccessfullCampaignTag from './SuccessfullCampaignTag'
 
 const PREFIX = 'CampaignCard'
 
@@ -116,6 +117,7 @@ export default function CampaignCard({ campaign }: Props) {
           <div
             style={{ position: 'relative', width: '100%', minHeight: '100%', maxHeight: '100%' }}>
             <Image src={pictureUrl} layout="fill" objectFit="contain" />
+            {reached >= target ? <SuccessfullCampaignTag /> : ''}
           </div>
         </CardMedia>
         <CardContent className={classes.cardContent}>

src/components/campaigns/SuccessfullCampaignTag.tsx

@@ -0,0 +1,28 @@
+import React from 'react'
+
+import Image from 'next/image'
+
+import { Grid } from '@mui/material'
+
+export default function SuccessfullCampaignTag() {
+  const successfullCampaignTagSource = '/img/successfull-campaign-tag.png'
+
+  return (
+    <Grid
+      sx={{
+        position: 'absolute',
+        right: 15,
+        bottom: 10,
+        zIndex: 20,
+        transform: 'rotate(335deg)',
+        opacity: 0.8,
+      }}>
+      <Image
+        alt="Successfull campaign tag"
+        src={successfullCampaignTagSource}
+        width="200px"
+        height="70px"
+      />
+    </Grid>
+  )
+}