From 6b148a97069aaa6c6e951fe6c490b786ab85bbeb Mon Sep 17 00:00:00 2001
From: skunichetty <skunich@umich.edu>
Date: Mon, 10 Jul 2023 23:07:19 -0500
Subject: [PATCH 1/3] Updated team page to use Icon component

---
 pages/team.jsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/pages/team.jsx b/pages/team.jsx
index aceb9d5..a762973 100644
--- a/pages/team.jsx
+++ b/pages/team.jsx
@@ -2,7 +2,7 @@ import Layout from "@/components/layout";
 import Hero from "@/components/hero";
 import Link from "next/link";
 import Image from "next/image";
-import { IoLogoGithub, IoLogoLinkedin } from "react-icons/io";
+import Icon from "@/components/icon";
 import fs from "fs";
 import path from "path";
 import { useRouter } from "next/router";
@@ -63,14 +63,14 @@ function MemberCard({ json, basePath }) {
         {json.linkedin ? (
           <li>
             <Link href={json.linkedin} className="hover:text-gray">
-              <IoLogoLinkedin className="w-6 h-6" />
+              <Icon name="linkedin" className="text-3xl" />
             </Link>
           </li>
         ) : null}
         {json.github ? (
           <li>
             <Link href={json.github} className="hover:text-gray">
-              <IoLogoGithub className="w-6 h-6" />
+              <Icon name="github" className="text-3xl" />
             </Link>
           </li>
         ) : null}

From 4f90b7ee0b01ea1334520eadc33948a594579b3c Mon Sep 17 00:00:00 2001
From: skunichetty <skunich@umich.edu>
Date: Mon, 10 Jul 2023 23:17:09 -0500
Subject: [PATCH 2/3] Added button component

---
 components/button.jsx | 12 ++++++++++++
 pages/index.jsx       | 23 +++++------------------
 tailwind.config.js    |  1 +
 3 files changed, 18 insertions(+), 18 deletions(-)
 create mode 100644 components/button.jsx

diff --git a/components/button.jsx b/components/button.jsx
new file mode 100644
index 0000000..d557019
--- /dev/null
+++ b/components/button.jsx
@@ -0,0 +1,12 @@
+import Link from "next/link";
+
+export default function Button({ href, text }) {
+  return (
+    <Link
+      className="rounded-lg p-4 text-lg hover:-translate-y-1 bg-translucent transition drop-shadow-md"
+      href={href}
+    >
+      {text}
+    </Link>
+  );
+}
diff --git a/pages/index.jsx b/pages/index.jsx
index 9a77bfa..8dffd4e 100644
--- a/pages/index.jsx
+++ b/pages/index.jsx
@@ -3,6 +3,8 @@ import Wave from "@/components/wave";
 import Wave180 from "@/components/wave180";
 import Hero from "@/components/hero";
 import Link from "next/link";
+import Button from "@/components/button";
+
 import fs from "fs";
 import path from "path";
 // import Markdown from 'markdown-to-jsx';
@@ -44,18 +46,8 @@ export default function Home({ sponsors, projects }) {
         </div>
 
         <div className="flex justify-center gap-5">
-          <Link
-            className="border-2 rounded-full p-3 hover:-translate-y-1"
-            href="/join"
-          >
-            Join Us
-          </Link>
-          <Link
-            className="border-2 rounded-full p-3 hover:-translate-y-1"
-            href="/sponsors"
-          >
-            Work With Us
-          </Link>
+          <Button href="/join" text="Join Us" />
+          <Button href="/sponsors" text="Work with Us" />
         </div>
       </Hero>
       <div className="container mx-auto px-2">
@@ -103,12 +95,7 @@ export default function Home({ sponsors, projects }) {
           All UM Ann Arbor students can join for free!
         </h2>
         <div className="flex mt-4 justify-center">
-          <Link
-            className="border-2 rounded-full p-3 hover:-translate-y-1"
-            href=""
-          >
-            Join Us
-          </Link>
+          <Button href="/join" text="Join Us" />
         </div>
       </div>
 
diff --git a/tailwind.config.js b/tailwind.config.js
index bd6ee48..ade588f 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -19,6 +19,7 @@ module.exports = {
     },
     colors: {
       transparent: "transparent",
+      translucent: "#F3F5F744",
       current: "currentColor",
       black: colors.black,
       white: colors.white,

From 000c1f15666ec4650529d5a45575ce394aaf8a6f Mon Sep 17 00:00:00 2001
From: skunichetty <skunich@umich.edu>
Date: Mon, 10 Jul 2023 23:39:11 -0500
Subject: [PATCH 3/3] Updated front page styling

---
 components/button.jsx |  2 +-
 pages/index.jsx       | 17 +++++++----------
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/components/button.jsx b/components/button.jsx
index d557019..e860ccd 100644
--- a/components/button.jsx
+++ b/components/button.jsx
@@ -3,7 +3,7 @@ import Link from "next/link";
 export default function Button({ href, text }) {
   return (
     <Link
-      className="rounded-lg p-4 text-lg hover:-translate-y-1 bg-translucent transition drop-shadow-md"
+      className="rounded-lg xl:p-4 p-3 lg:text-lg text-base hover:-translate-y-1 bg-translucent transition drop-shadow-md"
       href={href}
     >
       {text}
diff --git a/pages/index.jsx b/pages/index.jsx
index 8dffd4e..aa199fb 100644
--- a/pages/index.jsx
+++ b/pages/index.jsx
@@ -20,17 +20,19 @@ export default function Home({ sponsors, projects }) {
   return (
     <Layout>
       <Hero>
-        <div className="flex gap-8 items-center md:flex-row flex-col-reverse">
+        <div className="flex gap-8 items-center md:flex-row flex-col-reverse p-8">
           <div className="md:w-1/2 w-full">
-            <h1
-              className={`mb-2 md:mb-5 lg:text-5xl md:text-4xl text-3xl font-bold font-sans tracking-tight`}
-            >
+            <h1 className="mb-2 md:mb-5 lg:text-5xl md:text-4xl text-3xl font-bold font-sans tracking-tight">
               U of M&apos;s Premier Data Science Club
             </h1>
-            <p className="mb-10 lg:text-xl md:text-lg text-base font-light lg:tracking-wider tracking-normal">
+            <p className="mb-5 xl:text-xl lg:text-lg text-base font-light lg:tracking-wider tracking-normal">
               We empower the next generation of data scientists at the
               University of Michigan through education and exploration.
             </p>
+            <div className="flex md:justify-start justify-center gap-5">
+              <Button href="/join" text="Join Us" />
+              <Button href="/sponsors" text="Work with Us" />
+            </div>
           </div>
           <Image
             className="md:w-1/2 w-full"
@@ -44,11 +46,6 @@ export default function Home({ sponsors, projects }) {
             alt="Image of a dataframe"
           />
         </div>
-
-        <div className="flex justify-center gap-5">
-          <Button href="/join" text="Join Us" />
-          <Button href="/sponsors" text="Work with Us" />
-        </div>
       </Hero>
       <div className="container mx-auto px-2">
         <div className="grid bullets items-center gap-x-8 gap-y-2 grid-flow-col">