From b6ca737c97afbc655032eb7b3708ec493c5d636d Mon Sep 17 00:00:00 2001
From: Camerin <figueroa0609@protonmail.com>
Date: Tue, 11 Jan 2022 09:42:04 -0500
Subject: [PATCH] Limit render to 1 on About page

---
 src/components/About.js                     | 2 +-
 src/components/css/Card.css                 | 2 --
 src/components/subcomponents/GithubRepos.js | 5 ++++-
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/About.js b/src/components/About.js
index 837f901..f0d1121 100644
--- a/src/components/About.js
+++ b/src/components/About.js
@@ -45,7 +45,7 @@ class About extends React.Component {
 
         <Card title="Github" image="/img/github.webp" link="/github">
           You can access a list of github repositories that I've created directly on this site.
-          <GithubRepos style={{width: "50vw"}} username="RaspberryProgramming"/>
+          <GithubRepos style={{width: "50vw"}} username="RaspberryProgramming" single/>
         </Card>
 
 
diff --git a/src/components/css/Card.css b/src/components/css/Card.css
index 00ddbfd..8056bff 100644
--- a/src/components/css/Card.css
+++ b/src/components/css/Card.css
@@ -17,8 +17,6 @@
     font-size:xx-large;
     margin-right: 2rem;
     margin-top: 2rem;
-    max-height: 80vh;
-    overflow: hidden;
 }
 
 .card img {
diff --git a/src/components/subcomponents/GithubRepos.js b/src/components/subcomponents/GithubRepos.js
index 04d1926..29aaca1 100644
--- a/src/components/subcomponents/GithubRepos.js
+++ b/src/components/subcomponents/GithubRepos.js
@@ -39,7 +39,9 @@ class GithubRepos extends React.Component {
 
       if (this.props.repos.length > 0) {
         // Render each repo
-        const render = this.props.repos.map((repo) =>{
+        let repos = this.props.single ? [this.props.repos[0]] : this.props.repos
+
+        const render = repos.map((repo) =>{
           let updated = (new Date (repo.updated_at)).toLocaleString();
           let created = (new Date (repo.created_at)).toLocaleString();
 
@@ -104,6 +106,7 @@ class GithubRepos extends React.Component {
             });
 
         }
+
         return (<div>{this.renderRepos()}</div>);
     }