Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add events locations on contact page #9

Merged
merged 2 commits into from
Oct 11, 2024
Merged

add events locations on contact page #9

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c67f2f2
add events locations on contact page
Oct 9, 2024
f2d164f
changed some components style
andrptrc Oct 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added public/PDF/ehl.pdf
View file
Open in desktop
Binary file not shown.
Binary file added public/PDF/pathe.pdf
View file
Open in desktop
Binary file not shown.
Binary file added public/ehl-contact.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
20 changes: 19 additions & 1 deletion public/locales/en/translation.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -168,6 +168,25 @@
},
"contact": {
"title": "Contact",
"venue-title": "Event locations",
"venue-cfa": "Download PDF",
"venue-google-maps": "Open Google Maps",
"venue": [
{
"title": "Balexert Pathé, Vernier",
"date": "Date : 27 & 28 January 2025",
"adress": "Adress : Av. Louis-Casaï 27, 1209 Vernier",
"googleMapsLink": "https://maps.app.goo.gl/BDuPiKqwpNU99sah9"

},
{
"title": "EHL Hospitality Business School, Lausanne",
"date": "Date : 29 January 2025",
"adress": "Adress : Route de Berne 301, 1000 Lausanne 25",
"googleMapsLink": "https://maps.app.goo.gl/5ZtL6i7KNGeeAYdA8"

}
],
"contact_title": "Organisation Committee",
"members": [
{
Expand Down Expand Up @@ -271,7 +290,6 @@
"workshops": {
"title-27": "Workshops Days – January 27",
"venue-27": "Pathé Balexert",
"adress-27": "Av. Louis-Casaï 27, 1209 Vernier",
"description-title": "Description",
"time-title": "Time",
"equipement-title": "Equipement",
Expand Down
19 changes: 18 additions & 1 deletion public/locales/fr/translation.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -168,6 +168,24 @@
},
"contact": {
"title": "Contact",
"venue-title": "Lieux des événements",
"venue-cfa": "Télécharger PDF",
"venue-google-maps": "Ouvrir Google Maps",
"venue": [
{
"title": "Balexert Pathé, Vernier",
"date": "Date : 27 & 28 Janvier 2025",
"adress": "Adresse : Av. Louis-Casaï 27, 1209 Vernier",
"googleMapsLink": "https://maps.app.goo.gl/BDuPiKqwpNU99sah9"
},
{
"title": "EHL Hospitality Business School, Lausanne",
"date": "Date : 29 Janvier 2025",
"adress": "Adresse : Route de Berne 301, 1000 Lausanne 25",
"googleMapsLink": "https://maps.app.goo.gl/5ZtL6i7KNGeeAYdA8"

}
],
"contact_title": "Comité d'organisation",
"members": [
{
Expand Down Expand Up @@ -271,7 +289,6 @@
"workshops": {
"title-27": "Journée des Workshops – 27 Janvier",
"venue-27": "Pathé Balexert",
"adress-27": "Av. Louis-Casaï 27, 1209 Vernier",
"description-title": "Description",
"time-title": "Temps",
"equipement-title": "Equipements",
Expand Down
125 changes: 100 additions & 25 deletions src/pages/Contact/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,21 @@ import {
Groups3Rounded,
InterestsRounded,
PaymentsRounded,
PersonRounded, ViewTimelineRounded
PersonRounded,
ViewTimelineRounded
} from '@mui/icons-material';
import { List, Paper, Collapse, ListItemIcon, ListItemText, ListItemButton } from '@mui/material';
import {
List,
Paper,
Collapse,
ListItemIcon,
ListItemText,
ListItemButton,
Card,
CardMedia,
CardContent,
Button
} from '@mui/material';
import Box from '@mui/material/Box';
import Container from '@mui/material/Container';
import Typography from '@mui/material/Typography';
Expand All @@ -28,6 +40,13 @@ const Contact: React.FC = () => {
members: string[]
}[] = t(`years.${selectedYearIndex(year)}.contact.members`, {returnObjects: true});

const events: {
title: string,
date: string,
adress: string,
googleMapsLink: string // Ajout du lien vers Google Maps pour chaque événement
}[] = t(`years.${selectedYearIndex(year)}.contact.venue`, {returnObjects: true});

const icons: { [key: string]: any } = {
GavelRounded: GavelRounded,
PaymentsRounded: PaymentsRounded,
Expand Down Expand Up @@ -56,7 +75,8 @@ const Contact: React.FC = () => {
textShadow: '2px 2px 4px rgba(0,0,0,0.6)'
}}
>
<Typography variant="h2" sx={{ color: '#fff', fontWeight: 'bold', textShadow: '2px 2px 4px rgba(0,0,0,0.6)' }}>
<Typography variant="h2"
sx={{color: '#fff', fontWeight: 'bold', textShadow: '2px 2px 4px rgba(0,0,0,0.6)'}}>
{t(`years.${selectedYearIndex(year)}.contact.title`)}
</Typography>
{/* HES-SO Logo in Bottom Right Corner */}
Expand All @@ -68,43 +88,99 @@ const Contact: React.FC = () => {
position: 'absolute',
bottom: '10px',
right: '10px',
width: '120px', // Adjust size as needed
opacity: 0.7, // Transparent effect
width: '120px',
opacity: 0.7,
}}
/>
</Box>

<Paper elevation={2} sx={{ p: 4, borderRadius: 3, boxShadow: 2 }}>
{/* Events Locations */}
<Paper elevation={2} sx={{p: 4, borderRadius: 3, boxShadow: 2}}>
<Typography variant="h4" sx={{fontWeight: 'bold', mb: 4}}>
{t(`years.${selectedYearIndex(year)}.contact.venue-title`)}
</Typography>

<Box sx={{display: 'flex', flexDirection: 'row', gap: 4, justifyContent: 'center'}}>
{/* Loop through events */}
{events.map((event, index) => (
<Card key={index} sx={{
width: '100%',
display: 'flex',
flexDirection: 'column',
justifyContent: 'space-between',
border: '1px solid darkgrey'
}} elevation={0}>
<CardMedia
component="img"
height="200"
image={index === 0 ? "/pathe-image.jpg" : "/ehl-contact.jpg"} // Update image path based on index
alt={event.title}
/>
<CardContent sx={{
flexGrow: 1,
display: 'flex',
flexDirection: 'column',
justifyContent: 'space-between'
}}>
<Box sx={{mb: 2}}>
<Typography gutterBottom variant="h5" component="div">
{event.title}
</Typography>
<Typography variant="body2" color="text.secondary">
{event.date}
<br/>
{event.adress}
</Typography>
</Box>
<Box sx={{display: 'flex', justifyContent: 'space-between', mt: 'auto'}}>
<Button variant="contained" color="primary"
href={`/PDF/${index === 0 ? 'pathe.pdf' : 'ehl.pdf'}`} target="_blank"
disableElevation>
{t(`years.${selectedYearIndex(year)}.contact.venue-cfa`)}
</Button>
<Button
variant="outlined"
color="secondary"
href={event.googleMapsLink} // Lien vers Google Maps pour le lieu
target="_blank"
>
{t(`years.${selectedYearIndex(year)}.contact.venue-google-maps`)}
</Button>
</Box>
</CardContent>
</Card>
))}
</Box>
</Paper>

{/* Contact Committee */}
<Paper elevation={2} sx={{p: 4, borderRadius: 3, boxShadow: 2, mt: 5}}>
<Box sx={{display: 'flex', flexDirection: 'column', p: 2}}>
<Typography variant={"h4"}
sx={{fontWeight: 'bold'}}>{t(`years.${selectedYearIndex(year)}.contact.contact_title`)}</Typography>
<Typography variant={"h4"} sx={{fontWeight: 'bold'}}>
{t(`years.${selectedYearIndex(year)}.contact.contact_title`)}
</Typography>
</Box>

<Box sx={{display: 'flex', flexDirection: 'column', textAlign: 'justify'}}>
<List component={"nav"}>
{members.map((item: { role: string, icon: string, members: string[] }) => (
<Box pb={2} key={item.role}>
{members.map((item, index) => (
<Box pb={2} key={index}>
<ListItemButton>
<ListItemIcon>
{React.createElement(icons[item.icon], {color: "primary"})}
</ListItemIcon>
<ListItemText
children={<Typography variant={"h5"}>{item.role}</Typography>}/>
<ListItemText children={<Typography variant={"h5"}>{item.role}</Typography>}/>
</ListItemButton>
<Collapse in={true} timeout="auto" unmountOnExit sx={{pl: 4}}>
<List component={"div"} disablePadding>
{item.members.map((member: string, index: number) => {
return (
<ListItemButton key={index} sx={{pl: 2}}>
<ListItemIcon>
<PersonRounded color={"secondary"}/>
</ListItemIcon>
<ListItemText
primary={member}/>
</ListItemButton>
);
})}
{item.members.map((member, idx) => (
<ListItemButton key={idx} sx={{pl: 2}}>
<ListItemIcon>
<PersonRounded color={"secondary"}/>
</ListItemIcon>
<ListItemText primary={member}/>
</ListItemButton>
))}
</List>
</Collapse>
</Box>
Expand All @@ -115,7 +191,6 @@ const Contact: React.FC = () => {
<Footer></Footer>
</Container>
);
}

};

export default Contact;
5 changes: 3 additions & 2 deletions src/pages/Workshops/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,8 +60,9 @@ const Workshops: React.FC = () => {
<Typography variant={"h2"} sx={{ fontWeight: 'bold' }}>
{t(`years.${selectedYearIndex(year)}.workshops.title-27`) || "Workshop Title"}
</Typography>
<h3>{t(`years.${selectedYearIndex(year)}.workshops.venue-27`) || "Venue"}</h3>
<h6>{t(`years.${selectedYearIndex(year)}.workshops.adress-27`) || "Address"}</h6>
<a className={"venue"} href="/contact" >
<h3>{t(`years.${selectedYearIndex(year)}.workshops.venue-27`) || "Venue"}</h3>
</a>
</Box>
{/* HES-SO Logo in Bottom Right Corner */}
<Box
Expand Down
9 changes: 9 additions & 0 deletions src/pages/Workshops/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,3 +12,12 @@
text-align: justify;
}

.venue{
color: white;
text-decoration: none;
}

.venue:hover{
color: #d41367;
text-decoration: none;
}
Loading