refactor: Clean up code formatting and improve layout in UseWorkshops…

…Card and Institute components
DHRI-Curriculum · Nov 9, 2024 · 86ad653 · 86ad653
1 parent d5ae795
commit 86ad653
Show file tree

Hide file tree

Showing 3 changed files with 106 additions and 89 deletions.
diff --git a/components/Hooks/UseWorkshopsCard.js b/components/Hooks/UseWorkshopsCard.js
@@ -74,44 +74,40 @@ export default function UseWorkshopCard({ workshop, gitUser, gitRepo, instUser,
         }
         else {
             // setSrc("/images/img" + randomNumberBetween1and7 + ".jpg")
-            setSrc( process.env.NEXT_PUBLIC_ASSET_PREFIX 
+            setSrc(process.env.NEXT_PUBLIC_ASSET_PREFIX
                 + "/images/img" + randomNumberBetween1and7 + ".jpg")
         }
     }, [coverimage])
 
     const workshopLink = './dynamic?user=' + gitUser + '&repo=' + gitRepo + '&file=' + workshop.name.split('.')[0] + '&instUser=' + instUser + '&instRepo=' + instRepo;
 
-    if(parsedWorkshop?.data?.published === false){
+    if (parsedWorkshop?.data?.published === false) {
         console.log('not published', parsedWorkshop.data.title)
         return null;
     }
     return (
         <>
             {parsedWorkshop && parsedWorkshop.data.title && parsedWorkshop.data.description && (parsedWorkshop.data.published === 'true' || !parsedWorkshop.data.published) &&
-                <div
-                style={{
-                    maxWidth: '100vw',
-                }}
-                >
-                    <Card 
-                                    style={{
-                                        maxWidth: '100vw',
-                                    }}
-                    className='workshop-card'>
-                        <CardActionArea 
+                <>
+                    <Card
                         style={{
-                            height: '450px',
                             maxWidth: '100vw',
                         }}
-                        href={workshopLink}>
+                        className='workshop-card'>
+                        <CardActionArea
+                            style={{
+                                height: '450px',
+                                maxWidth: '100vw',
+                            }}
+                            href={workshopLink}>
                             <div
-                            className='stylized-image-container'>
-                            <CardMedia
-                                component="img"
-                                height="240"
-                                image={src}
-                                alt={parsedWorkshop.data['cover title'] || parsedWorkshop.data.title}
-                            />
+                                className='stylized-image-container'>
+                                <CardMedia
+                                    component="img"
+                                    height="240"
+                                    image={src}
+                                    alt={parsedWorkshop.data['cover title'] || parsedWorkshop.data.title}
+                                />
                             </div>
                             <CardContent
                                 style={{
@@ -121,12 +117,12 @@ export default function UseWorkshopCard({ workshop, gitUser, gitRepo, instUser,
                             ><p className='centered'>{parsedWorkshop.data['cover title'] || parsedWorkshop.data.title}</p>
                                 <h3>{parsedWorkshop.data.title}</h3>
                                 <p
-                                className='description'
+                                    className='description'
                                 >{parsedWorkshop?.data?.description?.length > 200 ? parsedWorkshop.data.description.substring(0, 200) + '...' : parsedWorkshop.data.description}</p>
                             </CardContent>
                         </CardActionArea>
                     </Card>
-                </div>
+                </>
             }
         </>
     )

diff --git a/pages/inst/index.js b/pages/inst/index.js
@@ -221,11 +221,11 @@ export default function Institute(props) {
             <div className='inst-description'>
                 {parsedYAML && <p>{parsedYAML.description}</p>}
                 {parsedYAML && (parsedYAML.registerlink || parsedYAML.registerLink) &&
-                    <p><Button
+                    <Button
                         className='button button-bark'
                         href={parsedYAML.registerlink || parsedYAML.registerLink}
                     >{parsedYAML && (parsedYAML.registertext || parsedYAML.registerText) ? (parsedYAML.registertext || parsedYAML.registerText) : 'Register'}
-                    </Button></p>
+                    </Button>
                 }
             </div>
             {parsedYAML && parsedYAML.DHRIFTfrontpage === false || parsedYAML && !parsedYAML.DHRIFTfrontpage ? aboutAccordion : null}
@@ -258,8 +258,6 @@ export default function Institute(props) {
         <Fade in={parsedYAML && parsedYAML.event || parsedYAML ? true : false}>
             <Container
                 disableGutters={true}
-
-
                 sx={{
                     display: 'flex',
                     minWidth: '100%',