Merge pull request #2 from fusion479/update

footer + metadata

src/app/about/page.tsx

@@ -2,8 +2,15 @@ import Hero from "./components/Hero";
 import Container from "@/components/Container";
 import Slider from "./components/Slider";
 import Team from "./components/Team";
-import Copyright from "@/components/Copyright";
+import Footer from "@/components/Footer";
 import Background from "@/components/Background";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "About | Stuy Fusion 479",
+  description:
+    "Meet our talented team of students from Stuyvesant High School. Although we all come from various backgrounds, our common interest in STEM brings us together. As a team, we are dedicated to exploring the exciting world of robotics and competing in the FIRST Tech Challenge.",
+};
 
 export default function About() {
   return (
@@ -14,7 +21,7 @@ export default function About() {
       <Slider />
       <Container className="relative mt-32">
         <Team />
-        <Copyright theme="dark" />
+        <Footer theme="dark" />
       </Container>
     </Background>
   );

src/app/components/Hero.tsx

@@ -23,10 +23,10 @@ export default function Hero() {
           <a href="https://www.youtube.com/@stuyfusion">
             <AiOutlineYoutube className="inline-block w-10 h-10 mt-8 text-gray-600 hover:text-gray-700 cursor-pointer duration-150" />
           </a>
-          <a href="https://www.instagram.com/stuyfusion/">
+          <a href="https://github.com/fusion479">
             <AiOutlineGithub className="inline-block w-10 h-10 mt-8 ml-4 text-gray-600 hover:text-gray-700 cursor-pointer duration-150" />
           </a>
-          <a href="https://github.com/fusion479">
+          <a href="https://www.instagram.com/stuyfusion/">
             <AiOutlineInstagram className="inline-block w-10 h-10 mt-8 ml-4 text-gray-600 hover:text-gray-700 cursor-pointer duration-150" />
           </a>
         </div>

src/app/impact/page.tsx

@@ -1,10 +1,15 @@
-"use client";
-
 import Container from "@/components/Container";
-import Copyright from "@/components/Copyright";
+import Footer from "@/components/Footer";
 import Hero from "./components/Hero";
 import List from "./components/List";
 import Background from "@/components/Background";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Impact | Stuy Fusion 479",
+  description:
+    "StuyFusion is committed to giving back to the community through outreach that inspires the next generation of engineers and problem-solvers. We have interacted with almost 1500 people in both local and international communities over the past year. Learn more about our impact.",
+};
 
 export default function Outreach() {
   return (
@@ -13,7 +18,7 @@ export default function Outreach() {
         <Hero />
         <List />
       </Container>
-      <Copyright theme="dark" />
+      <Footer theme="dark" />
     </Background>
   );
 }

src/app/layout.tsx

@@ -7,9 +7,9 @@ import Head from "next/head";
 const inter = Inter({ subsets: ["latin"] });
 
 export const metadata: Metadata = {
-  title: "Stuy Fusion | FTC 479",
+  title: "Stuy Fusion 479",
   description:
-    "Stuy Fusion is a FIRST Tech Challenge team based in New York City, comprised of talented students from Stuyvesant High School. As a team, we are dedicated to exploring the exciting world of robotics and competing in the FIRST Tech Challenge.",
+    "Stuy Fusion is an award-winning FIRST Tech Challenge team based in New York City. Our mission is to create a robot viable for the highest levels of competition while staying true to the principles of FIRST by giving back to our communities.",
 };
 
 export default function RootLayout({

src/app/page.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import Container from "@/components/Container";
-import Copyright from "@/components/Copyright";
+import Footer from "@/components/Footer";
 import Hero from "./components/Hero";
 import About from "./components/About";
 import Game from "./components/Game";
@@ -16,7 +16,7 @@ export default function Landing() {
         <Sponsors />
         <About />
         <Game />
-        <Copyright theme="dark" />
+        <Footer theme="dark" />
       </Container>
     </Background>
   );

src/app/robots/components/Robots/Robots.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import Info from "./Info";
 import Timeline from "./Timeline";
 import { useState } from "react";

src/app/robots/page.tsx

@@ -1,16 +1,21 @@
-"use client";
-
 import Container from "@/components/Container";
-import Copyright from "@/components/Copyright";
+import Footer from "@/components/Footer";
 import Robots from "./components/Robots";
 import Background from "@/components/Background";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Robots | Stuy Fusion 479",
+  description:
+    "Discover the robots StuyFusion has made over the years, showcasing our improvement and innovation in every competition.",
+};
 
 export default function About() {
   return (
     <Background>
       <Container className="relative">
         <Robots />
-        <Copyright theme="dark" />
+        <Footer theme="dark" />
       </Container>
     </Background>
   );

src/components/Footer.tsx

@@ -0,0 +1,31 @@
+import {
+  AiOutlineGithub,
+  AiOutlineInstagram,
+  AiOutlineYoutube,
+} from "react-icons/ai";
+
+export default function Copyright({ theme }: { theme: "dark" | "light" }) {
+  return (
+    <>
+      <div className="border-t-[1px] w-1/2 ml-auto mt-8 mr-auto" />
+      <div
+        className={`text-center text-sm text-gray-50 text-bold sm:text-center pt-6 ${
+          theme === "light" ? "text-gray-50" : " text-gray-500"
+        }`}
+      >
+        Copyright © StuyFusion 2023
+      </div>
+      <div className="text-center">
+        <a href="https://www.youtube.com/@stuyfusion">
+          <AiOutlineYoutube className="inline-block w-7 h-7 mt-4 text-gray-600 hover:text-gray-700 cursor-pointer duration-150" />
+        </a>
+        <a href="https://github.com/fusion479">
+          <AiOutlineGithub className="inline-block w-7 h-7 mt-4 ml-4 text-gray-600 hover:text-gray-700 cursor-pointer duration-150" />
+        </a>
+        <a href="https://www.instagram.com/stuyfusion/">
+          <AiOutlineInstagram className="inline-block w-7 h-7 mt-4 ml-4 text-gray-600 hover:text-gray-700 cursor-pointer duration-150" />
+        </a>
+      </div>
+    </>
+  );
+}