remove physical address from resume bio and style portfolio entries

theHandsomestNerd · Dec 6, 2023 · b116d80 · b116d80
1 parent 0d7a725
commit b116d80
Show file tree

Hide file tree

Showing 7 changed files with 46 additions and 32 deletions.
diff --git a/src/components/templates/mackenzies-mind/header/FullTextSearch.tsx b/src/components/templates/mackenzies-mind/header/FullTextSearch.tsx
@@ -47,6 +47,7 @@ export const useStyles = makeStyles((theme: Theme) => ({
 }))
 
 interface IProps {
+    searchText?:string
 }
 
 const FullTextSearch: FunctionComponent<IProps> = (props: IProps) => {

diff --git a/src/components/templates/my-digital-resume/resume-bio-section/ResumeBioSection.tsx b/src/components/templates/my-digital-resume/resume-bio-section/ResumeBioSection.tsx
@@ -54,12 +54,12 @@ const ResumeBioSection: FunctionComponent<IProps> = (props: IProps) => {
                     <Grid item xs={9}><Typography gutterBottom
                                                   variant='body1'>{props.homePage.businessContact?.email}</Typography></Grid>
                 </Grid>
-                <Grid container item xs={11} sm={12}>
-                    <Grid item xs={3}><Typography gutterBottom variant='body1'
-                                                  style={{textTransform: "uppercase"}}>MAIL</Typography></Grid>
-                    <Grid item xs={9}><Typography noWrap gutterBottom
-                                                  variant='body1'>{props.homePage.businessContact?.address}</Typography></Grid>
-                </Grid>
+                {/*<Grid container item xs={11} sm={12}>*/}
+                {/*    <Grid item xs={3}><Typography gutterBottom variant='body1'*/}
+                {/*                                  style={{textTransform: "uppercase"}}>MAIL</Typography></Grid>*/}
+                {/*    <Grid item xs={9}><Typography noWrap gutterBottom*/}
+                {/*                                  variant='body1'>{props.homePage.businessContact?.address}</Typography></Grid>*/}
+                {/*</Grid>*/}
                 <Grid container item xs={11} sm={12} justifyContent={'center'}>
                     <SocialMediaBlock
                         isCentered={true}

diff --git a/...omponents/templates/my-digital-resume/resume-education-section/ResumeEducationSection.tsx b/...omponents/templates/my-digital-resume/resume-education-section/ResumeEducationSection.tsx
@@ -62,11 +62,11 @@ const ResumeEducationSection: FunctionComponent<IProps> = (props: IProps) => {
                                         <Typography display='inline'
                                                     variant='body1'
                                         >{experience.dateStart?.toString().replaceAll('-', '.')}</Typography>
-                                        <Typography display='inline'
+                                        {experience.dateEnd?<Typography display='inline'
                                                     variant='body1'
                                                     style={{
                                                         margin: theme.spacing(0, 1)
-                                                    }}>—</Typography>
+                                                    }}>—</Typography>:<></>}
                                         <Typography display='inline'
                                                     variant='body1'
                                         >{experience.dateEnd?.toString().replaceAll('-', '.')}</Typography>

diff --git a/...components/templates/my-digital-resume/resume-experience-section/ResumeExperienceItem.tsx b/...components/templates/my-digital-resume/resume-experience-section/ResumeExperienceItem.tsx
@@ -17,13 +17,9 @@ experience: ResumeExperience
 }
 
 const ResumeExperienceItem: FunctionComponent<IProps> = (props:IProps) => {
-    const classes = useStyles()
 
     const theme = useTheme()
 
-    React.useEffect(()=>{
-    }, [])
-
     return (<Grid item container alignContent='flex-start'
                   role={'experiencedivider'}
                   // style={{
@@ -72,7 +68,7 @@ const ResumeExperienceItem: FunctionComponent<IProps> = (props:IProps) => {
               style={{overflowX: "scroll", paddingBottom: theme.spacing(1)}} wrap='nowrap'>
             {
                 props.experience.skillsUsed?.map((skill, index) => {
-                    console.log(skill)
+                    // console.log(skill)
                     return <Grid item key={index}><Chip role={'experienceskill'} size='small'
                                                         color='primary'
                                                         label={skill.title}/></Grid>

diff --git a/src/components/templates/my-digital-resume/resume-portfolio-section/PortfolioItemModal.tsx b/src/components/templates/my-digital-resume/resume-portfolio-section/PortfolioItemModal.tsx
@@ -6,9 +6,14 @@ import {Button, ButtonGroup, Chip, Grid, IconButton, Modal, Typography, useTheme
 import {Close} from "@mui/icons-material";
 import {urlFor} from "../../../block-content-ui/static-pages/cmsStaticPagesClient";
 import {ResumePortfolioItem} from "../../../BlockContentTypes";
+import {COLORS} from "../../../../theme/common/ColorPalette";
 
 export const useStyles = makeStyles((theme: Theme) => ({
-    root: {},
+    hover: {
+        "&:hover":{
+            backgroundColor: "whitesmoke"
+        }
+    }
 }))
 
 interface IProps {
@@ -19,12 +24,14 @@ interface IProps {
 
 const PortfolioItemModal: FunctionComponent<IProps> = (props: IProps) => {
     const theme = useTheme()
+    const classes = useStyles()
+
 
     const [isOpen, setIsOpen] = React.useState<boolean>(false)
 
     const setOpenWrapper = (theValue:boolean)=>{
         setIsOpen(theValue)
-        props.setIsOpen(theValue)
+        // props.setIsOpen(theValue)
     }
 
     React.useEffect(() => {
@@ -33,27 +40,31 @@ const PortfolioItemModal: FunctionComponent<IProps> = (props: IProps) => {
         // }
     }, [props.isOpen])
 
-    return (<Modal open={isOpen} onClick={() => setIsOpen(false)}>
+    return (<Modal open={isOpen} onClick={() => setIsOpen(false)} sx={{paddingBottom: 4, overflow:"scroll"}}>
         <Grid container item justifyContent='center' alignContent='center' alignItems='center'
-              style={{width: "100vw", height: "100vh", position: "relative"}}>
+              style={{ position: "relative"}}>
+
             <IconButton
-                color='secondary'
-                style={{position: "absolute", top: 0, right: 0}}
+                className={classes.hover}
+                style={{position: "absolute", top: 0, right: 0,
+                    width: "64px",
+                    height: "64px",
+                    backgroundColor: "white"}}
                 onClick={() => setIsOpen(false)}
                 size="large"><Close fontSize={'large'}/></IconButton>
             <Grid container sm={8} item style={{
                 backgroundColor: "white",
                 padding: theme.spacing(4),
-                maxHeight: "800px",
-                overflowY: "scroll",
+                minHeight: "600px",
+                // overflowY: "scroll",
                 maxWidth: "100%"
             }} spacing={2}>
                 <Grid item container><Typography variant='h3'>{props.currentItem?.detailTitle}</Typography>
                 </Grid>
                 <Grid item container><Typography
                     variant='body1'>{props.currentItem?.detailDescription}</Typography></Grid>
                 <Grid item container spacing={1}>
-                    {props.currentItem?.skillsHighlighted?.map((skill) => (<Grid item>
+                    {props.currentItem?.skillsHighlighted?.map((skill, index) => (<Grid item key={index}>
                         <Chip color='primary' label={skill.title}/>
                     </Grid>))}
                 </Grid>

diff --git a/src/components/templates/my-digital-resume/resume-portfolio-section/ResumePortfolioEntry.tsx b/src/components/templates/my-digital-resume/resume-portfolio-section/ResumePortfolioEntry.tsx
@@ -2,11 +2,12 @@ import React, {FunctionComponent} from 'react'
 
 import makeStyles from "@mui/styles/makeStyles";
 import { Theme} from "@mui/material/styles";
-import {Button, Grid, Typography, useTheme} from "@mui/material";
+import {Button, Card, Grid, Typography, useTheme} from "@mui/material";
 import {urlFor} from "../../../block-content-ui/static-pages/cmsStaticPagesClient";
 import dateUtils from "../../../../utils/dateUtils";
 import {ResumePortfolioItem} from "../../../BlockContentTypes";
 import PortfolioItemModal from "./PortfolioItemModal";
+import {COLORS} from "../../../../theme/common/ColorPalette";
 
 export const useStyles = makeStyles((theme: Theme) => ({
     root: {
@@ -30,38 +31,43 @@ const ResumePortfolioEntry: FunctionComponent<IProps> = (props:IProps) => {
                   // style={{backgroundColor: index2 % 2 === 1 ? "whitesmoke" : "white"}}
                   container item xs={12} sm={6} lg={4} xl={4} alignContent='flex-start'
                   justifyContent='center'>
-        <Button fullWidth onClick={(e) => {
+        <Card elevation={0} sx={{width:"100%",border: `1px solid ${COLORS.GRAY}`}}>
+            <Button fullWidth sx={{padding:0}} onClick={(e) => {
             setCurrentItem(props.portfolioItem)
             setIsOpen(true)
         }}>
-            <Grid item container>
-                <Grid container item spacing={2} justifyContent='center'>
-                    <Grid item xs={11} sm={11} container justifyContent='center'
+            <Grid item container justifyContent='center' alignContent={'space-between'} direction='column'>
+                <Grid container item justifyContent='center' xs={2}>
+                    <Grid item xs={12}
                           style={{
                               backgroundImage: `url(${urlFor(props.portfolioItem?.coverImage ?? "").url() ?? ""})`,
                               backgroundSize: "cover",
                               backgroundPosition: "top center",
                               backgroundRepeat: "no-repeat",
                               width: "100%",
-                              minHeight: "200px"
+                              minHeight: "200px",
+
                           }}
                     >
                     </Grid>
                 </Grid>
-                <Grid container item justifyContent='center'
+                <Grid container item alignContent='center' alignItems='center' xs={10}>
+                    <Grid container item justifyContent='center'
                       style={{marginTop: theme.spacing(2)}}>
                     <Typography display='inline'
                                 variant='body1'
+                                color={'textPrimary'}
                     >{dateUtils.MonthYear(props.portfolioItem?.inceptionDate)}</Typography>
                 </Grid>
                 <Grid container item justifyContent='center' alignContent={'center'}>
                     <Typography style={{minHeight: "60px"}}
                                 variant='body2'>{props.portfolioItem?.title}</Typography>
                 </Grid>
+                </Grid>
             </Grid>
         </Button>
         <PortfolioItemModal currentItem={currentItem} isOpen={isOpen} setIsOpen={(val)=>{setIsOpen(val)}}/>
-</Grid>)
+    </Card></Grid>)
 }
 
 export default ResumePortfolioEntry
diff --git a/...omponents/templates/my-digital-resume/resume-portfolio-section/ResumePortfolioSection.tsx b/...omponents/templates/my-digital-resume/resume-portfolio-section/ResumePortfolioSection.tsx
@@ -48,10 +48,10 @@ const ResumePortfolioSection: FunctionComponent<IProps> = (props: IProps) => {
                     <Grid item container>
                         <Typography variant='body1'>{props.sectionData.introduction}</Typography></Grid>
                 </Grid>
-                <Grid item container justifyContent={'center'} xs={11} justifySelf={'center'}>
+                <Grid item container justifyContent={'center'} xs={11} justifySelf={'center'} spacing={1}>
                     {
                         props.sectionData.portfolioEntries?.map((portfolioItem: ResumePortfolioItem, index2: number) => {
-                            return <ResumePortfolioEntry portfolioItem={portfolioItem} />
+                            return <ResumePortfolioEntry portfolioItem={portfolioItem} key={index2}/>
                         })
                     }
                 </Grid>