diff --git a/frontend/public/data/socialInfos.ts b/frontend/public/data/socialInfos.ts new file mode 100644 index 0000000..8614619 --- /dev/null +++ b/frontend/public/data/socialInfos.ts @@ -0,0 +1,43 @@ +export type socialInfo = { + href: string; + src: string; + alt: string; +}; + +export const socialLinks: socialInfo[] = [ + { + href: 'https://bit.ly/CSESocDiscord', + src: '/assets/discord_logo.svg', + alt: 'Discord' + }, + { + href: 'https://www.facebook.com/csesoc/', + src: '/assets/fb_logo.svg', + alt: 'Facebook' + }, + { + href: 'https://twitter.com/csesoc?lang=en', + src: '/assets/x_twitter_icon.svg', + alt: 'X/Twitter' + }, + { + href: 'https://www.youtube.com/@CSESocUNSW', + src: '/assets/youtube_logo.svg', + alt: 'Youtube' + }, + { + href: 'https://www.instagram.com/csesoc_unsw/?hl=en', + src: '/assets/instagram_logo.svg', + alt: 'Instagram' + }, + { + href: 'https://www.tiktok.com/@csesoc?lang=en', + src: '/assets/tiktok_logo.svg', + alt: 'TikTok' + }, + { + href: 'https://www.linkedin.com/company/csesoc?originalSubdomain=au', + src: '/assets/linkedin_logo.svg', + alt: 'LinkedIn' + } +]; diff --git a/frontend/public/data/data.ts b/frontend/public/data/sponsorInfos.ts similarity index 73% rename from frontend/public/data/data.ts rename to frontend/public/data/sponsorInfos.ts index c1f714d..25f1a73 100644 --- a/frontend/public/data/data.ts +++ b/frontend/public/data/sponsorInfos.ts @@ -5,59 +5,51 @@ export type sponsorInfo = { description: string; }; -export type socialInfo = { - href: string; - src: string; - alt: string; -}; - export const diamondLinks: sponsorInfo[] = [ { href: 'https://www.janestreet.com/', - svg: 'assets/janestreet_logo.svg', + svg: '/assets/janestreet_logo.svg', alt: 'Janestreet logo', description: "Jane Street is a research-driven trading firm where curious people work together on deep problems", }, { href: 'https://www.tiktok.com/en/', - svg: 'assets/tiktok_logo.svg', + svg: '/assets/tiktok_logo.svg', alt: 'Tiktok logo', description: "TikTok is a social media platform for creating, sharing and discovering short videos", - } ]; export const goldLinks: sponsorInfo[] = [ { href: 'https://www.atlassian.com/', - svg: 'assets/atlassian_logo.svg', + svg: '/assets/atlassian_logo.svg', alt: 'Atlassian logo', description: "Atlassian Corporation is an Australian-American software company that develops products for software developers, and project managers among other groups", - }, { href: 'https://www.citadel.com/', - svg: 'assets/citadel_logo.svg', + svg: '/assets/citadel_logo.svg', alt: 'Citadel logo', description: "We are an alternative investment manager working on behalf of the world's preeminent institutions. Discover our work, teams, careers and more", }, { href: 'https://www.imc.com/ap/', - svg: 'assets/imc_logo.svg', + svg: '/assets/imc_logo.svg', alt: 'IMC logo', description: "For three decades IMC has provided liquidity to the financial markets globally. Specialised in algorithmic trading and advanced technology, we set the pace for the evolution of market making.", }, { href: 'https://neara.com/', - svg: 'assets/neara_logo.svg', + svg: '/assets/neara_logo.svg', alt: 'Neara logo', - description: "Neara electric utility software is a physics-enabled platform that builds 3D interactive models of critical infrastructure networks and assets.", + description: "Neara electric utility software is a physics-enabled platform that builds 3D interactive models of critical infrastructure networks and /assets.", }, { href: 'https://safetyculture.com/', - svg: 'assets/safetyculture_logo.svg', + svg: '/assets/safetyculture_logo.svg', alt: 'SafetyCulture logo', description: "Get to the root cause of workplace trends with total visibility across your organization. Use data from completed inspections, reported incidents, sensors, and asset history to keep workers safe, and prevent things from happening in the first place" } @@ -66,107 +58,69 @@ export const goldLinks: sponsorInfo[] = [ export const silverLinks: sponsorInfo[] = [ { href: 'https://appian.com/', - svg: 'assets/appian_logo.svg', + svg: '/assets/appian_logo.svg', alt: 'Appian logo', description: "Appian Corporation is an American cloud computing and enterprise software company headquartered in McLean, Virginia, part of the Dulles Technology Corridor. The company sells a platform as a service for building enterprise software applications", }, { href: 'https://www.flowtraders.com/', - svg: 'assets/flowtraders_logo.svg', + svg: '/assets/flowtraders_logo.svg', alt: 'FlowTraders logo', description: "Flow Traders is a proprietary trading firm. A market maker, it provides liquidity in the securities market by using high frequency and quantitative trading strategies", }, { href: 'https://www.macquarie.com.au/', - svg: 'assets/macquarie_logo.svg', + svg: '/assets/macquarie_logo.svg', alt: 'Macquarie logo', description: "Macquarie Bank offers transaction accounts, home loans, credit cards, online banking, business banking and more" }, { href: 'https://optiver.com/', - svg: 'assets/optiver_logo.svg', + svg: '/assets/optiver_logo.svg', alt: 'Optiver logo', description: "Optiver is a global market maker. As one of the oldest market making firms in the world, Optiver has been improving financial markets since 1986" }, { href: 'https://quantium.com/', - svg: 'assets/quantium_logo.svg', + svg: '/assets/quantium_logo.svg', alt: 'Quantium logo', description: "Quantium has developed a world-class data science and AI solution that has transformed the accuracy of Walmart's prediction of customers' needs at scale" }, { href: 'https://quickli.com.au/', - svg: 'assets/quickli_logo.svg', + svg: '/assets/quickli_logo.svg', alt: 'Quickli logo', description: "Bringing 30+ lender calcs into one, easy-to-use interface delivering accurate results and relevant policy insights for even the most complex scenarios." }, { href: 'https://www.revolutionise.com.au/', - svg: 'assets/revsport_logo.svg', + svg: '/assets/revsport_logo.svg', alt: 'RevolutioniseSport logo', description: "revolutioniseSPORT is an online management platform for sports of all shapes and sizes" }, { href: 'https://www.recordpoint.com/', - svg: 'assets/recordpoint_logo.svg', + svg: '/assets/recordpoint_logo.svg', alt: 'RecordPoint logo', description: "Manage all your data and records in one central place – without moving them", }, { href: 'https://sig.com/', - svg: 'assets/susquehanna_logo.svg', + svg: '/assets/susquehanna_logo.svg', alt: 'Susquehanna logo', description: "Discover Susquehanna, a global quantitative trading firm built on a rigorous, analytical foundation in financial markets." }, { href: 'https://zip.co/au', - svg: 'assets/zip_logo.svg', + svg: '/assets/zip_logo.svg', alt: 'Zip logo', description: "Zip Co Limited is a global 'buy now pay later' financial technology company with operations in Australia, New Zealand and the USA", }, { href: 'https://www.canva.com/en_au/', - svg: 'assets/canva_logo.svg', + svg: '/assets/canva_logo.svg', alt: 'Canva logo', description: "Canva is a free-to-use online graphic design tool. Use it to create social media posts, presentations, posters, videos, logos and more." } -]; - -export const socialLinks: socialInfo[] = [ - { - href: 'https://bit.ly/CSESocDiscord', - src: 'assets/discord_logo.svg', - alt: 'Discord' - }, - { - href: 'https://www.facebook.com/csesoc/', - src: 'assets/fb_logo.svg', - alt: 'Facebook' - }, - { - href: 'https://twitter.com/csesoc?lang=en', - src: 'assets/x_twitter_icon.svg', - alt: 'X/Twitter' - }, - { - href: 'https://www.youtube.com/@CSESocUNSW', - src: 'assets/youtube_logo.svg', - alt: 'Youtube' - }, - { - href: 'https://www.instagram.com/csesoc_unsw/?hl=en', - src: 'assets/instagram_logo.svg', - alt: 'Instagram' - }, - { - href: 'https://www.tiktok.com/@csesoc?lang=en', - src: 'assets/tiktok_logo.svg', - alt: 'TikTok' - }, - { - href: 'https://www.linkedin.com/company/csesoc?originalSubdomain=au', - src: 'assets/linkedin_logo.svg', - alt: 'LinkedIn' - } -]; +]; \ No newline at end of file diff --git a/frontend/src/components/About/AboutHomepage.tsx b/frontend/src/components/About/AboutHomepage.tsx index c8cbb76..31975b4 100644 --- a/frontend/src/components/About/AboutHomepage.tsx +++ b/frontend/src/components/About/AboutHomepage.tsx @@ -1,5 +1,5 @@ -import Link from "next/link"; import Image from "next/image"; + export default function AboutHomePage() { return (
@@ -30,7 +30,7 @@ export default function AboutHomePage() { We are here to fulfil the social, personal and professional needs of CSE students, and promote computing through a variety of forms.

- Learn more about us! + Learn more about us!

diff --git a/frontend/src/components/About/index.tsx b/frontend/src/components/About/index.tsx deleted file mode 100644 index 091a828..0000000 --- a/frontend/src/components/About/index.tsx +++ /dev/null @@ -1,124 +0,0 @@ -import Image from 'next/image'; -import Link from 'next/link'; - -const About = () => { - return ( -
-
-

ABOUT

-
-
-
- {/* LEFT SIDE */} -
-
- CSESoc Icon -
-

CSESoc

-

unsw-computer-science-engineering-society

- -

- CSESoc is the principal representative body for UNSW computing students. -

-
- People -
- 432 members · 342{' '} - subcom -
-
-
- Location - Sydney, Australia -
-
- Mail - info@csesoc.org.au -
-
- {/* RIGHT SIDE */} -
-
-

- csesoc/README.md -

-

- CSESoc is one of the biggest and most active societies at UNSW, catering to over 3500 CSE - students spanning across degrees in Computer Science, Software Engineering, - Bioinformatics and Computer Engineering. -

- We are here to fulfil the social, personal and - professional needs of CSE students, and promote computing through a variety of forms. -

-
-
- Pinned - {/* TODO: refactor all of this */} -
-
-
- Book - - execs-directors-subcoms - -
-
CSESoc's execs, directors, subcommittees
-
-
-
-
- Book - - constitution - -
-
Current and past constitutions
-
-
-
-
-
-
- Book - - our-history - -
-
Dive into CSESoc's history
-
-
-
-
- Book - - faqs - -
-
Frequently asked questions
-
-
-
-
-
-
- Book - - election-guide - -
-
Our election nomination guide
-
-
-
-
-
-
-
-
- ); -}; - -export default About; diff --git a/frontend/src/components/Footer.tsx b/frontend/src/components/Footer.tsx index 44c8d51..961e173 100644 --- a/frontend/src/components/Footer.tsx +++ b/frontend/src/components/Footer.tsx @@ -1,6 +1,6 @@ import Image from 'next/image'; import Link from 'next/link'; -import { socialLinks } from '@/../public/data/data'; +import { socialLinks } from '@/../public/data/socialInfos'; const Footer = () => { return ( @@ -9,7 +9,7 @@ const Footer = () => {
- CSESoc Logo + CSESoc Logo Ollie {
-

B03 CSE Building K17, UNSW csesoc@csesoc.org.au

+
+
B03 CSE Building K17, UNSW
+ csesoc@csesoc.org.au +

© 2024 — CSESoc UNSW

Sponsors backdrop diff --git a/frontend/src/components/Layout.tsx b/frontend/src/components/Layout.tsx new file mode 100644 index 0000000..3f25de9 --- /dev/null +++ b/frontend/src/components/Layout.tsx @@ -0,0 +1,15 @@ +import Navbar from './Navbar'; +import Footer from './Footer'; +import React from 'react'; + +const Layout = ({ children }: { children: React.ReactNode }) => { + return ( +
+ + {children} +
+
+ ); +}; + +export default Layout; diff --git a/frontend/src/components/Navbar.tsx b/frontend/src/components/Navbar.tsx index f28f4d4..2e4b43c 100644 --- a/frontend/src/components/Navbar.tsx +++ b/frontend/src/components/Navbar.tsx @@ -4,11 +4,11 @@ import { useEffect, useState } from 'react'; import Hamburger from './Hamburger'; const Navbar = () => { - const [path, setPath] = useState(''); + const [path, setPath] = useState([]); useEffect(() => { - const item: string | undefined = window.location.href.split('/').pop(); - if (item == '' || item == undefined) setPath('HOME'); - else setPath(item.toUpperCase()); + const pathSegments: string[] | undefined = window.location.pathname.split('/').filter(segment => segment); + if (pathSegments === undefined) setPath([]); + else setPath(pathSegments.map(segment => segment.toUpperCase())); }, []); return ( @@ -21,7 +21,13 @@ const Navbar = () => { height={200} draggable={false} /> -

C:\INTERNAL STRUCTURE\{path}

+

+ csesoc@unsw + : + ~{path.map(segment => '/' + segment.toLowerCase())} + $ + _ +

@@ -44,7 +50,7 @@ const Navbar = () => {
-
+
); }; diff --git a/frontend/src/components/PageBody.tsx b/frontend/src/components/PageBody.tsx new file mode 100644 index 0000000..e63d960 --- /dev/null +++ b/frontend/src/components/PageBody.tsx @@ -0,0 +1,13 @@ +import React from "react"; + +const PageBody = ({ children }: { children: React.ReactNode }) => { + return ( +
+
+ {children} +
+
+ ); +} + +export default PageBody; diff --git a/frontend/src/components/PageTitle.tsx b/frontend/src/components/PageTitle.tsx new file mode 100644 index 0000000..0ea158f --- /dev/null +++ b/frontend/src/components/PageTitle.tsx @@ -0,0 +1,9 @@ +const PageTitle = ({ title }: { title: string }) => { + return ( +
+

{title}

+
+ ) +} + +export default PageTitle; \ No newline at end of file diff --git a/frontend/src/components/Resources/index.tsx b/frontend/src/components/Resources/index.tsx deleted file mode 100644 index 796b36c..0000000 --- a/frontend/src/components/Resources/index.tsx +++ /dev/null @@ -1,131 +0,0 @@ -import Image from 'next/image'; -import { resourceCards, stage1, stage2, stage3 } from '../../../public/data/resourceCards'; - -const boxStyling = - 'border border-[#595F6D] rounded-lg hover:border-[#788093] hover:bg-[#070034] hover:bg-opacity-75 transition-all duration-300'; - -const Resources = () => { - return ( -
-
-
- Background -
-

RESOURCES

-
- -
- Made by - CSESoc Logo -
- -
-
- {stage3.map((item: resourceCards) => { - return ( - -
- {item.alt} -
-
-

{item.title}

-

{item.desc}

-
- - ); - })} -
-
- - -
- Made by - DevSoc Logo -
- -
-
- {stage1.map((item: resourceCards) => { - return ( - -
- {item.alt} -
-
-

{item.title}

-

{item.desc}

-
- - ); - })} - - {stage2.map((item: resourceCards) => { - return ( - -
- {item.alt} -
-
-

{item.title}

-

{item.desc}

-
- - ); - })} -
-
-
-
-
- ); -}; - -export default Resources; diff --git a/frontend/src/components/Sponsors/SponsorLinks.tsx b/frontend/src/components/Sponsors/SponsorLinks.tsx deleted file mode 100644 index 7928200..0000000 --- a/frontend/src/components/Sponsors/SponsorLinks.tsx +++ /dev/null @@ -1,91 +0,0 @@ -import { useState } from 'react'; -import { diamondLinks, goldLinks, silverLinks, sponsorInfo } from '../../../public/data/data'; -import SponsorModal from './SponsorModal'; - -//import '/styles/sponsorLinks.module.css'; -const logostyle = 'grow-on-hover cursor-pointer transform transition-transform duration-300 hover:scale-105'; -const logodiv = 'block gap-y-8 h-14'; -const background = 'rgba(57, 119, 248, 0.6)'; -// const outer = 'rounded-[4rem] w-[90rem] flex flex-col pl-14 py-14 gap-16'; - -function SponsorLinks() { - const [showModal, setShowModal] = useState(false); - const [information, setInformation] = useState(null); - - return ( -
-
- {showModal && ( - { - setShowModal(false); - }} - /> - )} -
-

Diamond Sponsors

- {diamondLinks.map((item, index) => { - return ( -
{ - setInformation(item); - setShowModal(true); - }} - > - {item.alt} -
- ); - })} -
-
-

Gold Sponsors

- {goldLinks.map((item, index) => { - return ( -
{ - setInformation(item); - setShowModal(true); - }} - > - {item.alt} -
- ); - })} -
-
-

Silver Sponsors

- {silverLinks.map((item, index) => { - return ( -
{ - setInformation(item); - setShowModal(true); - }} - > - {item.alt} -
- ); - })} -
-
-
- ); -} - -export default SponsorLinks; diff --git a/frontend/src/components/Sponsors/SponsorModal.tsx b/frontend/src/components/Sponsors/SponsorModal.tsx index b6e0b29..fd25c6f 100644 --- a/frontend/src/components/Sponsors/SponsorModal.tsx +++ b/frontend/src/components/Sponsors/SponsorModal.tsx @@ -1,5 +1,5 @@ -import { sponsorInfo } from '../../../public/data/data'; -import {motion} from 'framer-motion' +import { sponsorInfo } from '@/../public/data/sponsorInfos'; + export default function SponsorModal(props: { sponsorInfo: sponsorInfo | null; setFalse: () => void }) { if (props.sponsorInfo === null) { return ( @@ -17,17 +17,17 @@ export default function SponsorModal(props: { sponsorInfo: sponsorInfo | null; s >
- - {props.sponsorInfo.alt} - + {props.sponsorInfo.alt} +

{props.sponsorInfo.description}

+ + ); } + +export default ConstitutionPage; \ No newline at end of file diff --git a/frontend/src/pages/about/election-guide.tsx b/frontend/src/pages/about/election-guide.tsx index 28b465d..205b558 100644 --- a/frontend/src/pages/about/election-guide.tsx +++ b/frontend/src/pages/about/election-guide.tsx @@ -1,15 +1,12 @@ -import Navbar from "@/components/Navbar"; -import Footer from "@/components/Footer"; +import Layout from "@/components/Layout"; +import PageBody from "@/components/PageBody"; +import PageTitle from "@/components/PageTitle"; -const ElectionGuide = () => { +const ElectionGuidePage = () => { return ( -
- -
-
-

ELECTION NOMINATION GUIDE

-
- + + +

Before considering any executive position for CSESoc, it @@ -110,10 +107,9 @@ const ElectionGuide = () => {

-
-
-
+ + ); }; -export default ElectionGuide; \ No newline at end of file +export default ElectionGuidePage; \ No newline at end of file diff --git a/frontend/src/pages/about/execs-directors-subcommittees.tsx b/frontend/src/pages/about/execs-directors-subcoms.tsx similarity index 72% rename from frontend/src/pages/about/execs-directors-subcommittees.tsx rename to frontend/src/pages/about/execs-directors-subcoms.tsx index 2b745a3..d769da6 100644 --- a/frontend/src/pages/about/execs-directors-subcommittees.tsx +++ b/frontend/src/pages/about/execs-directors-subcoms.tsx @@ -1,15 +1,12 @@ -import Navbar from '@/components/Navbar'; -import Footer from '@/components/Footer'; +import Layout from "@/components/Layout"; +import PageBody from "@/components/PageBody"; +import PageTitle from "@/components/PageTitle"; -const ExecsDirectorsSubcommittees = () => { +const ExecsDirectorsSubcommitteesPage = () => { return ( -
- -
-
-

EXECS, DIRECTORS & SUBCOMMITEES

-
- + + + {/* CSESOC TEAM */}

@@ -22,134 +19,137 @@ const ExecsDirectorsSubcommittees = () => {

CSESoc Team 2024
+
-
-
-

Execs

-
    -
  • Elizabeth Zhu Chan - Co-President
    • -
  • Lesley Lu - Co-President
    • -
  • Ivan Chan - Secretary
    • -
  • Justin Son - Treasurer
    • -
  • Sophie Khov - Arc Delegate
    • -
  • Catherine Kim - Grievance, Equity, Diversity and Inclusion Officer
    • -
  • Amy Liu - Vice President (Internals)
    • -
  • Nicole Jiang - Vice President (Externals)
    • -
  • Matthew Lim - Vice President (Technicals)
    • -
+
+

Execs

+
+
    +
  • Elizabeth Zhu Chan - Co-President
    • +
  • Lesley Lu - Co-President
    • +
  • Ivan Chan - Secretary
    • +
  • Justin Son - Treasurer
    • +
  • Sophie Khov - Arc Delegate
    • +
  • Catherine Kim - Grievance, Equity, Diversity and Inclusion Officer
    • +
  • Amy Liu - Vice President (Internals)
    • +
  • Nicole Jiang - Vice President (Externals)
    • +
  • Matthew Lim - Vice President (Technicals)
    • +
+
-
+
+

Careers

-
    +
    • Eric Kang
    • Jasmine Xian
    • Max Lee
-
+

Competitions

-
    +
    • Aliff Azlan
    • Haibing Wang
    • Diego Untalan
-
+

Creative

-
    +
    • Anna Wang
    • Jordan Djamaan
    • Shabinda Sarkaria
-
+

Education

-
    +
    • Alina Jin
    • JJ Roberts-White
    • Liam Smith
-
+

Events

-
    +
    • Emma Nguyen
    • Jalaj Jain
    • Jenny Lee
-
+

HR

-
    +
    • Aryan Chauhan
    • Edwin Tang
    • Jasmine Guan
-
+

IT

-
    +
    • Derek Xu
    • Dominic Cheung
-
+

Marketing

-
    +
    • Aaron Lee
    • Lisa Lin
    • Zitian Qin
-
+

Media

-
    +
    • Dylan Hu
    • Gloria Xi
    • Leo Ng Maisnam
-
+

Online

-
    +
    • Amy Tian
    • Brandon Tan
-
+

Outreach

-
    +
    • Joyce He
    • Sapphire Wildie
-
+

Socials

-
    +
    • Davis Lim
    • Jennifer Yu
    • Susie Xia
-
-

- Get to know them better here! +

+ Get to know them better here!

+
{/* PORTFOLIOS */} @@ -245,11 +245,10 @@ const ExecsDirectorsSubcommittees = () => { Organises approachable events targeted towards building an inclusive and welcoming community, to help build long-lasting friendships!

-
-
-
-
+ + + ); } -export default ExecsDirectorsSubcommittees; \ No newline at end of file +export default ExecsDirectorsSubcommitteesPage; \ No newline at end of file diff --git a/frontend/src/pages/about/faqs.tsx b/frontend/src/pages/about/faqs.tsx index 95b4fb2..1c4654e 100644 --- a/frontend/src/pages/about/faqs.tsx +++ b/frontend/src/pages/about/faqs.tsx @@ -1,15 +1,12 @@ -import Navbar from '@/components/Navbar'; -import Footer from '@/components/Footer'; +import Layout from "@/components/Layout"; +import PageBody from "@/components/PageBody"; +import PageTitle from "@/components/PageTitle"; -const Faqs = () => { +const FaqsPage = () => { return ( -
- -
-
-

FREQUENTLY ASKED QUESTIONS

-
- + + +

What is CSESoc? @@ -52,10 +49,9 @@ const Faqs = () => { subcommittee. Subcommittee recruitment opens during T1 of each year.

-
-
-
+ + ); }; -export default Faqs; \ No newline at end of file +export default FaqsPage; \ No newline at end of file diff --git a/frontend/src/pages/about/index.tsx b/frontend/src/pages/about/index.tsx index a3ac9e6..63274d6 100644 --- a/frontend/src/pages/about/index.tsx +++ b/frontend/src/pages/about/index.tsx @@ -1,13 +1,136 @@ -import Navbar from '@/components/Navbar'; -import Footer from '@/components/Footer'; -import About from '@/components/About'; +import Layout from "@/components/Layout"; +import PageTitle from "@/components/PageTitle"; +import Image from 'next/image'; +import Link from 'next/link'; export default function AboutPage() { return ( -
- - -
-
+ + +
+
+
+ {/* LEFT SIDE */} +
+
+ CSESoc Icon +
+

CSESoc

+

unsw-computer-science-engineering-society

+ + + +

+ CSESoc is the principal representative body for UNSW computing students. +

+
+ People +
+ 432 members · 342{' '} + subcom +
+
+
+ Location + Sydney, Australia +
+ +
+ {/* RIGHT SIDE */} +
+
+

+ csesoc/README.md +

+

+ CSESoc is the official representative body of computing students at UNSW. We are one of the + largest and most active societies at UNSW, and the largest computing society in the southern hemisphere. + CSESoc comprises ~10k members spanning across degrees in Computer Science, Software Engineering, + Bioinformatics and Computer Engineering. We are here to fulfil the social, personal and professional + needs of CSE students, and promote computing through a variety of forms. +

+ We are a society for the students, by the students. Here’s an overview of what we do: + +

    +
  • Run weekly social and educational events, including trivia, movie, boardgames nights, LAN parties, workshops, coding competitions, tech talks, and our famous free weekly BBQ
    • +
  • Create original media content, including Podcasts, articles, YouTube videos, and live streams
    • +
  • Run a highly successful First Year Camp and Peer Mentoring program, offering new CSE students (both undergraduate and postgraduate) a chance to meet and mingle with other newcomers
    • +
  • Engage students with industry sponsors and representatives to develop their professional capacity and curiosity
    • +
  • Develop our own open-source projects for students to get learn new skills and develop tools for our community
    • +
  • Facilitate an online community of ~8k Discord users, ~9.5k Facebook followers, ~1.9k YouTube subs, and ~7.7k Instagram followers
    • +
+

+
+
+ Pinned + {/* TODO: refactor all of this */} +
+
+
+ Book + + execs-directors-subcoms + +
+
CSESoc's execs, directors, subcommittees
+
+
+
+
+ Book + + constitution + +
+
Current and past constitutions
+
+
+
+
+
+
+ Book + + our-history + +
+
Dive into CSESoc's history
+
+
+
+
+ Book + + faqs + +
+
Frequently asked questions
+
+
+
+
+
+
+ Book + + election-guide + +
+
Our election nomination guide
+
+
+
+
+
+
+
+
+ ); } diff --git a/frontend/src/pages/about/our-history.tsx b/frontend/src/pages/about/our-history.tsx index 368c3d4..b2cbce6 100644 --- a/frontend/src/pages/about/our-history.tsx +++ b/frontend/src/pages/about/our-history.tsx @@ -1,23 +1,20 @@ -import Navbar from "@/components/Navbar"; -import Footer from "@/components/Footer"; +import Layout from "@/components/Layout"; +import PageBody from "@/components/PageBody"; +import PageTitle from "@/components/PageTitle"; import { useState } from "react"; const MIN_YEAR = 2007; const MAX_YEAR = 2020; const DEFAULT_YEAR = 2020; -const OurHistory = () => { +const OurHistoryPage = () => { const [year, setYear] = useState(DEFAULT_YEAR); const [shouldDisplayTip, setShouldDisplayTip] = useState(true); return ( -
- -
-
-

OUR HISTORY

-
- + + +

CSESoc was formed in October 2006 from the old CompSoc and SESoc societies. @@ -76,10 +73,9 @@ const OurHistory = () => { {`CSESoc

-
-
-
- ) + + + ); } -export default OurHistory; +export default OurHistoryPage; diff --git a/frontend/src/pages/contact-us.tsx b/frontend/src/pages/contact-us.tsx index ef95158..a56ee61 100644 --- a/frontend/src/pages/contact-us.tsx +++ b/frontend/src/pages/contact-us.tsx @@ -1,57 +1,55 @@ import Contacts from '@/components/Contacts'; -import Footer from '@/components/Footer'; -import Navbar from '@/components/Navbar'; +import Layout from '@/components/Layout'; +import PageBody from '@/components/PageBody'; +import PageTitle from '@/components/PageTitle'; -export default function ContactUs() { +export default function ContactUsPage() { return ( -
- -
-
-

CONTACT US

-
+ + + @@ -61,12 +59,9 @@ export default function ContactUs() { And be sure to follow us on social media to be notified of upcoming events and opportunities!

-
- -
+ -
-
-
+ + ); } diff --git a/frontend/src/pages/events.tsx b/frontend/src/pages/events.tsx index 3e95480..130a8f7 100644 --- a/frontend/src/pages/events.tsx +++ b/frontend/src/pages/events.tsx @@ -1,5 +1,5 @@ -import Navbar from '@/components/Navbar'; -import Footer from '@/components/Footer'; +import Layout from '@/components/Layout'; +import PageTitle from '@/components/PageTitle'; import axios from 'axios'; export default function EventsPage() { @@ -13,10 +13,9 @@ export default function EventsPage() { }; return ( -
- + + -
-
+ ); } diff --git a/frontend/src/pages/index.tsx b/frontend/src/pages/index.tsx index e4620c2..8fe672b 100644 --- a/frontend/src/pages/index.tsx +++ b/frontend/src/pages/index.tsx @@ -3,7 +3,7 @@ import Sponsors from '@/components/Sponsors/index'; import Event from '@/components/Event'; import AboutHomePage from '@/components/About/AboutHomepage'; -export default function Home() { +export default function HomePage() { return (
diff --git a/frontend/src/pages/resources.tsx b/frontend/src/pages/resources.tsx index 89ca83b..d3a3736 100644 --- a/frontend/src/pages/resources.tsx +++ b/frontend/src/pages/resources.tsx @@ -1,14 +1,132 @@ -import Navbar from '@/components/Navbar'; -import Footer from '@/components/Footer'; -import Resources from '@/components/Resources'; -import Contacts from '@/components/Contacts'; +import Layout from '@/components/Layout'; +import Image from 'next/image'; +import { resourceCards, stage1, stage2, stage3 } from '@/../public/data/resourceCards'; +import PageTitle from '@/components/PageTitle'; export default function ResourcesPage() { + const boxStyling = + 'border border-[#595F6D] rounded-lg hover:border-[#788093] hover:bg-[#070034] hover:bg-opacity-75 transition-all duration-300'; + return ( -
- - -
-
+ + + +
+
+
+ Background + +
+ Made by + CSESoc Logo +
+ +
+
+ {stage3.map((item: resourceCards) => { + return ( + +
+ {item.alt} +
+
+

{item.title}

+

{item.desc}

+
+ + ); + })} +
+
+ + +
+ Made by + DevSoc Logo +
+ +
+
+ {stage1.map((item: resourceCards) => { + return ( + +
+ {item.alt} +
+
+

{item.title}

+

{item.desc}

+
+ + ); + })} + + {stage2.map((item: resourceCards) => { + return ( + +
+ {item.alt} +
+
+

{item.title}

+

{item.desc}

+
+ + ); + })} +
+
+
+
+
+ ); } diff --git a/frontend/src/pages/sponsors.tsx b/frontend/src/pages/sponsors.tsx index fd97023..ae83c8a 100644 --- a/frontend/src/pages/sponsors.tsx +++ b/frontend/src/pages/sponsors.tsx @@ -1,13 +1,95 @@ -import Navbar from '@/components/Navbar'; -import Footer from '@/components/Footer'; -import SponsorLinks from '@/components/Sponsors/SponsorLinks'; +import Layout from '@/components/Layout'; +import { useState } from 'react'; +import { diamondLinks, goldLinks, silverLinks, sponsorInfo } from '@/../public/data/sponsorInfos'; +import SponsorModal from '@/components/Sponsors/SponsorModal'; +import PageTitle from '@/components/PageTitle'; export default function SponsorsPage() { + const logostyle = 'grow-on-hover cursor-pointer transform transition-transform duration-300 hover:scale-105'; + const logodiv = 'block gap-y-8 h-14'; + const background = 'rgba(57, 119, 248, 0.6)'; + + const [showModal, setShowModal] = useState(false); + const [information, setInformation] = useState(null); + return ( -
- - -
-
+ + + +
+
+
+ {showModal && ( + { + setShowModal(false); + }} + /> + )} +
+

Diamond Sponsors

+ {diamondLinks.map((item, index) => { + return ( +
{ + setInformation(item); + setShowModal(true); + }} + > + {item.alt} +
+ ); + })} +
+
+

Gold Sponsors

+ {goldLinks.map((item, index) => { + return ( +
{ + setInformation(item); + setShowModal(true); + }} + > + {item.alt} +
+ ); + })} +
+
+

Silver Sponsors

+ {silverLinks.map((item, index) => { + return ( +
{ + setInformation(item); + setShowModal(true); + }} + > + {item.alt} +
+ ); + })} +
+
+
+
+ ); } diff --git a/frontend/src/styles/globals.css b/frontend/src/styles/globals.css index 18bbbf6..c78751a 100644 --- a/frontend/src/styles/globals.css +++ b/frontend/src/styles/globals.css @@ -11,3 +11,13 @@ body { background: #000031; font-family: 'Raleway', sans-serif; } + +@keyframes blink { + 50% { + opacity: 0; + } +} + +.animate-blink { + animation: blink 1s step-end infinite; +} diff --git a/frontend/src/styles/sponsorLinks.module.css b/frontend/src/styles/sponsorLinks.module.css deleted file mode 100644 index bab5fad..0000000 --- a/frontend/src/styles/sponsorLinks.module.css +++ /dev/null @@ -1,16 +0,0 @@ -.logo-container-outer { - display: flex; - flex-direction: row; - background-color: red !important; -} - -.logo-container { - display: flex; - flex-direction: column; - background-color: red !important; -} - -.logo-container a { - gap: 20px; - background-color: red !important; -} \ No newline at end of file