Skip to content

Commit

Permalink
Corrections from PR Review (100%)
Browse files Browse the repository at this point in the history
  • Loading branch information
@YellouMeli
YellouMeli committed Aug 3, 2024
1 parent 537241f commit 8aacd26
Show file tree
Hide file tree
Showing 6 changed files with 69 additions and 76 deletions.
2 changes: 1 addition & 1 deletion src/components/Header/DesktopHeader.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ const DesktopHeader: FC = () => {
<StyledNavLink to="/team" style={{ textDecoration: 'none', color: 'white' }}>
<Typography variant="overline">{t('header.team')}</Typography>
</StyledNavLink>
<StyledNavLink to="/job" style={{ textDecoration: 'none', color: 'white' }}>
<StyledNavLink to="/jobs" style={{ textDecoration: 'none', color: 'white' }}>
<Typography variant="overline">{t('header.job')}</Typography>
</StyledNavLink>
<StyledNavLink to="/codeofconduct" style={{ textDecoration: 'none', color: 'white' }}>
Expand Down
132 changes: 60 additions & 72 deletions src/components/JobCard/JobCard.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
import { FC } from 'react'
import { Grid, Avatar, Typography, Button, Chip, Card, CardContent, Stack } from '@mui/material'
import { Stack, Grid, Avatar, Typography, Button, Chip, Card, CardContent } from '@mui/material'
import BusinessIcon from '@mui/icons-material/Business'
import LocationOnIcon from '@mui/icons-material/LocationOn'
import AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet'
import AccessTimeIcon from '@mui/icons-material/AccessTime'
import JobData from '@/types/JobListing'



interface JobCardProps {
job: JobData
}
Expand All @@ -16,82 +17,69 @@ const JobCard: FC<JobCardProps> = ({ job }) => {
window.open(job.jobPostingUrl, '_blank', 'noopener,noreferrer')
}

return (
<Stack spacing={1} alignItems="center">
<Card sx={{ bgcolor: '#512DA8', color: 'white', width: '100%' }}>
<CardContent>
<Grid container spacing={1} alignItems="center">
<Grid item xs={12} sm={12} md={2} display="flex" justifyContent="center">
<Avatar
sx={{ bgcolor: 'grey', width: 80, height: 80, borderRadius: 2 }}
alt={`${job.company} logo`}
src={job.logoUrl}
/>
return <Card sx={{ bgcolor: '#512da8', color: 'white', width: '100%' }}>
<CardContent>
<Grid container spacing={1} alignItems="center">
<Grid item xs={12} sm={12} md={2} display="flex" justifyContent="center">
<Avatar
sx={{ bgcolor: 'grey', width: 90, height: 90, borderRadius: 2 }}
alt={`${job.company} logo`}
src={job.logoUrl}
/>
</Grid>
<Grid item xs={12} sm={12} md={8} mt={2}>
<Typography variant="h5" mb={2} component="div" sx={{ textAlign: 'left' }}>
{job.title}
</Typography>
<Grid container spacing={2}>
<Grid item xs={12} sm={4} sx={{ display: 'flex', justifyContent: { xs: 'flex-start', sm: 'center' }, alignItems: 'center' }}>
<BusinessIcon />
<Typography fontSize="body2" sx={{ ml: 1 }}>{job.company}</Typography>
</Grid>
<Grid item xs={12} sm={12} md={8}>
<Typography variant="h6" component="div" sx={{ textAlign: 'left' }}>
{job.title}
</Typography>
<Grid container spacing={2}>
<Grid item xs={12} sm={4} sx={{ display: 'flex', justifyContent: { xs: 'flex-start', sm: 'center' }, alignItems: 'center' }}>
<BusinessIcon fontSize="small" />
<Typography fontSize="medium" sx={{ ml: 1 }}>{job.company}</Typography>
</Grid>
<Grid item xs={12} sm={4} sx={{ display: 'flex', justifyContent: { xs: 'flex-start', sm: 'center' }, alignItems: 'center' }}>
<LocationOnIcon fontSize="small" />
<Typography fontSize="medium" sx={{ ml: 1 }}>{job.location}</Typography>
</Grid>
<Grid item xs={12} sm={4} sx={{ display: 'flex', justifyContent: { xs: 'flex-start', sm: 'center' }, alignItems: 'center' }}>
<AccountBalanceWalletIcon fontSize="small" />
<Typography fontSize="medium" sx={{ ml: 1 }}>{job.salary}</Typography>
</Grid>
</Grid>
<Grid container spacing={1} mt={0.5} justifyContent="flex-start">
{job.tags.map((tag, index) => (
<Grid item key={index}>
<Chip label={tag} sx={{ bgcolor: '#6A1B9A', color: 'white', height: 32, borderRadius: '8px' }} />
</Grid>
))}
</Grid>
<Grid item xs={12} sm={4} sx={{ display: 'flex', justifyContent: { xs: 'flex-start', sm: 'center' }, alignItems: 'center' }}>
<LocationOnIcon />
<Typography fontSize="body2" sx={{ ml: 1 }}>{job.location}</Typography>
</Grid>
<Grid item xs={12} sm={4} sx={{ display: 'flex', justifyContent: { xs: 'flex-start', sm: 'center' }, alignItems: 'center' }}>
<AccountBalanceWalletIcon />
<Typography fontSize="body2" sx={{ ml: 1 }}>{job.salary}</Typography>
</Grid>
<Grid item xs={12} sm={12} md={2} sx={{ order: { xs: -1, sm: -1, md:0 }, alignSelf: { sm: 'flex-start' } }} display="flex">
<Grid container spacing={1} justifyContent="right">
<Grid item>
<AccessTimeIcon fontSize="small" />
</Grid>
<Grid item>
<Typography fontSize="medium">
{ job.publicationDate }
</Typography>
</Grid>
</Grid>
</Grid>
<Stack direction='row' spacing={1} mt={2} justifyContent="flex-start">
{job.tags.map((tag, index) => (
<Chip key={index} label={tag} sx={{ bgcolor: '#6A1B9A', color: 'white', height: 32, borderRadius: '8px' }} />
))}
</Stack>
</Grid>
<Grid item xs={12} sm={12} md={2} sx={{ order: { xs: -1, sm: -1, md:0 }, alignSelf: { sm: 'flex-start' } }} display="flex">
<Grid container spacing={1} justifyContent="right">
<Grid item>
<AccessTimeIcon />
</Grid>
<Grid container spacing={1} justifyContent="right">
<Grid item>
<Button
variant="contained"
color="secondary"
onClick={handleReadMoreClick}
sx={{
mt: 1,
bgcolor: '#6A1B9A',
color: 'white',
fontSize: 'small',
padding: '4px 8px',
'&:hover': {
bgcolor: '#512DA8'
}
}}
>
Read More
</Button>
</Grid>
<Grid item>
<Typography fontSize="body2">
{ job.publicationDate }
</Typography>
</Grid>
</Grid>
</CardContent>
</Card>
</Stack>
)
</Grid>
<Grid container spacing={1} justifyContent="right">
<Grid item>
<Button
variant="contained"
onClick={handleReadMoreClick}
sx={{
mt: 1,
padding: '4px 8px',
}}
>
Read More
</Button>
</Grid>
</Grid>
</Grid>
</CardContent>
</Card>
}

