diff --git a/components/Header.tsx b/components/Header.tsx index 01f66e5..68ed2fb 100755 --- a/components/Header.tsx +++ b/components/Header.tsx @@ -35,17 +35,28 @@ const Header = ({darkHeader = false} : {darkHeader? :boolean}) => { About -
router.push('/People')}> - People +
router.push('/People/People')}> +
+ People +
+
+
-
router.push('/Activities/Activities')}> +
router.push('/Activities/Activities')}>
Activities
    +
  • ) => handleNavigate(e, '/Activities/Activities')}>Activities
  • ) => handleNavigate(e, '/Activities/Events')}>Events
  • {/*
  • router.push('/Activities/Masterclasses')}>Masterclasses
  • */}
  • ) => handleNavigate(e, '/Activities/StudyGroups')}>Study Groups
  • diff --git a/pages/AboutUs.tsx b/pages/AboutUs.tsx index 3681646..749e944 100755 --- a/pages/AboutUs.tsx +++ b/pages/AboutUs.tsx @@ -26,10 +26,11 @@ const sections: SectionAboutUsElement[] = [ { title: "Mu Nu Chapter - Today", description: "Today, the Mu Nu chapter of IEEE-HKN at the Polytechnic University of Turin is a vibrant reality carried forward by an ever-growing group of students passionate about computer science, electronics, and much more. For us, HKN represents a new way to acquire skills and knowledge while at the same time nurturing our passions in an inspiring and stimulating environment.", - year: "2023", + year: new Date().getFullYear().toString(), }, ] + export default function AboutUs() { const sectionsRef = useRef(null); const [svgWidth, setSvgWidth] = useState(0); diff --git a/pages/People/Alumni.tsx b/pages/People/Alumni.tsx new file mode 100644 index 0000000..d99704b --- /dev/null +++ b/pages/People/Alumni.tsx @@ -0,0 +1,248 @@ +import Layout from "../../components/Layout"; +import styles from '@/styles/People/Alumni.module.scss' +import RoundButton from "@/components/molecules/RoundButton"; +import { useRouter } from "next/router"; +import {MouseEventHandler, useEffect, useState} from "react"; +import ArrowButton from "@/components/molecules/ArrowButton"; + +enum BadgeType { + Head, + Board, + Inducted +} + +// Images should be in a 4:5 ratio +const AlumniData : AlumnoProps[] = [ + { + name: "Gustavo Nicoletti", + imageSrc: "/People/Board/Gustavo Nicoletti Rosa.png", + linkedIn: "https://www.linkedin.com/in/gustavo-nicoletti-rosa/", + badges: [ + { + type: BadgeType.Head, + year: 2021, + role: "Head of Communications" + }, + { + type: BadgeType.Board, + year: 2020, + role: "Vice President" + }, + { + type: BadgeType.Inducted, + year: 2019, + role: "Member of Comms" + } + ] + }, + { + name: "Gustavo Nicoletti", + imageSrc: "/People/Board/Gustavo Nicoletti Rosa.png", + linkedIn: "https://www.linkedin.com/in/gustavo-nicoletti-rosa/", + badges: [ + { + type: BadgeType.Head, + year: 2021, + role: "Head of Communications" + }, + { + type: BadgeType.Board, + year: 2020, + role: "Vice President" + }, + { + type: BadgeType.Inducted, + year: 2019, + role: "Member of Comms" + } + ] + }, + { + name: "Gustavo Nicoletti", + imageSrc: "/People/Board/Gustavo Nicoletti Rosa.png", + linkedIn: "https://www.linkedin.com/in/gustavo-nicoletti-rosa/", + badges: [ + { + type: BadgeType.Head, + year: 2021, + role: "Head of Communications" + }, + { + type: BadgeType.Board, + year: 2020, + role: "Vice President" + }, + { + type: BadgeType.Inducted, + year: 2019, + role: "Member of Comms" + } + ] + }, + { + name: "Gustavo Nicoletti", + imageSrc: "/People/Board/Gustavo Nicoletti Rosa.png", + linkedIn: "https://www.linkedin.com/in/gustavo-nicoletti-rosa/", + badges: [ + { + type: BadgeType.Head, + year: 2021, + role: "Head of Communications" + }, + { + type: BadgeType.Board, + year: 2020, + role: "Vice President" + }, + { + type: BadgeType.Inducted, + year: 2019, + role: "Member of Comms" + } + ] + }, + { + name: "Gustavo Nicoletti", + imageSrc: "/People/Board/Gustavo Nicoletti Rosa.png", + linkedIn: "https://www.linkedin.com/in/gustavo-nicoletti-rosa/", + badges: [ + { + type: BadgeType.Head, + year: 2021, + role: "Head of Communications" + }, + { + type: BadgeType.Board, + year: 2020, + role: "Vice President" + }, + { + type: BadgeType.Inducted, + year: 2019, + role: "Member of Comms" + } + ] + }, + { + name: "Gustavo Nicoletti", + imageSrc: "/People/Board/Gustavo Nicoletti Rosa.png", + linkedIn: "https://www.linkedin.com/in/gustavo-nicoletti-rosa/", + badges: [ + { + type: BadgeType.Head, + year: 2021, + role: "Head of Communications" + }, + { + type: BadgeType.Board, + year: 2020, + role: "Vice President" + }, + { + type: BadgeType.Inducted, + year: 2019, + role: "Member of Comms" + } + ] + }, + { + name: "Gustavo Nicoletti", + imageSrc: "/People/Board/Gustavo Nicoletti Rosa.png", + linkedIn: "https://www.linkedin.com/in/gustavo-nicoletti-rosa/", + badges: [ + { + type: BadgeType.Head, + year: 2021, + role: "Head of Communications" + }, + { + type: BadgeType.Board, + year: 2020, + role: "Vice President" + }, + { + type: BadgeType.Inducted, + year: 2019, + role: "Member of Comms" + } + ] + }, + { + name: "Gustavo Nicoletti", + imageSrc: "/People/Board/Gustavo Nicoletti Rosa.png", + linkedIn: "https://www.linkedin.com/in/gustavo-nicoletti-rosa/", + badges: [ + { + type: BadgeType.Head, + year: 2021, + role: "Head of Communications" + }, + { + type: BadgeType.Board, + year: 2020, + role: "Vice President" + }, + { + type: BadgeType.Inducted, + year: 2019, + role: "Member of Comms" + } + ] + }, +]; + +export default function Alumni() { + const router = useRouter(); + + return ( + + +
    + Vision +
    + Alumni + ETA KAPPA MENTORING + Since 2017 we are dedicated to encouraging excellence in the IEEE-designated fields of interest, continuing to reinvent ourselves to meet the needs of our members and society overall +
    +
    + +
    + Directory + Alumni +
    + {AlumniData.map((al, index) => ( + + ))} +
    +
    + +
    + ) +} + +function Alumno({ alumno }: { + alumno: AlumnoProps, +}) { + return ( +
    {}}> +
    +
    + {alumno.name} +
    + {alumno.name} +
    + ); +} + +export interface AlumnoProps { + name: string, + imageSrc?: string, + linkedIn?: string, + badges?: Badge[], +} + +interface Badge { + type: BadgeType, + year: number, + role: string, +} diff --git a/pages/People.tsx b/pages/People/People.tsx similarity index 97% rename from pages/People.tsx rename to pages/People/People.tsx index ba9910d..1d96cd0 100755 --- a/pages/People.tsx +++ b/pages/People/People.tsx @@ -1,4 +1,4 @@ -import Layout from "../components/Layout"; +import Layout from "../../components/Layout"; import styles from '@/styles/People/People.module.scss' import RoundButton from "@/components/molecules/RoundButton"; import { useRouter } from "next/router"; diff --git a/styles/Activities/Activities.module.scss b/styles/Activities/Activities.module.scss index d18c2a4..1887265 100755 --- a/styles/Activities/Activities.module.scss +++ b/styles/Activities/Activities.module.scss @@ -294,6 +294,13 @@ text-transform: uppercase; background-color: #061E33; margin-top: 20px; + color: #F2F2F2; + } + + &__button:hover { + background: transparent; + border-color: #061E33; + color: #061E33; } } diff --git a/styles/Home/Home.module.css b/styles/Home/Home.module.css index 3b9a79d..4ba98f2 100755 --- a/styles/Home/Home.module.css +++ b/styles/Home/Home.module.css @@ -35,7 +35,8 @@ .vision, .origins, .project { font-weight: 400; font-size: 24px; - margin: 15px 0 35px 0; + margin: 0 0 35px 0; + padding-top: 30px; } .titleButtons,.visionButtons { diff --git a/styles/People/Alumni.module.scss b/styles/People/Alumni.module.scss new file mode 100644 index 0000000..fac8e9c --- /dev/null +++ b/styles/People/Alumni.module.scss @@ -0,0 +1,61 @@ +.descriptionContainer { + display: flex; + justify-content: space-between; + align-items: center; + flex-direction: row; + width: 85%; + max-width: 1450px; + margin-top: 50px; + overflow: hidden; + + &__image { + margin: 0 3vw; + object-fit: cover; + width: 45%; + height: 400px; + border-radius: 20px; + + @media (max-width: 800px) { + display: none; + } + } + + &__right { + display: flex; + margin: 0 1vw; + flex-direction: column; + + &__title { + font-weight: 600; + font-size: 63px; + line-height: 63px; + + @media (max-width: 550px) { + font-size: 50px; + line-height: 50px; + } + } + + &__subtitle { + font-weight: 500; + font-size: 23px; + + @media (max-width: 550px) { + font-size: 19px; + } + } + + &__text { + font-weight: 300; + font-size: 24px; + margin: 0 0 35px 0; + padding-top: 30px; + + @media (max-width: 550px) { + font-size: 17px; + padding-top: 10px; + } + } + + } +}