From 3b554cfa845656b2ad4b014a0fb3fd2cdfd4d803 Mon Sep 17 00:00:00 2001
From: Sebastian Moder <moder.sebastian@gmail.com>
Date: Thu, 12 Oct 2023 11:25:22 +0200
Subject: [PATCH] created about page

---
 app/about/page.tsx        | 184 +++++++-------------------------------
 components/Navigation.tsx |   2 +-
 public/images/206x206.png | Bin 0 -> 587 bytes
 3 files changed, 35 insertions(+), 151 deletions(-)
 create mode 100644 public/images/206x206.png

diff --git a/app/about/page.tsx b/app/about/page.tsx
index 17c14c1..d07357a 100644
--- a/app/about/page.tsx
+++ b/app/about/page.tsx
@@ -2,22 +2,26 @@ import React from "react";
 import Typography from "@mui/material/Typography";
 import Image from "next/image";
 import Headings from "@/components/Doubleheadings";
+import { FaGlobe, FaFacebook, FaLinkedin, FaLink } from "react-icons/fa";
 
 export default function About() {
   return (
-    <section className="text-gray-600 body-font">
+    <section className="">
       <div className="container px-5 py-24 mx-auto">
+        {/* Top Part Wrapper */}
         <div className="flex flex-col text-center w-full mb-20">
           <Headings
             top="PROJECT CONSORTIUM"
             bottom="Participating Organizations"
           />
-          <p className="lg:w-2/3 mx-auto leading-relaxed text-base">
+          <p className="mx-auto leading-relaxed lg:w-2/3">
             Whatever cardigan tote bag tumblr hexagon brooklyn asymmetrical
             gentrify, subway tile poke farm-to-table. Franzen you probably
             havent heard of them.
           </p>
         </div>
+
+        {/* Partnership Wrapper */}
         <div className="flex flex-wrap -m-4">
           {/* Partner 1 */}
           <div className="p-4 lg:w-1/2">
@@ -31,52 +35,22 @@ export default function About() {
               />
               <div className="flex-grow sm:pl-8">
                 <h2 className="title-font font-medium text-lg text-gray-900">
-                  Holden Caulfield
+                  Partner 1
                 </h2>
-                <h3 className="text-gray-500 mb-3">UI Developer</h3>
+                <h3 className="text-gray-500 mb-3">Country</h3>
                 <p className="mb-4">
                   DIY tote bag drinking vinegar cronut adaptogen squid fanny
                   pack vaporware.
                 </p>
                 <span className="inline-flex">
                   <a className="text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"></path>
-                    </svg>
+                    <FaGlobe size={24} />
                   </a>
-                  <a className="ml-2 text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2c9 5 20 0 20-11.5a4.5 4.5 0 00-.08-.83A7.72 7.72 0 0023 3z"></path>
-                    </svg>
+                  <a className="text-gray-500 ml-4">
+                    <FaFacebook size={24} />
                   </a>
-                  <a className="ml-2 text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path>
-                    </svg>
+                  <a className="text-gray-500 ml-4">
+                    <FaLinkedin size={24} />
                   </a>
                 </span>
               </div>
@@ -95,52 +69,22 @@ export default function About() {
               />
               <div className="flex-grow sm:pl-8">
                 <h2 className="title-font font-medium text-lg text-gray-900">
-                  Alper Kamu
+                  Partner 2
                 </h2>
-                <h3 className="text-gray-500 mb-3">Designer</h3>
+                <h3 className="text-gray-500 mb-3">Country</h3>
                 <p className="mb-4">
                   DIY tote bag drinking vinegar cronut adaptogen squid fanny
                   pack vaporware.
                 </p>
                 <span className="inline-flex">
                   <a className="text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"></path>
-                    </svg>
+                    <FaGlobe size={24} />
                   </a>
-                  <a className="ml-2 text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2c9 5 20 0 20-11.5a4.5 4.5 0 00-.08-.83A7.72 7.72 0 0023 3z"></path>
-                    </svg>
+                  <a className="text-gray-500 ml-4">
+                    <FaFacebook size={24} />
                   </a>
-                  <a className="ml-2 text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path>
-                    </svg>
+                  <a className="text-gray-500 ml-4">
+                    <FaLinkedin size={24} />
                   </a>
                 </span>
               </div>
@@ -159,52 +103,22 @@ export default function About() {
               />
               <div className="flex-grow sm:pl-8">
                 <h2 className="title-font font-medium text-lg text-gray-900">
-                  Atticus Finch
+                  Partner 3
                 </h2>
-                <h3 className="text-gray-500 mb-3">UI Developer</h3>
+                <h3 className="text-gray-500 mb-3">Country</h3>
                 <p className="mb-4">
                   DIY tote bag drinking vinegar cronut adaptogen squid fanny
                   pack vaporware.
                 </p>
                 <span className="inline-flex">
                   <a className="text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"></path>
-                    </svg>
+                    <FaGlobe size={24} />
                   </a>
-                  <a className="ml-2 text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2c9 5 20 0 20-11.5a4.5 4.5 0 00-.08-.83A7.72 7.72 0 0023 3z"></path>
-                    </svg>
+                  <a className="text-gray-500 ml-4">
+                    <FaFacebook size={24} />
                   </a>
-                  <a className="ml-2 text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path>
-                    </svg>
+                  <a className="text-gray-500 ml-4">
+                    <FaLinkedin size={24} />
                   </a>
                 </span>
               </div>
@@ -223,52 +137,22 @@ export default function About() {
               />
               <div className="flex-grow sm:pl-8">
                 <h2 className="title-font font-medium text-lg text-gray-900">
-                  Henry Letham
+                  Partner 4
                 </h2>
-                <h3 className="text-gray-500 mb-3">Designer</h3>
+                <h3 className="text-gray-500 mb-3">Country</h3>
                 <p className="mb-4">
                   DIY tote bag drinking vinegar cronut adaptogen squid fanny
                   pack vaporware.
                 </p>
                 <span className="inline-flex">
                   <a className="text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"></path>
-                    </svg>
+                    <FaGlobe size={24} />
                   </a>
-                  <a className="ml-2 text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2c9 5 20 0 20-11.5a4.5 4.5 0 00-.08-.83A7.72 7.72 0 0023 3z"></path>
-                    </svg>
+                  <a className="text-gray-500 ml-4">
+                    <FaFacebook size={24} />
                   </a>
-                  <a className="ml-2 text-gray-500">
-                    <svg
-                      fill="none"
-                      stroke="currentColor"
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      stroke-width="2"
-                      className="w-5 h-5"
-                      viewBox="0 0 24 24"
-                    >
-                      <path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path>
-                    </svg>
+                  <a className="text-gray-500 ml-4">
+                    <FaLinkedin size={24} />
                   </a>
                 </span>
               </div>
diff --git a/components/Navigation.tsx b/components/Navigation.tsx
index 1e367a0..a3596f3 100644
--- a/components/Navigation.tsx
+++ b/components/Navigation.tsx
@@ -16,7 +16,7 @@ import MenuItem from '@mui/material/MenuItem';
 import AdbIcon from '@mui/icons-material/Adb';
 import Link from 'next/link';
 
-const pages = ['SAGE', 'GUARD', 'ARTISAN'];
+const pages = ['SAGE', 'GUARD', 'ARTISAN', "About"];
 const settings = ['Profile', 'Account', 'Dashboard', 'Logout'];
 
 function ResponsiveAppBar() {
diff --git a/public/images/206x206.png b/public/images/206x206.png
new file mode 100644
index 0000000000000000000000000000000000000000..2f84139cd2f16b392d949381b6d0f78b68d86d10
GIT binary patch
literal 587
zcmeAS@N?(olHy`uVBq!ia0vp^=RlZ+8A!GmDtrf0(g8jpu4m4i0W$0B>y3?#B_$=(
z($Y3<+B9?KOdlVg?FP%5fpVM$9+AZi417mGm~pB$pELsl<26qg$B>FSZ?Ejnzw97!
z>|?lRa(Zvai>Q@hM>7f*$WHFqBCBlb)We>VU~)(+o5kfr`saP+Yipa8i(-HO_4t?_
zFL(Fn@$7D(@kn6a)`K~lE*VAnT#wpx_Q|$)yeE!LpLd{eRreartye0Sx}TN*8S|a3
zZThFZZ+K;nzsy%no}H<F^HYFBUFObLyfW|o>|W;F^p<?j$NI(p;+2I53b`z|e+u)v
z^LRqGxuU@Z?r9HqaoZf-`DSg+lx1^o=LMHtW<7RIb#bh)?z}wx{6jhG**3S{pSp0~
z|8Hx!d2;Im${N)#RKGvJXX4+flat=EuYNHz`@xY}I`iEdOKxTGzy5PgbJJymh_dO6
z8{114IqW*L^>xHgX}8s>G8HlETuV-^SGAe1bml_K!~D+{0`tz>@GZ&8;{02-T=u%(
zWZl&k0>9SwFs=L~y}#u~(mzwJKOerGiCV|o^Cn?WAJa;%-Jkze7rgS`QF$#VRD|Px
z^DgcsQa{8l^li$YGxdVswVa1dP7eEXzkMoe43U2BU;i{me|PDnAJ-o*&(+)AkYj)1
zg%y{|DK)nzr%OKi@$dIbKmE_)+poXe*Tp@i+;7i(&#zXu<39^h*aMm8kK3n~2T4>U
RFD?X0c)I$ztaD0e0s!}c3AO+L

literal 0
HcmV?d00001