Merge branch 'main' of https://github.com/software-community/BoST

package.json

@@ -9,6 +9,7 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@gsap/react": "^2.1.1",
     "@radix-ui/react-alert-dialog": "^1.1.1",
     "@radix-ui/react-dialog": "^1.0.5",
     "@radix-ui/react-dropdown-menu": "^2.0.6",
@@ -24,6 +25,7 @@
     "date-fns": "^3.6.0",
     "embla-carousel-react": "^8.1.5",
     "framer-motion": "^11.2.11",
+    "gsap": "^3.12.5",
     "html-react-parser": "^5.1.10",
     "lucide-react": "^0.379.0",
     "mongoose": "^8.4.0",

src/app/blogs/[blogid]/page.jsx

@@ -7,7 +7,7 @@ const page = async ({ params }) => {
   const blogDetails = await getBlogById(blogid);
   return <div className="min-h-[70vh] flex  flex-col gap-8 items-center py-8">
     <h1 className="w-full text-center text-3xl">{blogDetails.title}</h1>
-    <p className="w-4/5 text-xl max-w-[750px]">{parse(blogDetails.content)}</p>
+    <p className="w-4/5 text-xl max-w-[750px] blogcontent">{parse(blogDetails.content)}</p>
     <div className="flex items-center w-4/5  max-w-[750px] justify-between text-sm">
         <span className="bg-gray-300 p-1 sm:p-2 rounded-sm">Author: {blogDetails.author}</span>
         <span  className="bg-gray-300 p-1 sm:p-2 rounded-sm">Club: {blogDetails.club}</span>

src/app/error/page.jsx

@@ -11,24 +11,24 @@ const errorMap = {
       <code className="text-xs bg-slate-100 p-1 rounded-sm">Configuration</code>
     </p>
   ),
-  AccessDenied: "Access Denied. Try sigining in from different account Or",
+  AccessDenied: "Access Denied :( ",
 };
 
 export default function AuthErrorPage() {
   const search = useSearchParams();
   const error = search.get("error");
 
   return (
-    <div className="flex flex-col h-[90vh] gap-4 text-xl items-center justify-center w-full ">
-      <div className=" hover:cursor-pointer font-normal text-gray-700 dark:text-gray-400">
-        <Link className="underline" href="/api/auth/signin">
+    <div className="flex flex-col h-[90vh] gap-2 px-2 text-xl items-center justify-center w-full ">
+      <div className=" hover:cursor-pointer font-normal w-full text-center text-gray-700 dark:text-gray-400">
+        <Link className=" w-full text-2xl " href="/api/auth/signin">
           {" "}
           {errorMap[error] || "Please contact us if this error persists."}
         </Link>
       </div>
 
       <div className=" hover:cursor-pointer font-normal text-gray-700 dark:text-gray-400">
-        <Link href="/" className="underline">
+        <Link href="/" className="underline text-sm">
           Go Back to Home
         </Link>
       </div>

src/app/globals.css

@@ -21,3 +21,27 @@ body {
   font-weight: 400;
   font-style: normal;
 }
+.blogcontent>h1{
+  font-size: 26px;
+  font-weight: 800;
+}
+.blogcontent>h2{
+  font-size: 19px;
+  font-weight: 600;
+}
+.blogcontent>h3{
+  font-size: 16px;
+  font-weight: 400;
+}
+.blogcontent>h4{
+  font-size: 13px;
+  font-weight: 200;
+}
+.blogcontent>h5{
+  font-size: 10px;
+  font-weight: 150;
+}
+.blogcontent>p{
+  font-size: 13px;
+  font-weight: 100;
+}

src/auth.js

@@ -29,7 +29,8 @@ export const { handlers, signIn, signOut, auth } = NextAuth({
       if (account.provider == "google") {
         try {
           const { email, name, image, id } = user;
-          const found=allowedEmails.find((email)=>email===email)
+          const found=allowedEmails.find((allowedemail)=>allowedemail===email)
+          console.log("found mail",found)
 
           if(!found)return false;
 

src/components/Home/Hero.jsx

@@ -1,12 +1,13 @@
+
 export default function Hero() {
   return (
     <section className="w-full h-[90vh]  flex flex-col lg:flex-row justify-center items-center px-6">
       <div className="w-full lg:w-1/2 h-auto lg:h-full flex flex-col justify-center items-center">
-        <h1 className="w-full text-center font-bold text-5xl lg:text-7xl">BOST PORTAL</h1>
-        <p className="roboto-light text-xl lg:text-3xl">To manage all things Bost</p>
+        <h1 className="w-full text-center font-bold text-5xl lg:text-7xl LandingHeroTitle">BOST PORTAL</h1>
+        <p className="roboto-light text-xl lg:text-3xl LandingHeroSubtitle">To manage all things Bost</p>
       </div>
-      <div className="w-full lg:w-1/2  h-1/2 lg:h-full flex justify-center items-center">
-        <img src="./home/Globe.svg" className="object-cover h-3/5 " />{" "}
+      <div className="w-full lg:w-1/2  h-1/2 lg:h-full flex justify-center LandingHeroImage items-center">
+        <img src="./home/Globe.svg" className="object-cover Globe h-3/5 " />{" "}
       </div>
     </section>
   );

src/components/Navbar/Navbar.jsx

@@ -7,37 +7,45 @@ import Link from "next/link";
 import { handleLogin } from "@/app/actions/authentication";
 import Image from "next/image";
 import { usePathname, useRouter } from "next/navigation";
+import { useRef } from "react";
+import gsap from "gsap";
+import { useGSAP } from "@gsap/react";
+gsap.registerPlugin(useGSAP);
 
 export default function Navbar({ session }) {
   const pathname = usePathname();
   const [isSheetOpen, setIsSheetOpen] = useState(false);
+  const container = useRef();
 
   useEffect(() => {
     setIsSheetOpen(false);
   }, [pathname]);
 
-  // useEffect(() => {
-  //   const handleKeyDown = (event) => {
-  //     if (event.key === "L" || event.key === "l") {
-  //       handleLogin();
-  //     }
-  //   };
-
-  //   window.addEventListener("keydown", handleKeyDown);
-
-  //   return () => {
-  //     window.removeEventListener("keydown", handleKeyDown);
-  //   };
-  // }, []);
+  useGSAP(
+    () => {
+      gsap.from([".hamburger",".Logo"], { y:-50,
+        opacity:0,
+        duration:1
+      });
+      gsap.from([".Globe",".LandingHeroTitle",".LandingHeroSubtitle"], { opacity:0,
+        delay:1,
+        duration:1
+      });
+    },
+    {  }
+  );
 
   if (pathname.startsWith("/dashboard")) return null;
 
   return (
-    <header className="flex select-none  h-[10vh] bg-secondary w-full justify-between shrink-0 items-center px-4 md:px-6">
-      <Sheet open={isSheetOpen} onOpenChange={setIsSheetOpen}>
+    <header
+      // ref={container}
+      className="flex  select-none  h-[10vh] bg-secondary w-full justify-between shrink-0 items-center px-4 md:px-6"
+    >
+      <Sheet  open={isSheetOpen} onOpenChange={setIsSheetOpen}>
         <SheetTrigger asChild>
           <Button
-            className="lg:hidden  overflow-hidden p-0"
+            className="lg:hidden hamburger  overflow-hidden p-0"
             size="icon"
             variant="outline"
           >
@@ -75,10 +83,10 @@ export default function Navbar({ session }) {
           </div>
         </SheetContent>
       </Sheet>
-      <Link className="mr-6 hidden lg:flex" href="/">
+      <Link className="mr-6 Logo hidden lg:flex" href="/">
         <img src="/Logo.png" className=" h-[60px]"></img>
       </Link>
-      <nav className="ml-auto hidden lg:flex gap-6">
+      <nav className="ml-auto hidden hamburger  lg:flex gap-6">
         {session ? (
           <>
             <NavDropdown />
@@ -108,7 +116,7 @@ export default function Navbar({ session }) {
           </>
         )}
       </nav>
-      <Link href="/" className="lg:hidden">
+      <Link href="/" className="lg:hidden Logo">
         <img src="/Logo.png" className=" h-[60px]"></img>
       </Link>
     </header>
@@ -135,22 +143,3 @@ function MenuIcon(props) {
     </svg>
   );
 }
-
-function MountainIcon(props) {
-  return (
-    <svg
-      {...props}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      stroke="currentColor"
-      strokeWidth="2"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    >
-      <path d="m8 3 4 8 5-5 5 15H2L8 3z" />
-    </svg>
-  );
-}

src/components/editor.jsx

@@ -5,7 +5,6 @@ import "react-quill/dist/quill.snow.css";
 import parse from "html-react-parser";
 export default function Editor({value,setValue}) {
   // const [value, setValue] = useState("");
-  console.log(value)
   // Customize the toolbar options
   const modules = {
     toolbar: [
@@ -32,7 +31,7 @@ export default function Editor({value,setValue}) {
 
   return (
     <div className="flex flex-col bg-white">
-      <div className="w-full p-4">
+      <div className="w-full p-4 ">
         <ReactQuill
           theme="snow"
           value={value}