react-native-elements · arpitBhalla · May 21, 2022 · May 20, 2022 · May 20, 2022 · May 21, 2022
diff --git a/website/src/components/SectionHeader.tsx b/website/src/components/SectionHeader.tsx
@@ -8,24 +8,28 @@ export function SectionHeader({
   primary,
   color,
   icon: Icon,
+  noMargin,
   ...iconProps
 }: Partial<IconProps> & {
   header?: string;
   subheader?: string;
   primary?: boolean;
+  noMargin?: boolean;
 }) {
   return (
-    <div className="container margin-vert--lg">
+    <div className={'container ' + (noMargin ? '' : 'margin-vert--lg')}>
       <div className="row">
         <div>
-          <IconTag
-            icon={Icon}
-            color={color}
-            padding={8}
-            size={size}
-            style={{ marginRight: 12 }}
-            {...iconProps}
-          />
+          {Icon && (
+            <IconTag
+              icon={Icon}
+              color={color}
+              padding={8}
+              size={size}
+              style={{ marginRight: 12 }}
+              {...iconProps}
+            />
+          )}
         </div>
         <div>
           <h1
@@ -34,7 +38,7 @@ export function SectionHeader({
           >
             {header}
           </h1>
-          <small>{subheader}</small>
+          {subheader && <small>{subheader}</small>}
         </div>
       </div>
     </div>

diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx
@@ -16,7 +16,7 @@ const Home: React.FunctionComponent<{}> = () => {
   const context = useDocusaurusContext();
   const { siteConfig = {} } = context;
   return (
-    <Layout title={siteConfig.title} description={siteConfig.tagline}>
+    <Layout>
       <Hero />
       <Features />
       <Installation />

diff --git a/website/src/pages/sponsor.tsx b/website/src/pages/sponsor.tsx
@@ -1,15 +1,12 @@
 import React from 'react';
 import Layout from '@theme/Layout';
-import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 import OpenCollective from '../components/OpenCollective';
 import Sponsor from '../components/Sponsor';
 import '../../static/css/components.css';
 
 const Home: React.FunctionComponent<{}> = () => {
-  const context = useDocusaurusContext();
-  const { siteConfig = {} } = context;
   return (
-    <Layout title={siteConfig.title} description={siteConfig.tagline}>
+    <Layout title={'Sponsors'}>
       <div className="margin-vert--lg">
         <Sponsor />
         <OpenCollective />

diff --git a/website/src/pages/team.tsx b/website/src/pages/team.tsx
@@ -0,0 +1,140 @@
+import React from 'react';
+import Layout from '@theme/Layout';
+import Link from '@docusaurus/Link';
+import { SiGithub, SiTwitter } from 'react-icons/si';
+import { SectionHeader } from '../components/SectionHeader';
+import { BsPeople } from 'react-icons/bs';
+import { FaSun, FaEye } from 'react-icons/fa';
+
+type MemberType = { name: string; gh: string; title: string; twitter?: string };
+
+const TeamSection = ({ members }: { members: MemberType[] }) => (
+  <div className="row margin-horiz--lg margin-vert--sm">
+    {members.map(({ name, gh, twitter }, index) => (
+      <div
+        key={index}
+        className="avatar avatar--verticaal col col--3 padding--md"
+      >
+        <img
+          className="avatar__photo avatar__photo--ljg"
+          src={`https://github.com/${gh}.png`}
+        />
+        <div className="avatar__intro">
+          <div className="avatar__name">{name}</div>
+          <div className="avatar__subtitle">
+            <Link to={`https://github.com/${gh}`}>
+              <SiGithub color="var(--ifm-color-emphasis-900)" />
+            </Link>{' '}
+            {twitter && (
+              <Link to={`https://twitter.com/${twitter}`}>
+                <SiTwitter />
+              </Link>
+            )}
+          </div>
+        </div>
+      </div>
+    ))}
+  </div>
+);
+
+const Home: React.FunctionComponent<{}> = () => {
+  return (
+    <Layout title={'The Team'}>
+      <section className="container ">
+        <h1 className="text--center text--primary margin-vert--md">Our Team</h1>
+        <div className="margin-vert--lg">
+          <SectionHeader
+            noMargin
+            color="#EA4AAA"
+            header="Core Team"
+            icon={FaEye}
+          />
+          <TeamSection members={active} />
+        </div>
+        <div className="margin-vert--lg">
+          <SectionHeader
+            noMargin
+            color="#20b19e"
+            header="Community emeriti"
+            icon={BsPeople}
+          />
+          <TeamSection members={core} />
+        </div>
+        <div className="margin-vert--lg">
+          <SectionHeader
+            noMargin
+            color="#fbbd00"
+            header="GSoC'21 Students"
+            icon={FaSun}
+          />
+          <TeamSection members={gsoc} />
+        </div>
+      </section>
+    </Layout>
+  );
+};
+
+export default Home;
+
+const active: MemberType[] = [
+  {
+    gh: 'flyingcircle',
+    name: 'Jeremy Hamilton',
+    title: '',
+    twitter: null,
+  },
+
+  {
+    gh: 'pranshuchittora',
+    name: 'Pranshu Chittora',
+    title: '',
+    twitter: 'pranshuchittora',
+  },
+  {
+    name: 'Arpit Bhalla',
+    gh: 'arpitbhalla',
+    title: "GSoC'21 student",
+    twitter: 'arpitbhalla_',
+  },
+];
+const core: MemberType[] = [
+  { gh: 'dabit3', name: 'Nader Dabit', title: '', twitter: 'dabit3' },
+  {
+    gh: 'Monte9',
+    name: 'Monte Thakkar',
+    title: '',
+    twitter: 'mthakkar_',
+  },
+  {
+    gh: 'iRoachie',
+    name: 'Kyle Roach',
+    title: '',
+    twitter: 'roach_iam',
+  },
+  {
+    gh: 'martinezguillaume',
+    name: 'Guillaume Martinez',
+    title: '',
+    twitter: null,
+  },
+  {
+    gh: 'xavier-villelegier',
+    name: 'Xavier Villelégier',
+    title: '',
+    twitter: null,
+  },
+];
+const gsoc: MemberType[] = [
+  {
+    name: 'Arpit Bhalla',
+    gh: 'arpitbhalla',
+    title: "GSoC'21 student",
+    twitter: 'arpitbhalla_',
+  },
+  {
+    gh: 'khushal87',
+    name: 'Khushal Agarwal',
+    title: "GSoC'21 student",
+    twitter: 'khushal87',
+  },
+];
diff --git a/website/yarn.lock b/website/yarn.lock
@@ -2689,7 +2689,7 @@ __metadata:
 
 "@rneui/base@file:../packages/base::locator=root-workspace-0b6124%40workspace%3A.":
   version: 4.0.0-rc.3
-  resolution: "@rneui/base@file:../packages/base#../packages/base::hash=493940&locator=root-workspace-0b6124%40workspace%3A."
+  resolution: "@rneui/base@file:../packages/base#../packages/base::hash=828d13&locator=root-workspace-0b6124%40workspace%3A."
   dependencies:
     "@types/react-native-vector-icons": ^6.4.10
     color: ^3.2.1
@@ -2700,7 +2700,7 @@ __metadata:
   peerDependencies:
     react-native-safe-area-context: ^3.1.9
     react-native-vector-icons: ">7.0.0"
-  checksum: 2b4313b5a17334443526940ddddc779bd9a414adb100036ce9a318b382e7d984e550eb35da0147117b9cae80384c08ba6bcc3198b978c43c038c730a6c40a156
+  checksum: 989870952f8ef694a0253302d6ff0a97f4eb8a288daff2f6bd76b69892dee7f7a91bde7e6abb9714487bfa7e870247c2a7445a1d2bf9f63a1953d62d18a9e31e
   languageName: node
   linkType: hard