export default JobCard
3 changes: 3 additions & 0 deletions src/components/SideDrawer/DrawerContents.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,9 @@ const DrawerContents: FC<DrawerContentsProps> = ({ closeDrawer }) => {
<ListItem>
<StyledNavLink to='/team'>{t('sidebar.team')}</StyledNavLink>
</ListItem>
<ListItem>
<StyledNavLink to='/job'>{t('sidebar.job')}</StyledNavLink>
</ListItem>
<ListItem>
<StyledNavLink to='/codeofconduct'>{t('sidebar.codeOfConduct')}</StyledNavLink>
</ListItem>
Expand Down
3 changes: 2 additions & 1 deletion src/i18n/en/translation.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@
},
"sidebar": {
"codeOfConduct": "Code of Conduct",
"team": "Team"
"team": "Team",
"job": "Job Board"
},
"team": {
"title": "✨ Leadership Team ✨"
Expand Down
3 changes: 2 additions & 1 deletion src/i18n/ja/translation.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@
},
"sidebar": {
"codeOfConduct": "Code of Conduct",
"team": "チーム"
"team": "チーム",
"job": "求人掲示板"
},
"team": {
"title": "✨ リーダーシップ・チーム ✨"
Expand Down
2 changes: 1 addition & 1 deletion src/routes/JobBoard/jobs.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
[
{
"title": "Software Engineer",
"company": "Amazon Web Services (AWS)",
"company": "Amazon Web Services",
"logoUrl": "/",
"location": "Tokyo, Japan",
"jobPostingUrl": "http://example.com",
Expand Down

0 comments on commit 8aacd26

Please sign in to comment.