Skip to content

Commit b69eda2

Browse files
ArpitKhatri1ArpitKhatri1
committed
added gallery page
1 parent d2f10cd commit b69eda2

19 files changed

+696
-3
lines changed

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@
3030
"react-dom": "^18.3.1",
3131
"react-hook-form": "^7.54.2",
3232
"react-icons": "^5.5.0",
33+
"react-photo-collage": "^1.0.9",
3334
"react-responsive": "^10.0.0",
3435
"reactflow": "^11.11.4",
3536
"sheet": "^0.2.0",

‎pnpm-lock.yaml

Lines changed: 501 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎public/gallery/a2023-1.jpg

126 KB
Loading

‎public/gallery/a2023-2.webp

110 KB
Binary file not shown.

‎public/gallery/a2023-3.jpg

131 KB
Loading

‎public/gallery/a2023-4.jpg

149 KB
Loading

‎public/gallery/a2023-5.webp

30.4 KB
Binary file not shown.

‎public/gallery/a2023-6.webp

38.3 KB
Binary file not shown.

‎public/gallery/ap2024-1.webp

93.3 KB
Binary file not shown.

‎public/gallery/ap2024-2.webp

81.6 KB
Binary file not shown.

‎public/gallery/q2023-1.webp

41.7 KB
Binary file not shown.

‎public/gallery/q2023-2.webp

31.7 KB
Binary file not shown.

‎public/gallery/q2023-3.webp

29.8 KB
Binary file not shown.

‎public/gallery/quant2024-1.webp

113 KB
Binary file not shown.

‎public/gallery/quant2024-2.webp

132 KB
Binary file not shown.

‎public/gallery/quant2024-3.webp

158 KB
Binary file not shown.

‎public/gallery/quant2024-4.webp

93.8 KB
Binary file not shown.

‎src/app/gallery/page.tsx

