From aabb7c03eee00d6d48b3eeed784ff88df23cb8f9 Mon Sep 17 00:00:00 2001 From: QuadAces <107918856+QuadAces@users.noreply.github.com> Date: Thu, 18 Apr 2024 19:20:01 +1000 Subject: [PATCH 1/6] added id for sponsors and added hamburger menu --- components/Hamburger.tsx | 46 +++++++++++++++++++++++++++++++++++ components/Navbar.tsx | 6 ++++- components/Sponsors/index.tsx | 2 +- components/styles.css | 40 ++++++++++++++++++++++++++++++ package-lock.json | 33 +++++++++++++++++++++++++ package.json | 1 + 6 files changed, 126 insertions(+), 2 deletions(-) create mode 100644 components/Hamburger.tsx create mode 100644 components/styles.css diff --git a/components/Hamburger.tsx b/components/Hamburger.tsx new file mode 100644 index 0000000..c0b5090 --- /dev/null +++ b/components/Hamburger.tsx @@ -0,0 +1,46 @@ +import React from "react"; +import { AnimatePresence, motion, useCycle } from "framer-motion"; +import Link from "next/link"; + +export default function Hamburger () { + + const [isOpen, toggleOpen] = useCycle(false, true); + + return ( + + ); +} diff --git a/components/Navbar.tsx b/components/Navbar.tsx index 9e395bb..a32bb6e 100644 --- a/components/Navbar.tsx +++ b/components/Navbar.tsx @@ -1,6 +1,7 @@ import Image from 'next/image'; import Link from 'next/link'; import { useEffect, useState } from 'react'; +import Hamburger from './Hamburger'; const Navbar = () => { const [path, setPath] = useState(''); @@ -28,7 +29,7 @@ const Navbar = () => {

01

{'//'} about us
- +

02

{'//'} events
@@ -41,6 +42,9 @@ const Navbar = () => {
{'//'} sponsors
+
+ +
); diff --git a/components/Sponsors/index.tsx b/components/Sponsors/index.tsx index 46190e4..69c24b6 100644 --- a/components/Sponsors/index.tsx +++ b/components/Sponsors/index.tsx @@ -8,7 +8,7 @@ const Sponsors = () => { 'xl:p-16 p-10 flex justify-center items-center xl:col-span-3 sm:col-span-5 col-span-10 xl:row-start-2 xl:row-end-3 sm:row-start-4 sm:row-end-5 sm:h-auto h-36'; return ( -
+

04

SUPPORT CSESOC

diff --git a/components/styles.css b/components/styles.css new file mode 100644 index 0000000..9fc2ea8 --- /dev/null +++ b/components/styles.css @@ -0,0 +1,40 @@ +body { + background-color: #1a0554; + font-family: "Roboto", sans-serif; + } + + main { + display: flex; + } + + aside { + background-color: #c4a8ff; + width: 18.75rem; + height: 100vh; + } + + .container { + margin: 4.5rem 1.4rem; + } + + .btn-container { + position: fixed; + } + + .container a { + color: #f9fafb; + text-decoration: none; + font-size: 1.75rem; + font-weight: 600; + display: block; + margin: 20px; + } + + button { + cursor: pointer; + margin: 1.25rem; + border: none; + padding: 0.5rem 1rem; + background-color: #f9fafb; + } + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index d5cafbf..3405fa5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "@types/react-dom": "18.2.7", "autoprefixer": "10.4.15", "eslint-config-next": "13.4.19", + "framer-motion": "^11.1.2", "next": "13.4.19", "postcss": "8.4.29", "react": "18.2.0", @@ -2133,6 +2134,30 @@ "url": "https://github.com/sponsors/rawify" } }, + "node_modules/framer-motion": { + "version": "11.1.2", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.1.2.tgz", + "integrity": "sha512-flRo14ImBGRbOFz9KsXQ9ty3wWW2zFk0Gp4VbvZ5bG+1gZg/1CNWj9ZHtsCmZSPkBgZNOVkVf6aEtW5YxOITfw==", + "dependencies": { + "tslib": "^2.4.0" + }, + "peerDependencies": { + "@emotion/is-prop-valid": "*", + "react": "^18.0.0", + "react-dom": "^18.0.0" + }, + "peerDependenciesMeta": { + "@emotion/is-prop-valid": { + "optional": true + }, + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", @@ -5999,6 +6024,14 @@ "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.6.tgz", "integrity": "sha512-n2aZ9tNfYDwaHhvFTkhFErqOMIb8uyzSQ+vGJBjZyanAKZVbGUQ1sngfk9FdkBw7G26O7AgNjLcecLffD1c7eg==" }, + "framer-motion": { + "version": "11.1.2", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.1.2.tgz", + "integrity": "sha512-flRo14ImBGRbOFz9KsXQ9ty3wWW2zFk0Gp4VbvZ5bG+1gZg/1CNWj9ZHtsCmZSPkBgZNOVkVf6aEtW5YxOITfw==", + "requires": { + "tslib": "^2.4.0" + } + }, "fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", diff --git a/package.json b/package.json index b99482d..11cb6f8 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "@types/react-dom": "18.2.7", "autoprefixer": "10.4.15", "eslint-config-next": "13.4.19", + "framer-motion": "^11.1.2", "next": "13.4.19", "postcss": "8.4.29", "react": "18.2.0", From 650e22ed84e51ed90f36fe95eb566fa6f0cc576f Mon Sep 17 00:00:00 2001 From: QuadAces <107918856+QuadAces@users.noreply.github.com> Date: Thu, 18 Apr 2024 19:28:53 +1000 Subject: [PATCH 2/6] made linter shut up --- components/Hamburger.tsx | 34 +++++++++++++++++++++++----------- components/Navbar.tsx | 4 ++-- 2 files changed, 25 insertions(+), 13 deletions(-) diff --git a/components/Hamburger.tsx b/components/Hamburger.tsx index c0b5090..0de397d 100644 --- a/components/Hamburger.tsx +++ b/components/Hamburger.tsx @@ -1,13 +1,17 @@ -import React from "react"; -import { AnimatePresence, motion, useCycle } from "framer-motion"; -import Link from "next/link"; - -export default function Hamburger () { +import React from 'react'; +import { AnimatePresence, motion, useCycle } from 'framer-motion'; +import Link from 'next/link'; +export default function Hamburger() { const [isOpen, toggleOpen] = useCycle(false, true); return ( -
-
- +
+
From d7d746a327f0135de03ca15aeed5dd27ca4b24fa Mon Sep 17 00:00:00 2001 From: QuadAces <107918856+QuadAces@users.noreply.github.com> Date: Thu, 18 Apr 2024 19:36:10 +1000 Subject: [PATCH 3/6] made linter shut up --- components/Sponsors/index.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/components/Sponsors/index.tsx b/components/Sponsors/index.tsx index 69c24b6..18d6b99 100644 --- a/components/Sponsors/index.tsx +++ b/components/Sponsors/index.tsx @@ -8,7 +8,10 @@ const Sponsors = () => { 'xl:p-16 p-10 flex justify-center items-center xl:col-span-3 sm:col-span-5 col-span-10 xl:row-start-2 xl:row-end-3 sm:row-start-4 sm:row-end-5 sm:h-auto h-36'; return ( -
+

04

SUPPORT CSESOC

From d3333e6bae2f420c496c6d2d2e19fb4894a5716b Mon Sep 17 00:00:00 2001 From: QuadAces <107918856+QuadAces@users.noreply.github.com> Date: Thu, 30 May 2024 18:45:03 +1000 Subject: [PATCH 4/6] removed css file --- components/About/index.tsx | 6 +-- components/Footer.tsx | 57 ++++++++++++++--------- components/Landing/index.tsx | 2 +- components/Navbar.tsx | 2 +- components/ResourcesAndContacts/index.tsx | 26 +++++++++-- components/Sponsors/index.tsx | 29 +----------- components/Sponsors/sponsorlinks.tsx | 33 ++++++------- components/Sponsors/subpage.tsx | 13 ------ components/styles.css | 40 ---------------- pages/about.tsx | 13 ++++++ pages/events.tsx | 12 +++++ pages/resources.tsx | 13 ++++++ pages/sponsors.tsx | 6 +-- public/data/data.ts | 44 +++++++++++++++++ 14 files changed, 164 insertions(+), 132 deletions(-) delete mode 100644 components/Sponsors/subpage.tsx delete mode 100644 components/styles.css create mode 100644 pages/about.tsx create mode 100644 pages/events.tsx create mode 100644 pages/resources.tsx diff --git a/components/About/index.tsx b/components/About/index.tsx index a04a53c..04e0353 100644 --- a/components/About/index.tsx +++ b/components/About/index.tsx @@ -5,7 +5,7 @@ const About = () => {

01

-

ABOUT

+

ABOUT

@@ -14,7 +14,7 @@ const About = () => {
CSESoc Icon
-

CSESoc

+

CSESoc

unsw-computer-science-soc

@@ -40,7 +40,7 @@ const About = () => {

{/* RIGHT SIDE */}
-
+

csesoc/README.md

diff --git a/components/Footer.tsx b/components/Footer.tsx index 46111f3..1c7ff2d 100644 --- a/components/Footer.tsx +++ b/components/Footer.tsx @@ -1,38 +1,51 @@ +import Image from 'next/image'; import Link from 'next/link'; +import { socialLinks } from '../public/data/data'; const Footer = () => { return (
-
-
- CSESoc Logo - - Ollie - - Ollie +
+
+
+ + CSESoc Logo + Ollie + +
+
+ {socialLinks.map((item, index) => { + return ( + + {item.alt} + + ); + })} +

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

© 2021 — CSESoc UNSW

- Sponsors backdrop
diff --git a/components/Landing/index.tsx b/components/Landing/index.tsx index 111ee8f..b5002be 100644 --- a/components/Landing/index.tsx +++ b/components/Landing/index.tsx @@ -13,7 +13,7 @@ const Landing = () => {

{'

'}

-

Hello World!

+

Hello World!

{''}

diff --git a/components/Navbar.tsx b/components/Navbar.tsx index c380a94..4dfade2 100644 --- a/components/Navbar.tsx +++ b/components/Navbar.tsx @@ -25,7 +25,7 @@ const Navbar = () => {
- +

01

{'//'} about us
diff --git a/components/ResourcesAndContacts/index.tsx b/components/ResourcesAndContacts/index.tsx index 3acb046..459abbe 100644 --- a/components/ResourcesAndContacts/index.tsx +++ b/components/ResourcesAndContacts/index.tsx @@ -15,7 +15,7 @@ const ResourcesAndContacts = () => {

03

-

RESOURCES & CONTACTS

+

RESOURCES & CONTACTS

@@ -122,7 +122,13 @@ const ResourcesAndContacts = () => {
diff --git a/components/Sponsors/index.tsx b/components/Sponsors/index.tsx index 18d6b99..558eada 100644 --- a/components/Sponsors/index.tsx +++ b/components/Sponsors/index.tsx @@ -1,5 +1,6 @@ import Link from 'next/link'; import React from 'react'; +import Footer from '../Footer'; const Sponsors = () => { const firstRowBoxesStyling = @@ -49,33 +50,7 @@ const Sponsors = () => {
-
-
- CSESoc Logo - - Ollie - - Ollie -
-
-

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

-

© 2021 — CSESoc UNSW

-
-
+
Sponsors backdrop

Diamond Sponsors

{diamondLinks.map((item, index) => { @@ -24,23 +23,21 @@ function SponsorLinks() { })}
-

Gold Sponsors

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

Gold Sponsors

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

Silver Sponsors

{silverLinks.map((item, index) => { diff --git a/components/Sponsors/subpage.tsx b/components/Sponsors/subpage.tsx deleted file mode 100644 index 6af78b6..0000000 --- a/components/Sponsors/subpage.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import React from 'react'; -//import '/styles/sponsors.module.css'; -import SponsorLinks from './sponsorlinks'; - -const SponsorsPage = () => { - return ( -
- -
- ); -}; - -export default SponsorsPage; diff --git a/components/styles.css b/components/styles.css deleted file mode 100644 index 9fc2ea8..0000000 --- a/components/styles.css +++ /dev/null @@ -1,40 +0,0 @@ -body { - background-color: #1a0554; - font-family: "Roboto", sans-serif; - } - - main { - display: flex; - } - - aside { - background-color: #c4a8ff; - width: 18.75rem; - height: 100vh; - } - - .container { - margin: 4.5rem 1.4rem; - } - - .btn-container { - position: fixed; - } - - .container a { - color: #f9fafb; - text-decoration: none; - font-size: 1.75rem; - font-weight: 600; - display: block; - margin: 20px; - } - - button { - cursor: pointer; - margin: 1.25rem; - border: none; - padding: 0.5rem 1rem; - background-color: #f9fafb; - } - \ No newline at end of file diff --git a/pages/about.tsx b/pages/about.tsx new file mode 100644 index 0000000..a3ac9e6 --- /dev/null +++ b/pages/about.tsx @@ -0,0 +1,13 @@ +import Navbar from '@/components/Navbar'; +import Footer from '@/components/Footer'; +import About from '@/components/About'; + +export default function AboutPage() { + return ( +
+ + +
+
+ ); +} diff --git a/pages/events.tsx b/pages/events.tsx new file mode 100644 index 0000000..b7889f6 --- /dev/null +++ b/pages/events.tsx @@ -0,0 +1,12 @@ +import Navbar from '@/components/Navbar'; +import Footer from '@/components/Footer'; + +export default function EventsPage() { + return ( +
+ +
Events
+
+
+ ); +} diff --git a/pages/resources.tsx b/pages/resources.tsx new file mode 100644 index 0000000..b634ac2 --- /dev/null +++ b/pages/resources.tsx @@ -0,0 +1,13 @@ +import Navbar from '@/components/Navbar'; +import Footer from '@/components/Footer'; +import ResourcesAndContacts from '@/components/ResourcesAndContacts'; + +export default function ResourcesPage() { + return ( +
+ + +
+
+ ); +} diff --git a/pages/sponsors.tsx b/pages/sponsors.tsx index d2e2d1a..94de148 100644 --- a/pages/sponsors.tsx +++ b/pages/sponsors.tsx @@ -1,12 +1,12 @@ -import SponsorsPage from '@/components/Sponsors/subpage'; +import SponsorLinks from '@/components/Sponsors/sponsorlinks'; import Navbar from '@/components/Navbar'; import Footer from '@/components/Footer'; -export default function Home() { +export default function SponsorsPage() { return (
- +
); diff --git a/public/data/data.ts b/public/data/data.ts index ced261f..df77c79 100644 --- a/public/data/data.ts +++ b/public/data/data.ts @@ -4,6 +4,12 @@ export type sponsorInfo = { alt: string; }; +export type socialInfo = { + href: string; + src: string; + alt: string; +}; + export const diamondLinks: sponsorInfo[] = [ { href: 'https://www.janestreet.com/', @@ -102,3 +108,41 @@ export const silverLinks: sponsorInfo[] = [ alt: 'Canva logo' } ]; + +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' + } +]; From 0811e613f255df9bb0755c70bdc55c1fe079cc22 Mon Sep 17 00:00:00 2001 From: QuadAces <107918856+QuadAces@users.noreply.github.com> Date: Thu, 30 May 2024 19:03:03 +1000 Subject: [PATCH 5/6] fixed the complainy pls allow or else <3 --- components/Hamburger.tsx | 21 ++++++++++----------- components/Sponsors/index.tsx | 29 +++++++++++++++++++++++++++-- 2 files changed, 37 insertions(+), 13 deletions(-) diff --git a/components/Hamburger.tsx b/components/Hamburger.tsx index 0de397d..760da31 100644 --- a/components/Hamburger.tsx +++ b/components/Hamburger.tsx @@ -10,10 +10,10 @@ export default function Hamburger() { onClick={() => { toggleOpen(); }} - className="focus:outline-none" + // className="focus:outline-none w-20 h-20" >
    -
  • - About Us +
  • + About Us
    • -
  • - Events +
  • + Events
    • -
  • - Resources +
  • + Resources
    • -
  • - Sponsors +
  • + Sponsors
diff --git a/components/Sponsors/index.tsx b/components/Sponsors/index.tsx index 558eada..18d6b99 100644 --- a/components/Sponsors/index.tsx +++ b/components/Sponsors/index.tsx @@ -1,6 +1,5 @@ import Link from 'next/link'; import React from 'react'; -import Footer from '../Footer'; const Sponsors = () => { const firstRowBoxesStyling = @@ -50,7 +49,33 @@ const Sponsors = () => {
-