From 9a9ca6e815611bf9f4c97ab8488e9d2f110885dc Mon Sep 17 00:00:00 2001
From: Orta <git@orta.io>
Date: Sat, 15 Aug 2020 07:49:23 -0400
Subject: [PATCH 1/4] Removes the sponsor logos and minor CSS improvements to
 logos

---
 website/pages/en/index.js   | 101 ++++++------------------------------
 website/static/css/jest.css |   8 ++-
 2 files changed, 21 insertions(+), 88 deletions(-)

diff --git a/website/pages/en/index.js b/website/pages/en/index.js
index cbb880a7e3b9..a9e7980a1d6c 100755
--- a/website/pages/en/index.js
+++ b/website/pages/en/index.js
@@ -36,90 +36,6 @@ Button.defaultProps = {
   target: '_self',
 };
 
-const Sponsor = ({
-  fromAccount: {name, slug, website, imageUrl},
-  totalDonations,
-}) => (
-  <a
-    key={slug}
-    className="sponsor-item"
-    title={`$${totalDonations.value} by ${name || slug}`}
-    target="_blank"
-    rel="nofollow noopener"
-    href={website || `https://opencollective.com/${slug}`}
-  >
-    {
-      <img
-        className="sponsor-avatar"
-        src={imageUrl}
-        alt={name || slug ? `${name || slug}'s avatar` : 'avatar'}
-      />
-    }
-  </a>
-);
-
-const Backer = ({
-  fromAccount: {name, slug, website, imageUrl},
-  totalDonations,
-}) => (
-  <a
-    key={slug}
-    className="backer-item"
-    title={`$${totalDonations.value} by ${name || slug}`}
-    target="_blank"
-    rel="nofollow noopener"
-    href={website || `https://opencollective.com/${slug}`}
-  >
-    {
-      <img
-        className="backer-avatar"
-        src={imageUrl}
-        alt={name || slug ? `${name || slug}'s avatar` : 'avatar'}
-      />
-    }
-  </a>
-);
-
-class Contributors extends React.Component {
-  render() {
-    return (
-      <div className="opencollective">
-        <h3>
-          <translate>Sponsors</translate>
-        </h3>
-        <p>
-          <translate>
-            Sponsors are those who contribute $100 or more per month to Jest
-          </translate>
-        </p>
-        <div>
-          {backers
-            .filter(b => b.tier && b.tier.slug === 'sponsor')
-            .map(Sponsor)}
-        </div>
-        <h3>
-          <translate>Backers</translate>
-        </h3>
-        <p>
-          <translate>
-            Backers are those who contribute $2 or more per month to Jest
-          </translate>
-        </p>
-        <div>
-          {backers
-            .filter(
-              b =>
-                b.tier &&
-                b.tier.slug === 'backer' &&
-                !b.fromAccount.slug.includes('adult')
-            )
-            .map(Backer)}
-        </div>
-      </div>
-    );
-  }
-}
-
 class Card extends React.Component {
   render() {
     const {index} = this.props;
@@ -265,6 +181,13 @@ const HeroInteractive = ({config: {repoUrl}, language}) => (
 
 class Index extends React.Component {
   render() {
+    const sponsorCount = backers.filter(
+      b => b.tier && b.tier.slug === 'sponsor'
+    ).length;
+
+    const backerCount = backers.filter(b => b.tier && b.tier.slug === 'backer')
+      .length;
+
     const showcase = siteConfig.users.map((user, i) => (
       <a href={user.infoLink} key={i}>
         <img src={user.image} title={user.caption} />
@@ -531,7 +454,13 @@ class Index extends React.Component {
                       non-Facebook contributors.
                     </translate>
                   </MarkdownBlock>
-                  <Contributors />
+                  <MarkdownBlock>
+                    <translate>
+                      We have over 50 Sponsors who contribute $100 or more per
+                      month, and over 450 Backers who have contributed $2 or
+                      more to Jest.
+                    </translate>
+                  </MarkdownBlock>
                 </div>
                 <div className="blockContent yellow">
                   <h2>
@@ -549,7 +478,7 @@ class Index extends React.Component {
                   </MarkdownBlock>
                   <div className="gridBlock logos">
                     {showcase}
-                    <p>And many others</p>
+                    <p className="others">And many others</p>
                   </div>
                 </div>
               </div>
diff --git a/website/static/css/jest.css b/website/static/css/jest.css
index 477e55ea67fc..976d0e8e25c4 100644
--- a/website/static/css/jest.css
+++ b/website/static/css/jest.css
@@ -152,8 +152,12 @@
   padding-top: 10px;
 }
 
-.logos {
-  align-items: center;
+.logos > a {
+  margin-left: 0;
+}
+
+.logos > p.others {
+  padding-top: 1.5rem !important;
 }
 
 @media only screen and (min-width: 736px) {

From 0d3f7cca4195d7de4af9d686f86d7fd4df60b481 Mon Sep 17 00:00:00 2001
From: Orta <git@orta.io>
Date: Sat, 15 Aug 2020 13:34:40 -0400
Subject: [PATCH 2/4] Remove the backers reference

---
 website/pages/en/index.js | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/website/pages/en/index.js b/website/pages/en/index.js
index a9e7980a1d6c..db13d7ff102d 100755
--- a/website/pages/en/index.js
+++ b/website/pages/en/index.js
@@ -12,7 +12,6 @@ const Container = CompLibrary.Container;
 const GridBlock = CompLibrary.GridBlock;
 
 const translate = require('../../server/translate.js').translate;
-const backers = require(process.cwd() + '/backers.json');
 const siteConfig = require(process.cwd() + '/siteConfig.js');
 const getDocsUrl = (url, language) =>
   siteConfig.baseUrl + 'docs/' + language + url;
@@ -181,13 +180,6 @@ const HeroInteractive = ({config: {repoUrl}, language}) => (
 
 class Index extends React.Component {
   render() {
-    const sponsorCount = backers.filter(
-      b => b.tier && b.tier.slug === 'sponsor'
-    ).length;
-
-    const backerCount = backers.filter(b => b.tier && b.tier.slug === 'backer')
-      .length;
-
     const showcase = siteConfig.users.map((user, i) => (
       <a href={user.infoLink} key={i}>
         <img src={user.image} title={user.caption} />

From 3b877be02f47c0be3b0f53bff363ac891729d4d6 Mon Sep 17 00:00:00 2001
From: Orta <git@orta.io>
Date: Fri, 2 Oct 2020 10:39:36 -0400
Subject: [PATCH 3/4] Remove the sponsors stuff

---
 website/pages/en/index.js | 95 +++++++++++++++++++++++++++++++++++----
 1 file changed, 87 insertions(+), 8 deletions(-)

diff --git a/website/pages/en/index.js b/website/pages/en/index.js
index db13d7ff102d..cbb880a7e3b9 100755
--- a/website/pages/en/index.js
+++ b/website/pages/en/index.js
@@ -12,6 +12,7 @@ const Container = CompLibrary.Container;
 const GridBlock = CompLibrary.GridBlock;
 
 const translate = require('../../server/translate.js').translate;
+const backers = require(process.cwd() + '/backers.json');
 const siteConfig = require(process.cwd() + '/siteConfig.js');
 const getDocsUrl = (url, language) =>
   siteConfig.baseUrl + 'docs/' + language + url;
@@ -35,6 +36,90 @@ Button.defaultProps = {
   target: '_self',
 };
 
+const Sponsor = ({
+  fromAccount: {name, slug, website, imageUrl},
+  totalDonations,
+}) => (
+  <a
+    key={slug}
+    className="sponsor-item"
+    title={`$${totalDonations.value} by ${name || slug}`}
+    target="_blank"
+    rel="nofollow noopener"
+    href={website || `https://opencollective.com/${slug}`}
+  >
+    {
+      <img
+        className="sponsor-avatar"
+        src={imageUrl}
+        alt={name || slug ? `${name || slug}'s avatar` : 'avatar'}
+      />
+    }
+  </a>
+);
+
+const Backer = ({
+  fromAccount: {name, slug, website, imageUrl},
+  totalDonations,
+}) => (
+  <a
+    key={slug}
+    className="backer-item"
+    title={`$${totalDonations.value} by ${name || slug}`}
+    target="_blank"
+    rel="nofollow noopener"
+    href={website || `https://opencollective.com/${slug}`}
+  >
+    {
+      <img
+        className="backer-avatar"
+        src={imageUrl}
+        alt={name || slug ? `${name || slug}'s avatar` : 'avatar'}
+      />
+    }
+  </a>
+);
+
+class Contributors extends React.Component {
+  render() {
+    return (
+      <div className="opencollective">
+        <h3>
+          <translate>Sponsors</translate>
+        </h3>
+        <p>
+          <translate>
+            Sponsors are those who contribute $100 or more per month to Jest
+          </translate>
+        </p>
+        <div>
+          {backers
+            .filter(b => b.tier && b.tier.slug === 'sponsor')
+            .map(Sponsor)}
+        </div>
+        <h3>
+          <translate>Backers</translate>
+        </h3>
+        <p>
+          <translate>
+            Backers are those who contribute $2 or more per month to Jest
+          </translate>
+        </p>
+        <div>
+          {backers
+            .filter(
+              b =>
+                b.tier &&
+                b.tier.slug === 'backer' &&
+                !b.fromAccount.slug.includes('adult')
+            )
+            .map(Backer)}
+        </div>
+      </div>
+    );
+  }
+}
+
 class Card extends React.Component {
   render() {
     const {index} = this.props;
@@ -446,13 +531,7 @@ class Index extends React.Component {
                       non-Facebook contributors.
                     </translate>
                   </MarkdownBlock>
-                  <MarkdownBlock>
-                    <translate>
-                      We have over 50 Sponsors who contribute $100 or more per
-                      month, and over 450 Backers who have contributed $2 or
-                      more to Jest.
-                    </translate>
-                  </MarkdownBlock>
+                  <Contributors />
                 </div>
                 <div className="blockContent yellow">
                   <h2>
@@ -470,7 +549,7 @@ class Index extends React.Component {
                   </MarkdownBlock>
                   <div className="gridBlock logos">
                     {showcase}
-                    <p className="others">And many others</p>
+                    <p>And many others</p>
                   </div>
                 </div>
               </div>

From 623c4bb657d190e662ff0fba8938263f5c714064 Mon Sep 17 00:00:00 2001
From: Orta <git@orta.io>
Date: Fri, 2 Oct 2020 10:40:35 -0400
Subject: [PATCH 4/4] Add the orthers class

---
 website/pages/en/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/website/pages/en/index.js b/website/pages/en/index.js
index cbb880a7e3b9..8a307506915b 100755
--- a/website/pages/en/index.js
+++ b/website/pages/en/index.js
@@ -549,7 +549,7 @@ class Index extends React.Component {
                   </MarkdownBlock>
                   <div className="gridBlock logos">
                     {showcase}
-                    <p>And many others</p>
+                    <p className="others">And many others</p>
                   </div>
                 </div>
               </div>