Lines changed: 193 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,199 @@
1+
import ResourceNavbar from '@/components/resources/r-nav'
12
import React from 'react'
2-
3+
import { ReactPhotoCollage } from "react-photo-collage";
4+
import Image from 'next/image';
35
const GalleryPage = () => {
6+
47
return (
5-
<div className='h-full'>GalleryPage</div>
8+
<div className="w-full flex min-h-full items-center justify-center mb-32">
9+
<div className=" w-full max-w-[1000px] flex items-center flex-col justify-center px-3">
10+
<ResourceNavbar />
11+
<div className="text-4xl">Gallery</div>
12+
13+
<div className="max-w-7xl mx-auto px-4 py-8">
14+
<h1 className="text-3xl font-bold mb-1">Quantaculus 2024</h1>
15+
<p className="text-gray-600 mb-8">6th April, 2023</p>
16+
17+
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
18+
<div className="overflow-hidden h-[306px]">
19+
<Image
20+
src="/gallery/quant2024-1.webp"
21+
alt="Person writing on blackboard"
22+
width={600}
23+
height={400}
24+
layout='responsive'
25+
className="w-auto h-full object-scale-down"
26+
/>
27+
</div>
28+
29+
<div className="overflow-hidden">
30+
<Image
31+
src="/gallery/quant2024-2.webp"
32+
alt="Group photo of participants"
33+
width={600}
34+
height={400}
35+
className="w-full h-auto object-cover"
36+
/>
37+
</div>
38+
39+
<div className="overflow-hidden">
40+
<Image
41+
src="/gallery/quant2024-3.webp"
42+
alt="Small group sitting in auditorium"
43+
width={600}
44+
height={400}
45+
className="w-full h-auto object-cover"
46+
/>
47+
</div>
48+
49+
<div className="overflow-hidden">
50+
<Image
51+
src="/gallery/quant2024-4.webp"
52+
alt="Presentation in classroom"
53+
width={600}
54+
height={400}
55+
className="w-full h-auto object-cover"
56+
/>
57+
</div>
58+
</div>
59+
</div>
60+
61+
<div className="max-w-7xl mx-auto px-4 py-8">
62+
<h1 className="text-3xl font-bold mb-1">APOGEE 2024 Snaps</h1>
63+
<p className="text-gray-600 mb-8">30th March, 2023</p>
64+
65+
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
66+
<div className="overflow-hidden ">
67+
<Image
68+
src="/gallery/ap2024-1.webp"
69+
alt="Person writing on blackboard"
70+
width={600}
71+
height={200}
72+
className="w-full h-full object-cover"
73+
/>
74+
</div>
75+
76+
<div className="overflow-hidden">
77+
<Image
78+
src="/gallery/ap2024-2.webp"
79+
alt="Group photo of participants"
80+
width={600}
81+
height={400}
82+
className="w-full h-auto object-cover"
83+
/>
84+
</div>
85+
86+
</div>
87+
</div>
88+
89+
<div className="max-w-7xl mx-auto px-4 py-8">
90+
<h1 className="text-3xl font-bold mb-1">Quantaculus 2023</h1>
91+
<p className="text-gray-600 mb-8">2nd April, 2023</p>
92+
93+
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
94+
<div className="overflow-hidden h-[306px]">
95+
<Image
96+
src="/gallery/q2023-1.webp"
97+
alt="Person writing on blackboard"
98+
width={600}
99+
height={400}
100+
layout='responsive'
101+
className="w-auto h-full object-scale-down"
102+
/>
103+
</div>
104+
105+
<div className="overflow-hidden">
106+
<Image
107+
src="/gallery/q2023-2.webp"
108+
alt="Group photo of participants"
109+
width={600}
110+
height={400}
111+
className="w-full h-auto object-cover"
112+
/>
113+
</div>
114+
115+
<div className="overflow-hidden">
116+
<Image
117+
src="/gallery/q2023-3.webp"
118+
alt="Small group sitting in auditorium"
119+
width={600}
120+
height={400}
121+
className="w-full h-auto object-cover"
122+
/>
123+
</div>
124+
125+
</div>
126+
</div>
127+
128+
<div className="max-w-7xl mx-auto px-4 py-8">
129+
<h1 className="text-3xl font-bold mb-1">APOGEE 2023 Snaps</h1>
130+
<p className="text-gray-600 mb-8">26th March, 2023</p>
131+
132+
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
133+
<div className="overflow-hidden h-[306px]">
134+
<Image
135+
src="/gallery/a2023-1.jpg"
136+
alt="Person writing on blackboard"
137+
width={600}
138+
height={400}
139+
layout='responsive'
140+
className="w-full h-full object-contain"
141+
/>
142+
</div>
143+
144+
<div className="overflow-hidden">
145+
<Image
146+
src="/gallery/a2023-2.webp"
147+
alt="Group photo of participants"
148+
width={600}
149+
height={400}
150+
className="w-full h-auto object-cover"
151+
/>
152+
</div>
153+
<div className="overflow-hidden">
154+
<Image
155+
src="/gallery/a2023-3.jpg"
156+
alt="Small group sitting in auditorium"
157+
width={600}
158+
height={400}
159+
className="w-full h-auto object-cover"
160+
/>
161+
</div>
162+
163+
<div className="overflow-hidden">
164+
<Image
165+
src="/gallery/a2023-4.jpg"
166+
alt="Presentation in classroom"
167+
width={600}
168+
height={400}
169+
className="w-full h-auto object-cover"
170+
/>
171+
</div>
172+
<div className="overflow-hidden">
173+
<Image
174+
src="/gallery/a2023-5.webp"
175+
alt="Small group sitting in auditorium"
176+
width={600}
177+
height={400}
178+
className="w-full h-auto object-cover"
179+
/>
180+
</div>
181+
182+
<div className="overflow-hidden">
183+
<Image
184+
src="/gallery/a2023-6.webp"
185+
alt="Presentation in classroom"
186+
width={600}
187+
height={400}
188+
className="w-full h-auto object-cover"
189+
/>
190+
</div>
191+
</div>
192+
</div>
193+
194+
</div>
195+
196+
</div>
6197
)
7198
}
8199

‎src/components/events-page/ImageCrouselVertical.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export default function ImageCarouselVertical({ event }: { event: EventType }) {
3535
const resources = ["resource1", "resource2", "resource3"]
3636

3737
return (
38-
<div className=''>
38+
<div className='overflow-x-hidden'>
3939
<div className='relative bg-[#f2f2f2] p-5 pb-16 h-auto rounded-xl border-2'>
4040
<div>
4141
<Carousel className='space-y-10 static' setApi={setApi}>

0 commit comments

Comments
 (0)