Accounts in PP and Notebook page

public/legal/privacy-policy.txt

@@ -1,7 +1,15 @@
+Analytics
+
 Our websites use Google Analytics to help us understand how visitors engage with our sites. Google Analytics collects non-identifiable data such as device type, browser information, and approximate location. This data helps us improve the experience of the websites.
 
 Google may process this information in accordance with its Privacy Policy available at https://www.google.com/analytics/terms/default.html.
 
 Users who do not wish to be tracked can install the Google Analytics Opt-out Browser Add-on (https://tools.google.com/dlpage/gaoptout) or disable cookies in their browser settings.
 
+Accounts and Authentication
+
+We offer account creation and sign-in using third-party authentication providers. When you choose to sign in using one of these services, we receive limited account information from the provider, such as your name, email address, and a unique profile identifier. We use this information solely to create and manage your account, authenticate you, and provide access to account-related features.
+
+We do not receive or store your passwords for third-party authentication services. The specific information shared depends on the authentication provider and your privacy settings with that provider. Information received through third-party authentication is handled in accordance with this Privacy Policy.
+
 For any privacy-related inquiries, please contact us at contact@utdnebula.com.

src/app/projects/notebook/page.tsx

@@ -0,0 +1,76 @@
+import Cover from '@/../public/projects/notebook/cover.png';
+import bookmark from '@/../public/projects/notebook/icons8-bookmark-100.png';
+import search from '@/../public/projects/notebook/icons8-search-100.png';
+import upload from '@/../public/projects/notebook/icons8-upload-100.png';
+import Project from '@/components/Project';
+import type { Metadata } from 'next';
+import React from 'react';
+
+export const metadata: Metadata = {
+  title: 'Notebook',
+  description:
+    'Discover and share course notes: The easiest way to exchange knowledge with your classmates.',
+  alternates: {
+    canonical: '/projects/notebook',
+  },
+};
+
+const features = [
+  {
+    title: 'Browse notes',
+    description:
+      'Miss class? Curious about how your classmates are taking notes? Filter by course and section to find relevant notes.',
+    img: {
+      src: search,
+      alt: 'magnifying glass',
+    },
+  },
+  {
+    title: 'Share your notes',
+    description:
+      'Help out your fellow students and give back to the community by posting your own notes for others to learn from.',
+    img: {
+      src: upload,
+      alt: 'share',
+    },
+  },
+  {
+    title: 'Save notes',
+    description:
+      "Really like another student's notes? Save your favorite notes to look back on whenever you need them.",
+    img: {
+      src: bookmark,
+      alt: 'bookmark',
+    },
+  },
+];
+
+export default function Notebook() {
+  return (
+    <Project
+      name={
+        <span className="flex flex-col items-center">
+          <span>NOTEBOOK</span>
+          <span className="font-main font-normal text-sm">In Development</span>
+        </span>
+      }
+      tagline={
+        <>
+          Discover and share
+          <br />
+          course notes
+        </>
+      }
+      description="The easiest way to exchange knowledge with your classmates."
+      cover={{
+        src: Cover,
+        alt: 'Notebook screenshot',
+      }}
+      projectLink="https://notebook.utdnebula.com/"
+      featuresDescription="Browse and save your classmates' notes to study later, and give back to your campus community by sharing your notes."
+      features={features}
+      learnMoreLink="https://github.com/UTDNebula/utd-notebook"
+      repos="utd-notebook"
+    />
+  );
+}

src/components/Footer.tsx

@@ -50,6 +50,9 @@ export default function Footer() {
           <Link className={linkClasses} href="/projects/api">
             API & Platform
           </Link>
+          <Link className={linkClasses} href="/projects/notebook">
+            Notebook
+          </Link>
           <Link className={linkClasses} href="/projects/planner">
             Planner
           </Link>

src/components/Navbar.tsx

@@ -6,6 +6,7 @@ import FilledChevronUpWhite from '@/../public/icons/filled-chevron-up-white.svg'
 import Map from '@/../public/icons/map.svg';
 import HamburgerRoyal from '@/../public/icons/menu-royal.svg';
 import HamburgerWhite from '@/../public/icons/menu-white.svg';
+import Notebook from '@/../public/icons/notebook.svg';
 import Pencil from '@/../public/icons/pencil.svg';
 import Puzzle from '@/../public/icons/puzzle.svg';
 import Star from '@/../public/icons/star.svg';
@@ -94,6 +95,12 @@ const parentItems: Array<ParentItem> = [
           '+ years of historical UTD data into your applications',
         iconSrc: Puzzle,
       },
+      {
+        name: 'Notebook',
+        link: '/projects/notebook',
+        description: 'Discover and share course notes',
+        iconSrc: Notebook,
+      },
       {
         name: 'Planner',
         link: '/projects/planner',

src/components/Projects.tsx

@@ -2,6 +2,7 @@
 
 import FilledChevronUp from '@/../public/icons/filled-chevron-up-white.svg';
 import Clubs from '@/../public/projects/clubs.png';
+import Notebook from '@/../public/projects/notebook.png';
 import Planner from '@/../public/projects/planner.png';
 import Rooms from '@/../public/projects/rooms.png';
 import Trends from '@/../public/projects/trends.png';
@@ -63,6 +64,16 @@ const PROJECTS_INFO: Project[] = [
     alt: '',
     color: '#FF6B4A',
   },
+  {
+    title: 'Notebook',
+    shortName: 'Notebook',
+    description:
+      "Notebook is a note-sharing platform that allows students to upload their notes to share with their classmates and save others' notes that they find useful. Currently in development.",
+    url: '/projects/notebook',
+    image: Notebook,
+    alt: '',
+    color: '#523DFF',
+  },
   {
     title: 'Planner',
     shortName: 'Planner',
@@ -108,19 +119,19 @@ export default function Projects() {
         <div className="shrink-0 flex flex-col justify-center lg:scale-[calc(1/1.15)] scale-[calc(1/2)] h-min w-full">
           <div className="text-center flex flex-col items-center">
             <h3 className="text-2xl md:text-4xl text-white">Check Out Our</h3>
-            <h1 className="font-display md:text-7xl text-4xl font-bold text-transparent w-min bg-clip-text bg-linear-to-r from-[#6166FA] via-[#C2C9FF] to-[#FE8164]">
+            <h1 className="pb-2 font-display md:text-7xl text-4xl font-bold text-transparent w-min bg-clip-text bg-linear-to-r from-[#6166FA] via-[#C2C9FF] to-[#FE8164]">
               Projects
             </h1>
           </div>
-          <div className="text-center pt-4 text-white px-4">
+          <div className="text-center pt-2 text-white px-4">
             <p>Check out what we have been creating in our lab up in the galaxy</p>
           </div>
-          <div className="gap-8 grid-cols-5 mx-auto pt-6 text-white hidden lg:grid">
+          <div className="gap-8 grid-cols-6 mx-auto pt-6 text-white hidden lg:grid">
             {PROJECTS_INFO.map((project, index) => (
               <button
                 type="button"
                 key={`project-selector-${index}`}
-                className={`hover:scale-105 active:scale-95 transition flex h-16 px-10 justify-center items-center rounded-full cursor-pointer ${
+                className={`hover:scale-105 active:scale-95 transition flex h-16 px-8 justify-center items-center rounded-full cursor-pointer ${
                   selected === index ? 'bg-[#6166FA] border-black' : 'border-white'
                 } transition duration-300 ease-in-out border-2`}
                 onClick={() => {