From 6fb7ec359320e814da50171a49cea30fc080126c Mon Sep 17 00:00:00 2001
From: Josh Goldberg <git@joshuakgoldberg.com>
Date: Wed, 11 Jan 2023 14:12:04 -0500
Subject: [PATCH] chore(website): add links to and widen Silver Supporters

---
 .../FinancialContributors/Sponsor.tsx         | 34 ++++++++-----------
 .../FinancialContributors/Sponsors/index.tsx  |  8 ++---
 .../Sponsors/styles.module.css                |  1 -
 .../FinancialContributors/index.tsx           |  3 +-
 .../FinancialContributors/styles.module.css   | 15 ++++----
 .../components/FinancialContributors/types.ts |  5 ---
 6 files changed, 29 insertions(+), 37 deletions(-)

diff --git a/packages/website/src/components/FinancialContributors/Sponsor.tsx b/packages/website/src/components/FinancialContributors/Sponsor.tsx
index 06f53dd438f..c50ab89b609 100644
--- a/packages/website/src/components/FinancialContributors/Sponsor.tsx
+++ b/packages/website/src/components/FinancialContributors/Sponsor.tsx
@@ -1,17 +1,17 @@
 import React from 'react';
 
 import styles from './styles.module.css';
-import type { SponsorData, SponsorIncludeOptions } from './types';
+import type { SponsorData } from './types';
 
 interface SponsorProps {
-  include?: SponsorIncludeOptions;
+  includeName?: boolean;
   sponsor: SponsorData;
 }
 
-export function Sponsor({ include = {}, sponsor }: SponsorProps): JSX.Element {
+export function Sponsor({ includeName, sponsor }: SponsorProps): JSX.Element {
   let children = <img alt={`${sponsor.name} logo`} src={sponsor.image} />;
 
-  if (include.name) {
+  if (includeName) {
     children = (
       <>
         {children}
@@ -20,19 +20,15 @@ export function Sponsor({ include = {}, sponsor }: SponsorProps): JSX.Element {
     );
   }
 
-  if (include.link) {
-    children = (
-      <a
-        className={styles.sponsorLink}
-        href={sponsor.website ?? undefined}
-        title={sponsor.name}
-        target="_blank"
-        rel="noopener sponsored"
-      >
-        {children}
-      </a>
-    );
-  }
-
-  return children;
+  return (
+    <a
+      className={styles.sponsorLink}
+      href={sponsor.website ?? undefined}
+      title={sponsor.name}
+      target="_blank"
+      rel="noopener sponsored"
+    >
+      {children}
+    </a>
+  );
 }
diff --git a/packages/website/src/components/FinancialContributors/Sponsors/index.tsx b/packages/website/src/components/FinancialContributors/Sponsors/index.tsx
index dfcdad8c7b9..6c2d8874593 100644
--- a/packages/website/src/components/FinancialContributors/Sponsors/index.tsx
+++ b/packages/website/src/components/FinancialContributors/Sponsors/index.tsx
@@ -2,12 +2,12 @@ import clsx from 'clsx';
 import React from 'react';
 
 import { Sponsor } from '../Sponsor';
-import type { SponsorData, SponsorIncludeOptions } from '../types';
+import type { SponsorData } from '../types';
 import styles from './styles.module.css';
 
 interface SponsorsProps {
   className: string;
-  include?: SponsorIncludeOptions;
+  includeName?: boolean;
   expanded?: boolean;
   sponsors: SponsorData[];
   title: string;
@@ -16,7 +16,7 @@ interface SponsorsProps {
 
 export function Sponsors({
   className,
-  include,
+  includeName,
   title,
   tier,
   sponsors,
@@ -27,7 +27,7 @@ export function Sponsors({
       <ul className={clsx(styles.sponsorsTier, styles[`tier-${tier}`])}>
         {sponsors.map(sponsor => (
           <li key={sponsor.id}>
-            <Sponsor include={include} sponsor={sponsor} />
+            <Sponsor includeName={includeName} sponsor={sponsor} />
           </li>
         ))}
       </ul>
diff --git a/packages/website/src/components/FinancialContributors/Sponsors/styles.module.css b/packages/website/src/components/FinancialContributors/Sponsors/styles.module.css
index b92051eddcb..526e1ab745e 100644
--- a/packages/website/src/components/FinancialContributors/Sponsors/styles.module.css
+++ b/packages/website/src/components/FinancialContributors/Sponsors/styles.module.css
@@ -82,7 +82,6 @@
   .tierArea {
     margin: 16px 0;
     width: auto;
-    padding: 0 60px;
   }
 
   .tier-gold-supporter {
diff --git a/packages/website/src/components/FinancialContributors/index.tsx b/packages/website/src/components/FinancialContributors/index.tsx
index d71bd065004..0460e1e8694 100644
--- a/packages/website/src/components/FinancialContributors/index.tsx
+++ b/packages/website/src/components/FinancialContributors/index.tsx
@@ -16,14 +16,13 @@ export function FinancialContributors(): JSX.Element {
       <div className={styles.sponsorsContainer}>
         <Sponsors
           className={styles.tierSponsorArea}
-          include={{ link: true, name: true }}
+          includeName
           tier="platinum-sponsor"
           title="Platinum Sponsors"
           sponsors={sponsors.slice(0, 6)}
         />
         <Sponsors
           className={styles.tierSupporterArea}
-          include={{ link: true }}
           tier="gold-supporter"
           title="Gold Supporters"
           sponsors={sponsors.slice(6, 16)}
diff --git a/packages/website/src/components/FinancialContributors/styles.module.css b/packages/website/src/components/FinancialContributors/styles.module.css
index c5ffc1e2681..667e6a7e60c 100644
--- a/packages/website/src/components/FinancialContributors/styles.module.css
+++ b/packages/website/src/components/FinancialContributors/styles.module.css
@@ -13,6 +13,10 @@
   margin: 48px 24px 24px;
 }
 
+.tierOtherArea {
+  padding: 0;
+}
+
 .become {
   font-size: 1.25rem;
   padding: 0.75rem 1.75rem;
@@ -36,12 +40,6 @@
     max-width: 100%;
   }
 
-  .tierArea {
-    margin: 16px 0;
-    width: auto;
-    padding: 0 60px;
-  }
-
   .tierSponsorArea {
     grid-area: 1 / 1 / 3 / 2;
   }
@@ -50,6 +48,11 @@
     grid-area: 1 / 2 / 2 / 3;
   }
 
+  .tierSponsorArea,
+  .tierSupporterArea {
+    padding: 0 60px;
+  }
+
   .tierOtherArea {
     grid-area: 2 / 2 / 3 / 3;
   }
diff --git a/packages/website/src/components/FinancialContributors/types.ts b/packages/website/src/components/FinancialContributors/types.ts
index fb20cb4623a..7bfc3911f39 100644
--- a/packages/website/src/components/FinancialContributors/types.ts
+++ b/packages/website/src/components/FinancialContributors/types.ts
@@ -7,8 +7,3 @@ export interface SponsorData {
   totalDonations: number;
   website?: string;
 }
-
-export interface SponsorIncludeOptions {
-  link?: boolean;
-  name?: boolean;
-}