Skip to content

Commit 3f29431

Browse files
committed
Remove photo album and use grid format
1 parent a17ddc3 commit 3f29431

File tree

6 files changed

+45
-92
lines changed

6 files changed

+45
-92
lines changed

Diff for: frontend/package-lock.json

+3-21
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Diff for: frontend/package.json

-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,6 @@
2626
"react": "18.2.0",
2727
"react-dom": "18.2.0",
2828
"react-multi-carousel": "^2.8.5",
29-
"react-photo-album": "^3.0.2",
3029
"tailwindcss": "3.3.3",
3130
"typescript": "5.1"
3231
},

Diff for: frontend/public/data/events.ts

-36
Original file line numberDiff line numberDiff line change
@@ -157,40 +157,4 @@ export const previousEvents: eventInfo[] = [
157157
image: 'https://scontent.fsyd14-1.fna.fbcdn.net/v/t39.30808-6/429667295_896623802247232_669736057716718914_n.jpg?stp=dst-jpg_s960x960&_nc_cat=102&ccb=1-7&_nc_sid=75d36f&_nc_ohc=Ayn7Skl-pFAQ7kNvgES7wuB&_nc_zt=23&_nc_ht=scontent.fsyd14-1.fna&_nc_gid=AsnAjGmOe-G8q1L6qZb9G3U&oh=00_AYDpfvDY6DpKeydN99VCHujemmm0gZwL7_O1HjXHvwiPsw&oe=671383B1',
158158
link: 'https://www.facebook.com/events/322704110303236',
159159
},
160-
{
161-
title: 'COMP1521 Revision Session',
162-
startTime: 'Wednesday, 31 July 2024 16:00:00',
163-
endTime: 'Wednesday, 31 July 2024 18:00:00',
164-
location: 'UNSW Colombo Theatre B',
165-
description: 'PSST 🤫 Think a pipe is what Mario goes down? ⬇️ Still think threads are for clothes? 🪡 Whether you’re seven weeks behind (😣) on lectures 👩‍🏫, or super on top of it (🤯), get ready to BYTE 👾 into a world of MIPS and files and numbers 📣 at our COMP1521 Revision Session to learn and/or reinforce your knowledge from the beginning to the end 🏁💪🏻🧠 Make no MIPStake, with bits of free food for you to byte into 🤤 our 1521 Revision Session is just for you ‼️',
166-
image: 'https://scontent.fsyd14-1.fna.fbcdn.net/v/t39.30808-6/452409402_989988656244079_1650487011875279290_n.jpg?stp=dst-jpg_s960x960&_nc_cat=111&ccb=1-7&_nc_sid=75d36f&_nc_ohc=ht74Cur7JP4Q7kNvgGspvAQ&_nc_zt=23&_nc_ht=scontent.fsyd14-1.fna&_nc_gid=APUh-KsjJ_dRpSnbr0TYkXd&oh=00_AYAu-LeWj1k53uhaQe6BMnCdQiDRUmguc0R4gt93VnxsRA&oe=6713A488',
167-
link: 'https://www.facebook.com/events/1911189126010096',
168-
},
169-
{
170-
title: 'IMC Coding Competition',
171-
startTime: 'Wednesday, 13 March 2024 15:00:00',
172-
endTime: 'Wednesday, 13 March 2024 18:00:00',
173-
location: 'Mathews Theatre B, UNSW',
174-
description: 'Get those fingers 👐moving, as you’ll need to team up in groups of 3️⃣to be able to face 🗣️some of the problems thrown your way.To reward your diligence, you’ll be able to grab a free BYTE as finger food is provided 😈 Gaining coding experience and free food, what else could someone even ask for??? 😣',
175-
image: 'https://scontent.fsyd14-1.fna.fbcdn.net/v/t39.30808-6/429779953_899425045300441_8341318489109234227_n.jpg?stp=dst-jpg_s960x960&_nc_cat=108&ccb=1-7&_nc_sid=75d36f&_nc_ohc=GY9LwEPT93gQ7kNvgHltEQe&_nc_zt=23&_nc_ht=scontent.fsyd14-1.fna&_nc_gid=APnYFltr29MYoFJQyVlY7HF&oh=00_AYBAaye3BXFt34mnbEi4ERpy1XmUYCTEbpzSqL1xa_xLsA&oe=6713AF65',
176-
link: 'https://www.facebook.com/events/1106870833796065',
177-
},
178-
{
179-
title: 'Cultural BBQ',
180-
startTime: 'Wednesday, 17 July 2024 12:00:00',
181-
endTime: 'Wednesday, 17 July 2024 14:00:00',
182-
location: 'Globe Lawn',
183-
description: 'Tired of eating the same food every week? 😔 Looking to expand your horizons and try some cultural food? 🥘 BROKE AND NEED SOMETHING TO EAT ⁉️⁉️ Well CSESoc has you covered with an upgrade to our weekly bbq🍖🌟',
184-
image: 'https://scontent.fsyd14-1.fna.fbcdn.net/v/t39.30808-6/450318124_983296013580010_564345365632281594_n.jpg?stp=dst-jpg_s960x960&_nc_cat=109&ccb=1-7&_nc_sid=75d36f&_nc_ohc=bpVcbawdlHUQ7kNvgFOoHVZ&_nc_zt=23&_nc_ht=scontent.fsyd14-1.fna&_nc_gid=AHXSpjSIF8pprA1p1Ogqi34&oh=00_AYD1_PrwM7LTFVCvhXIQ3kubwhhYkBOmIO49Gpy4bvTdEg&oe=67139777',
185-
link: 'https://www.facebook.com/events/871196261705246',
186-
},
187-
{
188-
title: 'CSESOC Boardgames Night',
189-
startTime: 'Thursday, 7 March 2024 17:00:00',
190-
endTime: 'Thursday, 7 March 2024 19:00:00',
191-
location: 'Design Next Studio, Level 5, J17, UNSW',
192-
description: 'The whirlwind of uni got u overwhelmed 😣? Come down to the Design Studio, and chill out with us 🧘‍♀️ as we play board games and indulge in free pizza 🍕!',
193-
image: 'https://scontent.fsyd14-1.fna.fbcdn.net/v/t39.30808-6/429667295_896623802247232_669736057716718914_n.jpg?stp=dst-jpg_s960x960&_nc_cat=102&ccb=1-7&_nc_sid=75d36f&_nc_ohc=Ayn7Skl-pFAQ7kNvgES7wuB&_nc_zt=23&_nc_ht=scontent.fsyd14-1.fna&_nc_gid=AsnAjGmOe-G8q1L6qZb9G3U&oh=00_AYDpfvDY6DpKeydN99VCHujemmm0gZwL7_O1HjXHvwiPsw&oe=671383B1',
194-
link: 'https://www.facebook.com/events/322704110303236',
195-
}
196160
];

