big refactor for upcoming changes

src/AboutPage.tsx

@@ -1,4 +1,4 @@
-import Starter from './components/Starter';
+import Hero from './components/Hero';
 import Navbar from './components/Navbar';
 import AboutCard from './components/AboutCard';
 import Footer from './components/Footer';
@@ -7,7 +7,7 @@ import './TeamPage.css';
 function AboutPage() {
   return (
     <div className="container-sm">
-      <Starter />
+      <Hero />
       <Navbar />
       <AboutCard />
       <Footer />

src/HomePage.tsx

@@ -1,17 +1,19 @@
-import Starter from './components/Starter';
-import Projects from './components/Projects';
 import Navbar from './components/Navbar';
+import Hero from './components/Hero';
+import Projects from './components/Projects';
+import Team from './components/Team';
 import Footer from './components/Footer';
 import './HomePage.css';
 
 function HomePage() {
   return (
-      <div className="Home container-sm">
-        <Starter />
-        <Navbar />
-        <Projects />
-        <Footer />
-      </div>
+    <div className="Home container-sm">
+      <Navbar />
+      <Hero />
+      <Projects />
+      <Team />
+      <Footer />
+    </div>
   );
 }
 

src/ProjectsPage.tsx

@@ -0,0 +1,17 @@
+import Starter from './components/Hero';
+import Projects from './components/Projects';
+import Navbar from './components/Navbar';
+import Footer from './components/Footer';
+import './HomePage.css';
+
+function HomePage() {
+  return (
+    <div className="Home container-sm">
+      <Navbar />
+      <Projects />
+      <Footer />
+    </div>
+  );
+}
+
+export default HomePage;

src/TeamPage.tsx

@@ -1,4 +1,4 @@
-import Starter from './components/Starter';
+import Hero from './components/Hero';
 import Navbar from './components/Navbar';
 import Team from './components/Team';
 import Footer from './components/Footer';
@@ -7,7 +7,7 @@ import './TeamPage.css';
 function TeamPage() {
   return (
     <div className="container-sm">
-      <Starter />
+      <Hero />
       <Navbar />
       <Team />
       <Footer />

src/components/Hero.css

@@ -1,4 +1,4 @@
-.starter {
+.hero {
   min-height: 100vh;
   display: flex;
   flex-direction: column;
@@ -6,7 +6,7 @@
   gap: 1rem;
 }
 
-.starter > * {
+.hero > * {
   margin: 0 auto;
   text-align: center;
 }

src/components/Hero.tsx

@@ -2,11 +2,11 @@ import logo from '../images/pse-logo.svg';
 import arrow from '../images/arrow.svg';
 import discord from '../images/discord.svg';
 import twitter from '../images/twitter.svg';
-import './Starter.css';
+import './Hero.css';
 
-function Starter() {
+function Hero() {
   return (
-    <div className="starter">
+    <div className="hero">
       <img src={logo} alt="eth pse logo" className="pselogo" />
       <div className="intro h-100 p-3 bg-light-purple border border-5 border-dark">
         <h1 className="pt-3 pb-4">Welcome to Privacy & Scaling Explorations</h1>
@@ -44,4 +44,4 @@ function Starter() {
   );
 }
 
-export default Starter;
+export default Hero;

src/components/MagicCard.tsx

@@ -25,6 +25,9 @@ interface Links {
 }
 
 function renderLink(url: string, source: string, icon: string, button: boolean = true): any {
+  if (url) {
+
+  }
   if (!button) {
     return (
       <div className="link" key={url}>
@@ -91,20 +94,20 @@ function renderDescription(description: string | string[]): any {
 function MagicCard(props: MagicCardProps) {
   let links = props.links
     ? props.links.map((link) => {
-        if (link.github) {
-          return renderLink(link.github, "github", github);
-        } else if (link.website) {
-          return renderLink(link.website, "website", globe);
-        } else if (link.discord) {
-          return renderLink(link.discord, "discord", discord);
-        } else if (link.twitter) {
-          return renderLink(link.twitter, "twitter", twitter);
-        } else if (link.telegram) {
-          return renderLink(link.telegram, "telegram", telegram);
-        } else {
-          return null;
-        }
-      })
+      if (link.github) {
+        return renderLink(link.github, "github", github);
+      } else if (link.website) {
+        return renderLink(link.website, "website", globe);
+      } else if (link.discord) {
+        return renderLink(link.discord, "discord", discord);
+      } else if (link.twitter) {
+        return renderLink(link.twitter, "twitter", twitter);
+      } else if (link.telegram) {
+        return renderLink(link.telegram, "telegram", telegram);
+      } else {
+        return null;
+      }
+    })
     : null;
 
   let img = (() => {

src/components/Team.tsx

@@ -1,5 +1,6 @@
 import CardSection from './CardSection';
 import TeamData from '../data/Team.json';
+import './Team.css'
 
 
 function Team() {

src/components/TeamMemberCard.tsx

@@ -0,0 +1,12 @@
+import CardSection from './CardSection';
+import TeamData from '../data/Team.json';
+import './TeamCard.css'
+
+
+function TeamMemberCard() {
+  return (
+    <CardSection title="Team Members" cardData={TeamData} renderBanner={false}></CardSection>
+  );
+}
+
+export default TeamMemberCard;

src/index.css

@@ -18,6 +18,9 @@
   --github: #e8eaea;
   --discord: #7289da;
   --website: var(--green);
+
+  --background: var(--purple);
+  --link-bold: #854ad1;
 }
 
 body {
@@ -25,13 +28,10 @@ body {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   text-rendering: optimizeLegibility;
-  background: var(--purple);
+  background: var(--background);
   background-attachment: fixed;
   height: 100vh;
   font-family: "Inter", sans-serif;
-  /* background-image: url('./images/pse-deco.png'); */
-  background-repeat: no-repeat;
-  background-position: right -20em bottom 5em;
 }
 
 /*

src/index.tsx

@@ -12,9 +12,9 @@ root.render(
   <BrowserRouter>
     <Routes>
       <Route index element={<HomePage />} />
-      <Route path="projects" element={<HomePage />} />
+      {/*<Route path="projects" element={<HomePage />} />
       <Route path="team" element={<TeamPage />} />
-      <Route path="about" element={<AboutPage />} />
+      <Route path="about" element={<AboutPage />} /> */}
     </Routes>
   </BrowserRouter>
 );