improve activity created modal

unstructuredstudio · Feb 26, 2024 · 662576a · 662576a
1 parent 728bf99
commit 662576a
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 8 deletions.
diff --git a/zubhub_frontend/zubhub/public/locales/en/translation.json b/zubhub_frontend/zubhub/public/locales/en/translation.json
@@ -1120,6 +1120,10 @@
           "proceed": "Proceed",
           "success": "activity Created successfully",
           "forbidden": "You must be staff monitor ao educator to be able to create a new activity "
+        },
+        "modal": {
+          "primary": "Congratulations your activity has been successfully created!",
+          "secondary": "Once your activity is published, you can share it with the world!"
         }
       },
       "edit": {

diff --git a/zubhub_frontend/zubhub/src/views/activity_details/ActivityDetails.styles.js b/zubhub_frontend/zubhub/src/views/activity_details/ActivityDetails.styles.js
@@ -79,5 +79,17 @@ export const activityDefailsStyles = theme => ({
         flexDirection: 'column',
         gap: 32,
         marginTop: 20,
+    },
+    dialogCloseButton: {
+        display: 'flex',
+        justifyContent: 'end',
+        marginTop: '-1em'
+    },
+    dialogTitle: {
+        fontWeight: 600,
+        fontSize: '1em'
+    },
+    dialogText: {
+        fontSize: '1.1em'
     }
 })
diff --git a/zubhub_frontend/zubhub/src/views/activity_details/ActivityDetailsV2.jsx b/zubhub_frontend/zubhub/src/views/activity_details/ActivityDetailsV2.jsx
@@ -282,24 +282,21 @@ export default function ActivityDetailsV2(props) {
       </div>
 
       <Modal.WithIcon icon={<FiShare size={30} />} maxWidth="xs" open={open} onClose={toggleDialog}>
-        <div style={{ display: 'flex', justifyContent: 'end' }}>
+        <div className={classes.dialogCloseButton}>
           <IconButton onClick={toggleDialog}>
             <CloseOutlined />
           </IconButton>
         </div>
 
         <DialogTitle>
-          <Typography align="center" className={clsx(commonClasses.title2, classes.dialogTitle)}>
-            Congratulations your Activity has been successfully created!
+          <Typography align="center" className={classes.dialogTitle}>
+            {t('activityDetails.activity.create.modal.primary')}
           </Typography>
         </DialogTitle>
         <DialogContent>
-          <Typography align="center">
-            Share your activity with the world. Post it on the following platforms:
+          <Typography align="center" className={classes.dialogText}>
+            {t('activityDetails.activity.create.modal.secondary')}
           </Typography>
-          <div className={clsx(commonClasses.displayFlex, commonClasses.justifyCenter)} style={{ margin: '20px 0' }}>
-            <SocialButtons containerStyle={{ gap: 50 }} withColor link facebook whatsapp />
-          </div>
         </DialogContent>
       </Modal.WithIcon>
     </div>