Diff for: frontend/src/components/Event/EventsCarousel.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export default function EventsCarousel() {
3535
containerClass="carousel-container my-8"
3636
>
3737
{events.map((event, index) => (
38-
<div key={index} className="w-full text-center">
38+
<div key={index} className="w-full text-center px-5">
3939
<a href={event.link} target="_blank" rel="noopener noreferrer" className="relative block w-full h-64 group transition-opacity duration-3000">
4040
<img
4141
src={event.image}

Diff for: frontend/src/components/Event/EventsGallery.tsx

+25-24
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,35 @@
11
import React from 'react';
22
import { previousEvents } from '../../../public/data/events';
3-
import { RowsPhotoAlbum } from "react-photo-album";
4-
import "react-photo-album/rows.css";
53

64
const EventGallery = () => {
7-
const formattedEvents = previousEvents.map((event) => {
8-
return {
9-
src: event.image,
10-
height: 80,
11-
width: 120,
12-
};
13-
});
145

156
return (
16-
<RowsPhotoAlbum
17-
photos={formattedEvents}
18-
render={{
19-
extras: (_, { index }) => (
20-
<div className="absolute inset-0 bg-black bg-opacity-60 opacity-0 hover:opacity-100 transition-opacity duration-300 flex items-center justify-center">
21-
<div className="text-white text-center p-4">
22-
<h2 className="font-extrabold text-xl mb-2">{previousEvents[index].title}</h2>
23-
<h3 className="font-bold text-lg">{previousEvents[index].location}</h3>
24-
<p className="mt-2">
25-
{formatEventDate(previousEvents[index].startTime, previousEvents[index].endTime)}
26-
</p>
7+
<div className="flex flex-wrap px-14 py-10 mb-14 gap-16 justify-center my-10">
8+
{previousEvents.map((event, index) => {
9+
return (
10+
<div>
11+
<div key={index} className="w-full h-40 text-center">
12+
<a href={event.link} target="_blank" rel="noopener noreferrer" className="relative block w-full h-64 group transition-opacity duration-3000">
13+
<img
14+
src={event.image}
15+
alt={event.title}
16+
className="w-full h-40 object-contain"
17+
/>
18+
<div className="w-full h-40 absolute inset-0 bg-black bg-opacity-60 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-center justify-center">
19+
<div className="text-white text-center p-4">
20+
<h2 className="font-extrabold text-xl mb-2">{event.title}</h2>
21+
<h3 className="font-bold text-lg">{event.location}</h3>
22+
<p className="mt-2">
23+
{formatEventDate(event.startTime, event.endTime)}
24+
</p>
25+
</div>
26+
</div>
27+
</a>
28+
</div>
2729
</div>
28-
</div>
29-
),
30-
}}
31-
/>
30+
);
31+
})}
32+
</div>
3233
);
3334
};
3435

Diff for: frontend/src/components/Event/index.tsx

+16-9
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,22 @@ const Event = () => {
1111
</div>
1212
<div className="flex items-center">
1313
<div className="flex flex-col text-center">
14-
<p className="text-center text-3xl">
15-
We run a wide-variety of events for fun, learning new skills and careers. For full
16-
listings, check out the CSESoc Discord or our Facebook page!
17-
</p>
18-
<a href="events">
19-
<button className="mt-10 bg-white border text-[#3977F8] border-[#A7A6E5] text-lg rounded-xl w-[60%] xl:h-12 h-10 hover-animate">
20-
See all events
21-
</button>
22-
</a>
14+
<p className="text-center text-3xl">
15+
We run a wide-variety of events for fun, learning new skills and careers. For full
16+
listings, check out the CSESoc Discord or our Facebook page!
17+
</p>
18+
<div>
19+
<a href="https://bit.ly/CSESocDiscord">
20+
<button className="mt-5 mx-5 bg-white border font-bold text-[#3977F8] border-[#A7A6E5] text-lg rounded-xl w-24 xl:h-12 h-10 hover-animate">
21+
Discord
22+
</button>
23+
</a>
24+
<a href="https://www.facebook.com/csesoc">
25+
<button className="mt-5 mx-5 bg-white border font-bold text-[#3977F8] border-[#A7A6E5] text-lg rounded-xl w-24 xl:h-12 h-10 hover-animate">
26+
FB
27+
</button>
28+
</a>
29+
</div>
2330
</div>
2431
</div>
2532
<div className="flex items-center justify-start mt-10">

0 commit comments

Comments
 (0)