diff --git a/components/About/about.js b/components/About/about.js index 2ff1a3b1..46362ab3 100644 --- a/components/About/about.js +++ b/components/About/about.js @@ -36,7 +36,7 @@ function About() { > - + @@ -46,4 +46,4 @@ function About() { ); } -export default About \ No newline at end of file +export default About diff --git a/components/Gallery/gallery.js b/components/Gallery/gallery.js new file mode 100644 index 00000000..6b2a38b6 --- /dev/null +++ b/components/Gallery/gallery.js @@ -0,0 +1,63 @@ +import LightGallery from 'lightgallery/react'; +import Heading from '../Typography/heading' +// import styles +import 'lightgallery/css/lightgallery.css'; +import 'lightgallery/css/lg-zoom.css'; +import 'lightgallery/css/lg-thumbnail.css'; +import 'lightgallery/css/lg-autoplay.css'; +import 'lightgallery/css/lg-fullscreen.css'; +import 'lightgallery/css/lg-share.css'; +import 'lightgallery/css/lg-rotate.css'; + + +// import plugins if you need +import lgThumbnail from 'lightgallery/plugins/thumbnail'; +import lgZoom from 'lightgallery/plugins/zoom'; +import lgAutoplay from 'lightgallery/plugins/autoplay' +import lgFullscreen from 'lightgallery/plugins/fullscreen'; +import lgShare from 'lightgallery/plugins/share'; +import lgRotate from 'lightgallery/plugins/rotate'; +import Button from '../Buttons/button'; + +const images = [ + { src: "/img/1.jpeg", alt: "1" }, + { src: "/img/2.jpeg", alt: "2" }, + { src: "/img/3.jpeg", alt: "3" }, + { src: "/img/4.jpeg", alt: "4", }, + { src: "/img/5.jpeg", alt: "5", }, + { src: "/img/6.jpeg", alt: "6", }, + +] + +function Gallery() { + const onInit = () => { + console.log('lightGallery has been initialized'); + }; + return ( +
+ + Our Past Event Gallery + + + + {images.map((image, index) => { + return ( + + {image.alt} + + ) + })} + + + + +
+ ); +} + +export default Gallery diff --git a/package-lock.json b/package-lock.json index a227c0b4..7b2d25a5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "axios": "^1.6.0", "d3": "^7.8.5", + "lightgallery": "^2.7.2", "next": "^12.0.0", "react": "^17.0.2", "react-confetti": "^6.1.0", @@ -3698,12 +3699,6 @@ "jiti": "bin/jiti.js" } }, - "node_modules/jquery": { - "version": "3.7.1", - "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz", - "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==", - "peer": true - }, "node_modules/js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", @@ -3830,6 +3825,14 @@ "node": ">= 0.8.0" } }, + "node_modules/lightgallery": { + "version": "2.7.2", + "resolved": "https://registry.npmjs.org/lightgallery/-/lightgallery-2.7.2.tgz", + "integrity": "sha512-Ewdcg9UPDqV0HGZeD7wNE4uYejwH2u0fMo5VAr6GHzlPYlhItJvjhLTR0cL0V1HjhMsH39PAom9iv69ewitLWw==", + "engines": { + "node": ">=6.0.0" + } + }, "node_modules/lilconfig": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz", @@ -4754,20 +4757,6 @@ "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.1.tgz", "integrity": "sha512-LNHI/Ll1UqBTGhrR6vMhtVZmX4kjYdCJUjIM6Ydp7/oJ5w1C0MKrzELuUAmMlU0eKwBGx6PaO0TRZ/KDXAFTBg==" }, - "node_modules/react-youtube-embed/node_modules/react": { - "version": "16.14.0", - "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz", - "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==", - "peer": true, - "dependencies": { - "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2" - }, - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/react-youtube-embed/node_modules/source-map": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", @@ -5688,20 +5677,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/typescript": { - "version": "5.2.2", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz", - "integrity": "sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==", - "dev": true, - "peer": true, - "bin": { - "tsc": "bin/tsc", - "tsserver": "bin/tsserver" - }, - "engines": { - "node": ">=14.17" - } - }, "node_modules/unbox-primitive": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz", diff --git a/package.json b/package.json index a7dc0577..813a7c0f 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "dependencies": { "axios": "^1.6.0", "d3": "^7.8.5", + "lightgallery": "^2.7.2", "next": "^12.0.0", "react": "^17.0.2", "react-confetti": "^6.1.0", diff --git a/pages/index.js b/pages/index.js index be4cdc2a..5d6f1968 100644 --- a/pages/index.js +++ b/pages/index.js @@ -10,6 +10,7 @@ import About from '../components/About/about'; import TicketCards from '../components/Cards/ticketCards'; import Heading from '../components/Typography/heading'; import Paragraph from '../components/Typography/paragraph'; +import Gallery from '../components/Gallery/gallery' export default function Home() { return ( @@ -46,6 +47,9 @@ export default function Home() {
+ ); } diff --git a/public/SponsorProspectus.pdf b/public/SponsorProspectus.pdf new file mode 100644 index 00000000..fd3e5561 Binary files /dev/null and b/public/SponsorProspectus.pdf differ diff --git a/public/img/1.jpeg b/public/img/1.jpeg new file mode 100644 index 00000000..ebe424e3 Binary files /dev/null and b/public/img/1.jpeg differ diff --git a/public/img/2.jpeg b/public/img/2.jpeg new file mode 100644 index 00000000..8bd00950 Binary files /dev/null and b/public/img/2.jpeg differ diff --git a/public/img/3.jpeg b/public/img/3.jpeg new file mode 100644 index 00000000..db989acd Binary files /dev/null and b/public/img/3.jpeg differ diff --git a/public/img/4.jpeg b/public/img/4.jpeg new file mode 100644 index 00000000..008451b8 Binary files /dev/null and b/public/img/4.jpeg differ diff --git a/public/img/5.jpeg b/public/img/5.jpeg new file mode 100644 index 00000000..145ba67f Binary files /dev/null and b/public/img/5.jpeg differ diff --git a/public/img/6.jpeg b/public/img/6.jpeg new file mode 100644 index 00000000..7023ecd3 Binary files /dev/null and b/public/img/6.jpeg differ diff --git a/public/img/faq.jpeg b/public/img/faq.jpeg new file mode 100644 index 00000000..797980cf Binary files /dev/null and b/public/img/faq.jpeg differ diff --git a/styles/globals.css b/styles/globals.css index 6d1d8e73..5dbfa16a 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -207,4 +207,9 @@ mix-blend-mode: lighten; .hoverEffect:hover { transform: scale(1.1); /* Scale the image by 10% on hover */ +} + +.lg-react-element { + column-count: 3; + column-gap: 10px; } \ No newline at end of file