From 7f90047daaa24343f4236b59a72d1f72d8844965 Mon Sep 17 00:00:00 2001 From: Sristi Panchu Date: Fri, 3 May 2024 01:24:45 -0400 Subject: [PATCH 1/9] navbar fix --- lantern-club/src/components/Navbar.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/lantern-club/src/components/Navbar.tsx b/lantern-club/src/components/Navbar.tsx index 7436105..244b524 100644 --- a/lantern-club/src/components/Navbar.tsx +++ b/lantern-club/src/components/Navbar.tsx @@ -33,17 +33,17 @@ const NavBar = () => { ]; return ( -
+
- lantern logo + lantern logo
-
    +
      {links.map((link, index) => (
    • - + {link.label}
      • From 387f9868f2cbd2c99fc2f6bb73fb017314366078 Mon Sep 17 00:00:00 2001 From: Sristi Panchu Date: Fri, 3 May 2024 01:29:35 -0400 Subject: [PATCH 2/9] header done --- lantern-club/src/components/Header.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lantern-club/src/components/Header.tsx b/lantern-club/src/components/Header.tsx index 77253db..ad74d99 100644 --- a/lantern-club/src/components/Header.tsx +++ b/lantern-club/src/components/Header.tsx @@ -9,11 +9,11 @@ export default function Header({title}:{title:string}){
      - lantern logo + lantern logo
      -

      {title}

      +

      {title}

      - lantern logo + lantern logo
      From a9e6a0ff6528d9b51c70e21da9784fb88d13439f Mon Sep 17 00:00:00 2001 From: Sristi Panchu Date: Fri, 3 May 2024 01:39:12 -0400 Subject: [PATCH 3/9] about + dont know how to do fadeinfadeout comp --- lantern-club/src/components/Header.tsx | 4 +- .../src/components/about/AboutUsII.tsx | 4 +- .../src/components/about/AboutUsIII.tsx | 4 +- .../src/components/about/AboutUsIV.tsx | 2 +- .../components/about/FadeInOutComponent.tsx | 39 +++++++++++++++++++ 5 files changed, 45 insertions(+), 8 deletions(-) create mode 100644 lantern-club/src/components/about/FadeInOutComponent.tsx diff --git a/lantern-club/src/components/Header.tsx b/lantern-club/src/components/Header.tsx index ad74d99..1ffad3d 100644 --- a/lantern-club/src/components/Header.tsx +++ b/lantern-club/src/components/Header.tsx @@ -6,7 +6,6 @@ export default function Header({title}:{title:string}){ backgroundColor: "#FECB66", }; return( -
      lantern logo @@ -15,8 +14,7 @@ export default function Header({title}:{title:string}){
      lantern logo
      -
      -
      +
      diff --git a/lantern-club/src/components/about/AboutUsII.tsx b/lantern-club/src/components/about/AboutUsII.tsx index e190d49..1d19237 100644 --- a/lantern-club/src/components/about/AboutUsII.tsx +++ b/lantern-club/src/components/about/AboutUsII.tsx @@ -22,9 +22,9 @@ export default function AboutUsII() { }; return ( -
      +
      -

      Who are we?

      +

      Who are we?

      {/* First section */} diff --git a/lantern-club/src/components/about/AboutUsIII.tsx b/lantern-club/src/components/about/AboutUsIII.tsx index f66453c..8559ce0 100644 --- a/lantern-club/src/components/about/AboutUsIII.tsx +++ b/lantern-club/src/components/about/AboutUsIII.tsx @@ -26,8 +26,8 @@ export default function AboutUsIII() { return (
      -
      -

      What is STS?

      +
      +

      What is STS?

      diff --git a/lantern-club/src/components/about/AboutUsIV.tsx b/lantern-club/src/components/about/AboutUsIV.tsx index 395092c..08bc3a9 100644 --- a/lantern-club/src/components/about/AboutUsIV.tsx +++ b/lantern-club/src/components/about/AboutUsIV.tsx @@ -24,7 +24,7 @@ export default function AboutUsIV() { return (
      -

      Our Mission

      +

      Our Mission

      {/* Two boxes */}
      diff --git a/lantern-club/src/components/about/FadeInOutComponent.tsx b/lantern-club/src/components/about/FadeInOutComponent.tsx new file mode 100644 index 0000000..229c906 --- /dev/null +++ b/lantern-club/src/components/about/FadeInOutComponent.tsx @@ -0,0 +1,39 @@ +// FadeInOutCompoentn.tsx +import React, { ReactNode } from 'react'; +import { motion, useAnimation } from 'framer-motion'; +import { useInView } from 'react-intersection-observer'; + +const FadeInOutComponent = ({ children }: { children: ReactNode }) => { + const controls = useAnimation(); + const { ref, inView } = useInView({ + triggerOnce: false, // Set to true if you want the animation to occur only the first time the component comes into view + threshold: 0.01, // Adjust based on when you want the animation to trigger + }); + + React.useEffect(() => { + if (inView) { + controls.start('visible'); + } else { + controls.start('hidden'); + } + }, [controls, inView]); + + const variants = { + visible: { opacity: 1, scale: 1 }, + hidden: { opacity: 0, scale: 0.75 }, + }; + + return ( + + {children} + + ); +}; + +export default FadeInOutComponent; From a65ed3f2b42955695bb8526cbfaf0f8123240064 Mon Sep 17 00:00:00 2001 From: Sristi Panchu Date: Fri, 3 May 2024 09:49:35 -0400 Subject: [PATCH 4/9] about - resize & responsive --- lantern-club/src/components/Header.tsx | 8 ++++---- lantern-club/src/components/Navbar.tsx | 2 +- lantern-club/src/components/about/AboutUsII.tsx | 10 +++++----- lantern-club/src/components/about/AboutUsIII.tsx | 8 +++----- lantern-club/src/components/about/AboutUsIV.tsx | 2 +- .../src/components/about/FadeInOutComponent.tsx | 2 +- lantern-club/src/pages/AboutUs.tsx | 9 +++++---- lantern-club/src/styles/globals.css | 2 +- 8 files changed, 21 insertions(+), 22 deletions(-) diff --git a/lantern-club/src/components/Header.tsx b/lantern-club/src/components/Header.tsx index 1ffad3d..9a7a402 100644 --- a/lantern-club/src/components/Header.tsx +++ b/lantern-club/src/components/Header.tsx @@ -6,12 +6,12 @@ export default function Header({title}:{title:string}){ backgroundColor: "#FECB66", }; return( -
      -
      +
      +
      lantern logo
      -

      {title}

      -
      +

      {title}

      +
      lantern logo
      diff --git a/lantern-club/src/components/Navbar.tsx b/lantern-club/src/components/Navbar.tsx index 244b524..3efb909 100644 --- a/lantern-club/src/components/Navbar.tsx +++ b/lantern-club/src/components/Navbar.tsx @@ -33,7 +33,7 @@ const NavBar = () => { ]; return ( -
      +
      lantern logo diff --git a/lantern-club/src/components/about/AboutUsII.tsx b/lantern-club/src/components/about/AboutUsII.tsx index 1d19237..c749350 100644 --- a/lantern-club/src/components/about/AboutUsII.tsx +++ b/lantern-club/src/components/about/AboutUsII.tsx @@ -22,9 +22,9 @@ export default function AboutUsII() { }; return ( -
      -
      -

      Who are we?

      +//
      +
      +

      Who are we?

      {/* First section */} @@ -71,8 +71,8 @@ export default function AboutUsII() {
      -
      +//
      -
      +//
      ); } \ No newline at end of file diff --git a/lantern-club/src/components/about/AboutUsIII.tsx b/lantern-club/src/components/about/AboutUsIII.tsx index 8559ce0..6e8a181 100644 --- a/lantern-club/src/components/about/AboutUsIII.tsx +++ b/lantern-club/src/components/about/AboutUsIII.tsx @@ -25,15 +25,15 @@ export default function AboutUsIII() { }; return ( -
      -
      + +

      What is STS?

      Science, Technology & Society (STS) is an interdisciplinary field of study that seeks to explore and understand the many ways that modern science and technology shape modern culture, values, and institutions, and how modern values shape science and technology. STS examines how science and technology emerge, how they enter society, how they change through social processes, and how society changes in response to science and technology. (NC State University.)

      -
      +
      Background
      -
      -
      ); } \ No newline at end of file diff --git a/lantern-club/src/components/about/AboutUsIV.tsx b/lantern-club/src/components/about/AboutUsIV.tsx index 08bc3a9..44723ac 100644 --- a/lantern-club/src/components/about/AboutUsIV.tsx +++ b/lantern-club/src/components/about/AboutUsIV.tsx @@ -23,7 +23,7 @@ export default function AboutUsIV() { return (
      -
      +

      Our Mission

      {/* Two boxes */} diff --git a/lantern-club/src/components/about/FadeInOutComponent.tsx b/lantern-club/src/components/about/FadeInOutComponent.tsx index 229c906..e4a4857 100644 --- a/lantern-club/src/components/about/FadeInOutComponent.tsx +++ b/lantern-club/src/components/about/FadeInOutComponent.tsx @@ -29,7 +29,7 @@ const FadeInOutComponent = ({ children }: { children: ReactNode }) => { animate={controls} initial="hidden" variants={variants} - transition={{ duration: 0.5 }} + transition={{ duration: 0.38 }} > {children} diff --git a/lantern-club/src/pages/AboutUs.tsx b/lantern-club/src/pages/AboutUs.tsx index 360099a..0e4e236 100644 --- a/lantern-club/src/pages/AboutUs.tsx +++ b/lantern-club/src/pages/AboutUs.tsx @@ -6,6 +6,7 @@ import AboutUsII from "@/components/about/AboutUsII"; import AboutUsIII from "@/components/about/AboutUsIII"; import AboutUsIV from "@/components/about/AboutUsIV"; import Head from 'next/head'; +import FadeInOutComponent from '@/components/about/FadeInOutComponent'; export default function AboutUs() { @@ -15,10 +16,10 @@ export default function AboutUs() { About Us | The Lantern -
      - - - +
      + + +
      ); diff --git a/lantern-club/src/styles/globals.css b/lantern-club/src/styles/globals.css index a94afe0..13ffc41 100644 --- a/lantern-club/src/styles/globals.css +++ b/lantern-club/src/styles/globals.css @@ -120,7 +120,7 @@ body { } #header2-pent { - clip-path: polygon(0 0, 0 75%, 50% 100%, 100% 75%, 100% 0%); + clip-path: polygon(0 0, 0 70%, 50% 100%, 100% 70%, 100% 0%); } #pentagon3 { From 3b4b6964fad87b02b96489a09494b71b8d5f37aa Mon Sep 17 00:00:00 2001 From: Sristi Panchu Date: Fri, 3 May 2024 10:09:39 -0400 Subject: [PATCH 5/9] events - resize & responsive --- lantern-club/src/components/about/AboutUsII.tsx | 2 +- lantern-club/src/components/events/EventsI.tsx | 6 +++--- lantern-club/src/components/events/EventsII.tsx | 4 ++-- lantern-club/src/pages/Events.tsx | 11 ++++++----- 4 files changed, 12 insertions(+), 11 deletions(-) diff --git a/lantern-club/src/components/about/AboutUsII.tsx b/lantern-club/src/components/about/AboutUsII.tsx index c749350..60cdf7a 100644 --- a/lantern-club/src/components/about/AboutUsII.tsx +++ b/lantern-club/src/components/about/AboutUsII.tsx @@ -24,7 +24,7 @@ export default function AboutUsII() { return ( //
      -

      Who are we?

      +

      Who are we?

      {/* First section */} diff --git a/lantern-club/src/components/events/EventsI.tsx b/lantern-club/src/components/events/EventsI.tsx index a07ee6a..ad994ae 100644 --- a/lantern-club/src/components/events/EventsI.tsx +++ b/lantern-club/src/components/events/EventsI.tsx @@ -71,9 +71,9 @@ export default function EventsI({ session={session} setShowAddModal={setShowAddModal}/> ) : ( -
      +
      -

      +

      {session?.user.isAdmin && isAdminEdit ? "Edit Upcoming Events" : "Upcoming Events"} {session?.user.isAdmin && ( @@ -94,7 +94,7 @@ export default function EventsI({ ssr={true} infinite={true} keyBoardControl={true} - containerClass="carousel-container pt-12 pb-20 mx-auto md:px-16" + containerClass="carousel-container pt-2 pb-6 mx-auto md:px-16" itemClass="flex justify-center md:justify-start" arrows={true} > diff --git a/lantern-club/src/components/events/EventsII.tsx b/lantern-club/src/components/events/EventsII.tsx index 550a6d1..9ec6e19 100644 --- a/lantern-club/src/components/events/EventsII.tsx +++ b/lantern-club/src/components/events/EventsII.tsx @@ -77,8 +77,8 @@ export default function EventsII({ // ********* IS ADMIN EDIT BOOLEAN ******** return (
      -
      -

      +
      +

      {session?.user.isAdmin ? "Delete Past Events" : "Past Events"}

      diff --git a/lantern-club/src/pages/Events.tsx b/lantern-club/src/pages/Events.tsx index 1ef5153..604d5f9 100644 --- a/lantern-club/src/pages/Events.tsx +++ b/lantern-club/src/pages/Events.tsx @@ -8,6 +8,7 @@ import EventsI from "@/components/events/EventsI"; import EventsII from "@/components/events/EventsII"; import Head from 'next/head'; import { useSession } from "next-auth/react"; +import FadeInOutComponent from "@/components/about/FadeInOutComponent"; @@ -30,21 +31,21 @@ export default function Events({ events } : { events: EventType[]}) { Events | The Lantern -
      -
      + - + + />
      ); From d1a329dafb80bd6c589de060b28b3c24cf7e5eaf Mon Sep 17 00:00:00 2001 From: Sristi Panchu Date: Fri, 3 May 2024 10:21:52 -0400 Subject: [PATCH 6/9] mag page done --- .../components/magazine/MagazineDisplay.tsx | 68 +-------- .../components/magazine/MagazineDisplay2.tsx | 130 ++++++++++++++++++ lantern-club/src/pages/Magazine.tsx | 11 +- 3 files changed, 143 insertions(+), 66 deletions(-) create mode 100644 lantern-club/src/components/magazine/MagazineDisplay2.tsx diff --git a/lantern-club/src/components/magazine/MagazineDisplay.tsx b/lantern-club/src/components/magazine/MagazineDisplay.tsx index 2a39b6f..70cac7d 100644 --- a/lantern-club/src/components/magazine/MagazineDisplay.tsx +++ b/lantern-club/src/components/magazine/MagazineDisplay.tsx @@ -4,6 +4,8 @@ import Image from "next/image"; import Link from "next/link" import { useSession } from 'next-auth/react'; import extractFileNameFromURL from '@/utils/extractFileNameFromURL'; + +import FadeInOutComponent from "@/components/about/FadeInOutComponent"; // import Lantern from "../../images/bluelatern.png"; @@ -70,9 +72,9 @@ export default function MagazineDisplay ({ handleToggleAdminView, magazines }: M return (
      -
      -
      -

      Magazine Issues

      +
      +
      +

      Featured Issue

      {session?.user.isAdmin && (
      - - {/* triangle man */} -
      - - - {/* the blue guy */} - {/*
      */} -
      -
      - {/* left container */} -
      -

      Read Past Issues

      -
        - {magazines.map((url: string, index) => { - // Extract file name from the URL - // console.log("url: ", url); - let fileName = extractFileNameFromURL(url); - // const keyName = "uploads/" + url.substring(url.lastIndexOf('/') + 1); - // //const key = url.substring(url.lastIndexOf('/') + 1); - // let fileName = keyName.substring(keyName.indexOf('_') + 1); - // fileName = fileName.replace(/\.[^/.]+$/, ""); - - return ( -
      • - - {/* gets rid of the file extension */} -
        - - - {fileName} - - -
        - -
        • - ); - })} -
      -
      - {/* image side */} -
      -
      - submission poster -
      -
      - - - -
      - - - - -
      diff --git a/lantern-club/src/components/magazine/MagazineDisplay2.tsx b/lantern-club/src/components/magazine/MagazineDisplay2.tsx new file mode 100644 index 0000000..de43447 --- /dev/null +++ b/lantern-club/src/components/magazine/MagazineDisplay2.tsx @@ -0,0 +1,130 @@ +import { useEffect, useState } from 'react'; +import axios from 'axios'; +import Image from "next/image"; +import Link from "next/link" +import { useSession } from 'next-auth/react'; +import extractFileNameFromURL from '@/utils/extractFileNameFromURL'; + +import FadeInOutComponent from "@/components/about/FadeInOutComponent"; +// import Lantern from "../../images/bluelatern.png"; + + + +interface MagazineDisplayProps { + handleToggleAdminView: () => void + magazines: any[] + +} +export default function MagazineDisplay ({ handleToggleAdminView, magazines }: MagazineDisplayProps) { + const triangle: React.CSSProperties = { + backgroundColor: "#FECB66", + }; + const headerFont = { + fontFamily: 'coolvetica', + marginBottom: "3.5rem", + lineHeight: '1', + }; + const subheaderFont = { + fontFamily: 'nunito', + fontSize: '30px', + lineHeight: '1', + }; + + const { data: session } = useSession(); + + const [fileList, setFileList] = useState([]); + const [currentImage, setCurrentImage] = useState(''); + + const fetchFeatured = async () => { + try { + const response = await fetch("/api/content/magazine/featured", { method: "GET" }); + const data = await response.json(); + + if (!response.ok) { + throw new Error('Network response was not ok'); + } + // console.log(data); + return data[0]; + } catch (error) { + console.log("Error fetching featured mag:", error); + } + } + + useEffect(() => { + const fetchFileList = async () => { + try { + const response = await axios.get('/api/content/magazine/'); + setFileList(response.data.urls); + const featuredResponse = await fetch("/api/content/magazine/featured", { method: "GET" }); + const featuredData = await featuredResponse.json(); + if (featuredData.length > 0) { + const featured = featuredData[0].cloudURL; + setCurrentImage(featured); + } + + } catch (error) { + console.error('Error fetching file list:', error); + } + }; + + fetchFileList(); + }, []); + + return ( +
      +
      + {/* left container */} +
      +

      Read Past Issues

      +
        + {magazines.map((url: string, index) => { + // Extract file name from the URL + // console.log("url: ", url); + let fileName = extractFileNameFromURL(url); + // const keyName = "uploads/" + url.substring(url.lastIndexOf('/') + 1); + // //const key = url.substring(url.lastIndexOf('/') + 1); + // let fileName = keyName.substring(keyName.indexOf('_') + 1); + // fileName = fileName.replace(/\.[^/.]+$/, ""); + + return ( +
      • + + {/* gets rid of the file extension */} +
        + + + {fileName} + + +
        + +
        • + ); + })} +
      +
      + {/* image side */} +
      +
      + submission poster +
      +
      + + + +
      + + + +
      + + + ); + +} \ No newline at end of file diff --git a/lantern-club/src/pages/Magazine.tsx b/lantern-club/src/pages/Magazine.tsx index 5ea75e0..2661510 100644 --- a/lantern-club/src/pages/Magazine.tsx +++ b/lantern-club/src/pages/Magazine.tsx @@ -4,9 +4,11 @@ import NavBar from "@/components/Navbar"; import Footer from "@/components/Footer"; import MagazineAdmin from "@/components/magazine/MagazineAdmin"; import MagazineDisplay from "@/components/magazine/MagazineDisplay"; +import MagazineDisplay2 from "@/components/magazine/MagazineDisplay2"; import Header from "@/components/Header"; import axios from 'axios'; import Head from 'next/head'; +import FadeInOutComponent from "@/components/about/FadeInOutComponent"; // import { useSession } from 'next-auth/react'; @@ -43,14 +45,17 @@ export default function Magazine() { Magazine | The Lantern -
      +
      <> {magazineList ? ( // Render MagazineDisplay or MagazineAdmin based on showAdminView showAdminView ? ( - + ) : ( - + <> + + + ) ) : ( // Render a loading state while magazineList is being fetched From 5e5f10fdf588f431313e612e65ae9550ee815d56 Mon Sep 17 00:00:00 2001 From: Sristi Panchu Date: Fri, 3 May 2024 10:53:42 -0400 Subject: [PATCH 7/9] resources done --- .../src/components/resources/ResourcesII.tsx | 11 +++++------ .../src/components/resources/ResourcesIII.tsx | 12 ++++++------ lantern-club/src/pages/Resources.tsx | 7 ++++--- 3 files changed, 15 insertions(+), 15 deletions(-) diff --git a/lantern-club/src/components/resources/ResourcesII.tsx b/lantern-club/src/components/resources/ResourcesII.tsx index 11de4f5..58cd3c8 100644 --- a/lantern-club/src/components/resources/ResourcesII.tsx +++ b/lantern-club/src/components/resources/ResourcesII.tsx @@ -26,11 +26,10 @@ export default function ResourcesI() { }; return ( -
      -
      +
      {/* text side */}
      -

      +

      Our E-List

      @@ -45,18 +44,18 @@ export default function ResourcesI() {
      {/* Arrow */} -
      +
      arrow animation
      {/* Button */} +
      window.open('https://docs.google.com/forms/d/e/1FAIpQLScoIJSqdbxqKcswFmnCiFj65L2_P7dqogSpGLegc0EaORK9MA/viewform')} color="blue" width="w-48" /> +
      -
      -
      ); } diff --git a/lantern-club/src/components/resources/ResourcesIII.tsx b/lantern-club/src/components/resources/ResourcesIII.tsx index cd74167..aeeca91 100644 --- a/lantern-club/src/components/resources/ResourcesIII.tsx +++ b/lantern-club/src/components/resources/ResourcesIII.tsx @@ -13,10 +13,10 @@ export default function HomepageIII() { return (
      -
      +
      {/* text side */} -
      -

      +

      +

      What is the STS Department?

      @@ -41,7 +41,7 @@ export default function HomepageIII() { University)

      -
      +
      -
      +
      -
      +
      Resources | The Lantern -
      - - +
      + +