added some photos

ShiwangPande · Mar 4, 2024 · 910f202 · 910f202
1 parent 44484df
commit 910f202
Show file tree

Hide file tree

Showing 9 changed files with 463 additions and 0 deletions.
diff --git a/src/components/Gallery.js b/src/components/Gallery.js
@@ -20,6 +20,11 @@ import NavBar from './Navbar';
 import photo6 from "./Photo6";
 import photo7 from "./Photo7";
 import photo8 from "./Photo8";
+import photo9 from "./Photo9";
+import photo10 from "./Photo10";
+import photo11 from "./Photo11";
+import photo12 from "./Photo12";
+import photo13 from "./Photo13";
 
 const slides = photos.map(({ src, width, height, images }) => ({
     src,
@@ -111,6 +116,56 @@ const slides8 = photo8.map(({ src, width, height, images }) => ({
         height: image.height,
     })),
 }));
+const slides9 = photo9.map(({ src, width, height, images }) => ({
+    src,
+    width,
+    height,
+    srcSet: images.map((image) => ({
+        src: image.src,
+        width: image.width,
+        height: image.height,
+    })),
+}));
+const slides10 = photo10.map(({ src, width, height, images }) => ({
+    src,
+    width,
+    height,
+    srcSet: images.map((image) => ({
+        src: image.src,
+        width: image.width,
+        height: image.height,
+    })),
+}));
+const slides11 = photo11.map(({ src, width, height, images }) => ({
+    src,
+    width,
+    height,
+    srcSet: images.map((image) => ({
+        src: image.src,
+        width: image.width,
+        height: image.height,
+    })),
+}));
+const slides12 = photo12.map(({ src, width, height, images }) => ({
+    src,
+    width,
+    height,
+    srcSet: images.map((image) => ({
+        src: image.src,
+        width: image.width,
+        height: image.height,
+    })),
+}));
+const slides13 = photo13.map(({ src, width, height, images }) => ({
+    src,
+    width,
+    height,
+    srcSet: images.map((image) => ({
+        src: image.src,
+        width: image.width,
+        height: image.height,
+    })),
+}));
 
 function Gallery() {
     const [index, setIndex] = useState(-1);
@@ -122,6 +177,11 @@ function Gallery() {
     const [index6, setIndex6] = useState(-1);
     const [index7, setIndex7] = useState(-1);
     const [index8, setIndex8] = useState(-1);
+    const [index9, setIndex9] = useState(-1);
+    const [index10, setIndex10] = useState(-1);
+    const [index11, setIndex11] = useState(-1);
+    const [index12, setIndex12] = useState(-1);
+    const [index13, setIndex13] = useState(-1);
     const [loading, setLoading] = useState(false);
     useEffect(() => {
         setLoading(true);
@@ -292,6 +352,92 @@ function Gallery() {
                         close={() => setIndex8(-1)}
                         plugins={[Fullscreen, Slideshow, Thumbnails, Zoom]}
                     />
+                    <div className="mt-5" style={{ backgroundColor: 'rgb(57 62 70)', color: "#eeeeee" }}>
+                        <h2 id='Thermal-PowerPlant' className="py-3 col-md-9  m-auto fw-bolder d-flex align-items-center justify-content-center" >Insights Of Semiconductor Industry</h2>
+                    </div>
+                    <Container className='p-3'>
+                        <PhotoAlbum
+                            photos={photo9}
+                            layout="rows"
+                            targetRowHeight={150}
+                            onClick={(event, photo, index9) => setIndex9(index9)}
+                        /></Container>
+                    <Lightbox
+                        slides={slides9}
+                        open={index9 >= 0}
+                        index={index9}
+                        close={() => setIndex9(-1)}
+                        plugins={[Fullscreen, Slideshow, Thumbnails, Zoom]}
+                    />
+                    <div className="mt-5" style={{ backgroundColor: 'rgb(57 62 70)', color: "#eeeeee" }}>
+                        <h2 id='Thermal-PowerPlant' className="py-3 col-md-9  m-auto fw-bolder d-flex align-items-center justify-content-center" >Seminar on Skill development and career opportunities in steam boiler</h2>
+                    </div>
+                    <Container className='p-3'>
+                        <PhotoAlbum
+                            photos={photo10}
+                            layout="rows"
+                            targetRowHeight={150}
+                            onClick={(event, photo, index10) => setIndex10(index10)}
+                        /></Container>
+                    <Lightbox
+                        slides={slides10}
+                        open={index10 >= 0}
+                        index={index10}
+                        close={() => setIndex10(-1)}
+                        plugins={[Fullscreen, Slideshow, Thumbnails, Zoom]}
+                    />
+                    <div className="mt-5" style={{ backgroundColor: 'rgb(57 62 70)', color: "#eeeeee" }}>
+                        <h2 id='Thermal-PowerPlant' className="py-3 col-md-9  m-auto fw-bolder d-flex align-items-center justify-content-center" >Innovative Manufacturing Process in Automotive Industry</h2>
+                    </div>
+                    <Container className='p-3'>
+                        <PhotoAlbum
+                            photos={photo11}
+                            layout="rows"
+                            targetRowHeight={150}
+                            onClick={(event, photo, index11) => setIndex11(index11)}
+                        /></Container>
+                    <Lightbox
+                        slides={slides11}
+                        open={index11 >= 0}
+                        index={index11}
+                        close={() => setIndex11(-1)}
+                        plugins={[Fullscreen, Slideshow, Thumbnails, Zoom]}
+                    />
+
+                    <div className="mt-5" style={{ backgroundColor: 'rgb(57 62 70)', color: "#eeeeee" }}>
+                        <h2 id='Thermal-PowerPlant' className="py-3 col-md-9  m-auto fw-bolder d-flex align-items-center justify-content-center" >Tertiary Graduation Ceremony (passes year 2022)</h2>
+                    </div>
+                    <Container className='p-3'>
+                        <PhotoAlbum
+                            photos={photo12}
+                            layout="rows"
+                            targetRowHeight={150}
+                            onClick={(event, photo, index12) => setIndex12(index12)}
+                        /></Container>
+                    <Lightbox
+                        slides={slides12}
+                        open={index12 >= 0}
+                        index={index12}
+                        close={() => setIndex12(-1)}
+                        plugins={[Fullscreen, Slideshow, Thumbnails, Zoom]}
+                    />
+                    <div className="mt-5" style={{ backgroundColor: 'rgb(57 62 70)', color: "#eeeeee" }}>
+                        <h2 id='Thermal-PowerPlant' className="py-3 col-md-9  m-auto fw-bolder d-flex align-items-center justify-content-center" >Drishti 2k23</h2>
+                    </div>
+                    <Container className='p-3'>
+                        <PhotoAlbum
+                            photos={photo13}
+                            layout="rows"
+                            targetRowHeight={150}
+                            onClick={(event, photo, index13) => setIndex13(index13)}
+                        /></Container>
+                    <Lightbox
+                        slides={slides13}
+                        open={index13 >= 0}
+                        index={index13}
+                        close={() => setIndex13(-1)}
+                        plugins={[Fullscreen, Slideshow, Thumbnails, Zoom]}
+                    />
 
                     <div className="mt-5" style={{ backgroundColor: 'rgb(57 62 70)', color: "#eeeeee" }}>
                         <h2 id='Thermal-PowerPlant' className="py-3 col-md-9  m-auto fw-bolder d-flex align-items-center justify-content-center" >Previous Year Events</h2>

diff --git a/src/components/Photo10.js b/src/components/Photo10.js
@@ -0,0 +1,53 @@
+const breakpoints = [3840, 2400, 1080, 640, 384, 256, 128, 96, 64, 48];
+
+const Steam = (id: string, width: number, height: number) =>
+    `https://i.postimg.cc/${id}`;
+const SteamPhoto = [
+
+
+    { id: "R0G507Jy/steamboiler1.webp", width: 1080, height: 780 },
+    { id: "0Ntk4Rnz/steamboiler10.webp", width: 1080, height: 780 },
+    { id: "tTYqQSv2/steamboiler11.webp", width: 780, height: 1080 },
+    { id: "qRSkks90/steamboiler12.webp", width: 1080, height: 780 },
+    { id: "gk9YQKVH/steamboiler13.webp", width: 1080, height: 780 },
+    { id: "CLjFgfJT/steamboiler14.webp", width: 1080, height: 780 },
+    { id: "JzxMyV9p/steamboiler15.webp", width: 1080, height: 780 },
+    { id: "JzMR44dy/steamboiler16.webp", width: 1080, height: 780 },
+    { id: "SKt4rLQ8/steamboiler17.webp", width: 1080, height: 780 },
+    { id: "nzyJ8HDh/steamboiler18.webp", width: 1080, height: 780 },
+    { id: "26bDXq3t/steamboiler19.webp", width: 1080, height: 780 },
+    { id: "x8JWgBpV/steamboiler2.webp", width: 1080, height: 780 },
+    { id: "s2ffKDYF/steamboiler3.webp", width: 1080, height: 780 },
+    { id: "SQnswswk/steamboiler4.webp", width: 1080, height: 780 },
+    { id: "ZYXRZmS3/steamboiler5.webp", width: 1080, height: 780 },
+    { id: "0y02pJJd/steamboiler6.webp", width: 1080, height: 780 },
+    { id: "x121JPq1/steamboiler7.webp", width: 1080, height: 780 },
+    { id: "RVf0ZYSY/steamboiler8.webp", width: 1080, height: 780 },
+    { id: "2ysgtTgb/steamboiler9.webp", width: 780, height: 1080 },
+
+
+];
+
+
+
+
+const photos = SteamPhoto.map((photo) => {
+    const width = breakpoints[0];
+    const height = (photo.height / photo.width) * width;
+
+    return {
+        src: Steam(photo.id, width, height),
+        width,
+        height,
+        images: breakpoints.map((breakpoint) => {
+            const height = Math.round((photo.height / photo.width) * breakpoint);
+            return {
+                src: Steam(photo.id, breakpoint, height),
+                width: breakpoint,
+                height,
+            };
+        }),
+    };
+});
+
+export default photos;
diff --git a/src/components/Photo11.js b/src/components/Photo11.js
@@ -0,0 +1,44 @@
+const breakpoints = [3840, 2400, 1080, 640, 384, 256, 128, 96, 64, 48];
+
+const Innovative = (id: string, width: number, height: number) =>
+    `https://i.postimg.cc/${id}`;
+const InnovativePhoto = [
+
+
+    { id: "2SmtM00v/innovative1.webp", width: 780, height: 1080 },
+    { id: "6p9HYyQf/innovative10.webp", width: 1080, height: 780 },
+    { id: "3xnt6Y45/innovative11.webp", width: 1080, height: 780 },
+    { id: "Z5cQS6QQ/innovative2.webp", width: 1080, height: 780 },
+    { id: "7h0BQz7m/innovative3.webp", width: 1080, height: 780 },
+    { id: "Kv7qPnmY/innovative4.webp", width: 1080, height: 780 },
+    { id: "cHV9mhKv/innovative5.webp", width: 1080, height: 780 },
+    { id: "4dK2Vq3C/innovative6.webp", width: 1080, height: 780 },
+    { id: "yYCp3f45/innovative7.webp", width: 1080, height: 780 },
+    { id: "zDgPfsMK/innovative8.webp", width: 1080, height: 780 },
+    { id: "N0CPyBB7/innovative9.webp", width: 1080, height: 780 },
+
+];
+
+
+
+
+const photos = InnovativePhoto.map((photo) => {
+    const width = breakpoints[0];
+    const height = (photo.height / photo.width) * width;
+
+    return {
+        src: Innovative(photo.id, width, height),
+        width,
+        height,
+        images: breakpoints.map((breakpoint) => {
+            const height = Math.round((photo.height / photo.width) * breakpoint);
+            return {
+                src: Innovative(photo.id, breakpoint, height),
+                width: breakpoint,
+                height,
+            };
+        }),
+    };
+});
+
+export default photos;
diff --git a/src/components/Photo12.js b/src/components/Photo12.js
@@ -0,0 +1,91 @@
+const breakpoints = [3840, 2400, 1080, 640, 384, 256, 128, 96, 64, 48];
+
+const Degree = (id: string, width: number, height: number) =>
+    `https://i.postimg.cc/${id}`;
+const DegreePhoto = [
+
+    { id: "t4yttT5t/degree1.webp", width: 1080, height: 780 },
+    { id: "Dw2L4Nvx/degree10.webp", width: 1080, height: 780 },
+    { id: "6pYRrhTt/degree11.webp", width: 1080, height: 780 },
+    { id: "8CcvtrrW/degree12.webp", width: 1080, height: 780 },
+    { id: "QMzTPxpz/degree13.webp", width: 1080, height: 780 },
+    { id: "85r6VQ4z/degree14.webp", width: 1080, height: 780 },
+    { id: "Zntyb7sF/degree15.webp", width: 1080, height: 780 },
+    { id: "G3Gy7R9M/degree16.webp", width: 1080, height: 780 },
+    { id: "1XGVfGLx/degree17.webp", width: 1080, height: 780 },
+    { id: "Hsm7FNyT/degree18.webp", width: 1080, height: 780 },
+    { id: "bNR2PRxk/degree19.webp", width: 1080, height: 780 },
+    { id: "FRfjsJrm/degree2.webp", width: 1080, height: 780 },
+    { id: "T37LLYHP/degree20.webp", width: 1080, height: 780 },
+    { id: "LsJqzKr3/degree21.webp", width: 1080, height: 780 },
+    { id: "W3rhHmpD/degree22.webp", width: 1080, height: 780},
+    { id: "cCSryK6F/degree23.webp", width: 1080, height: 780},
+    { id: "sx41VVhs/degree24.webp", width: 1080, height: 780},
+    { id: "8kR7dbn9/degree25.webp", width: 1080, height: 780},
+    { id: "qMpz1CPR/degree26.webp", width: 1080, height: 780 },
+    { id: "WbStC1V7/degree27.webp", width: 1080, height: 780},
+    { id: "htjhBRPR/degree28.webp",width: 1080, height: 780 },
+    { id: "sgNxfHvQ/degree29.webp",width: 780, height: 1080 },
+    { id: "R0Z7yD2W/degree3.webp", width: 1080, height: 780 },
+    { id: "8Cf57d6y/degree30.webp", width: 780, height: 1080 },
+    { id: "XqLNRQRv/degree31.webp", width: 780, height: 1080 },
+    { id: "1txzwg0y/degree32.webp", width: 1080, height: 780  },
+    { id: "cHQLmsTw/degree33.webp", width: 780, height: 1080 },
+    { id: "FzNsC2nq/degree34.webp", width: 780, height: 1080 },
+    { id: "66fQ4p8N/degree35.webp", width: 780, height: 1080 },
+    { id: "xTj1vVmN/degree36.webp", width: 780, height: 1080 },
+    { id: "02t2ZXGW/degree37.webp", width: 780, height: 1080 },
+    { id: "t4YRcd2X/degree38.webp", width: 780, height: 1080 },
+    { id: "7ZdPrCWS/degree39.webp", width: 780, height: 1080 },
+    { id: "k4kWVXGS/degree4.webp", width: 1080, height: 780 },
+    { id: "mr9LLbvJ/degree40.webp", width: 780, height: 1080 },
+    { id: "PxktNghx/degree41.webp", width: 780, height: 1080 },
+    { id: "W36sZ5b7/degree42.webp", width: 780, height: 1080 },
+    { id: "cCx0BfvG/degree43.webp", width: 780, height: 1080 },
+    { id: "Xqs3HX5G/degree44.webp", width: 780, height: 1080 },
+    { id: "Y2RpqDPr/degree45.webp", width: 780, height: 1080 },
+    { id: "fTbM3j4x/degree46.webp", width: 780, height: 1080 },
+    { id: "sgQymjgx/degree47.webp", width: 780, height: 1080 },
+    { id: "FHMvnMYZ/degree48.webp", width: 780, height: 1080 },
+    { id: "bJ8hq1HS/degree49.webp", width: 780, height: 1080 },
+    { id: "66vdkRbf/degree5.webp", width: 1080, height: 780 },
+    { id: "Zq6mkw3h/degree50.webp", width: 780, height: 1080 },
+    { id: "qRLdqgjb/degree51.webp", width: 780, height: 1080 },
+    { id: "59sVMYHj/degree52.webp", width: 780, height: 1080 },
+    { id: "fyqn7p4Y/degree53.webp", width: 780, height: 1080 },
+    { id: "x81VzYZ0/degree54.webp", width: 780, height: 1080 },
+    { id: "GpFWgHwL/degree55.webp", width: 1080, height: 780 },
+    { id: "jd9YLp4b/degree56.webp", width: 780, height: 1080 },
+    { id: "QtSRswdv/degree57.webp", width: 1080, height: 780 },
+    { id: "kG4L5sVG/degree58.webp", width: 1080, height: 780 },
+    { id: "VNZq8FcD/degree6.webp", width: 1080, height: 780 },
+    { id: "1XwwDhVj/degree7.webp", width: 1080, height: 780 },
+    { id: "CLpjS1WT/degree8.webp", width: 1080, height: 780 },
+    { id: "CLCb10gZ/degree9.webp", width: 1080, height: 780 },
+
+
+];
+
+
+
+
+const photos = DegreePhoto.map((photo) => {
+    const width = breakpoints[0];
+    const height = (photo.height / photo.width) * width;
+
+    return {
+        src: Degree(photo.id, width, height),
+        width,
+        height,
+        images: breakpoints.map((breakpoint) => {
+            const height = Math.round((photo.height / photo.width) * breakpoint);
+            return {
+                src: Degree(photo.id, breakpoint, height),
+                width: breakpoint,
+                height,
+            };
+        }),
+    };
+});
+
+export default photos;