Skip to content

chore(website): explained and auto-balanced homepage sponsors list #5996

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Nov 16, 2022
Merged

chore(website): explained and auto-balanced homepage sponsors list #5996

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2cad079
chore(website): explained and auto-balanced homepage sponsors list
JoshuaKGoldberg Nov 16, 2022
afe05de
Merge branch 'main' into sponsors-balanced
JoshuaKGoldberg Nov 16, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 17 additions & 3 deletions .github/SPONSORSHIPS.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,23 @@ Sponsoring TypeScript ESLint helps keep our development process running reliably
- Fix bugs and add new features to existing rules
- Write more advanced rules to solve more areas of application correctness

### Sponsorship Benefits

In addition to benefitting the TypeScript ecosystem, sponsoring us on Open Collective helps promote your company and development brand.
Our top sponsors may have their link, logo, and/or name featured on the homepage of [typescript-eslint.io](https://typescript-eslint.io).

At present, sponsors must have given at least $100 to be featured on the homepage.
Placement tiers are based on total donations:

- Platinum sponsors: Top 6 donators
- Gold supporters: The next 10 donators
- Silver supporters: The next 18 donators

You can always view all financial contributors on [opencollective.com/typescript-eslint](https://opencollective.com/typescript-eslint).

> Got an idea for how to make sponsorship work for you?
> Let us know at `typescripteslint@gmail.com`!

## Sponsorship Limitations

### Project Direction
Expand All @@ -25,7 +42,6 @@ If you have a need to push forward an area of work in TypeScript ESLint more urg

### Website Placement

Our top sponsors may have their link, logo, and/or name featured on the homepage of https://typescript-eslint.io.
We are inclusive by default and allow all organizations that newly meet a monetary threshold to be added.
However, at our discretion, we may remove organizations we feel we cannot promote in good conscience.
Organizations would most commonly be removed if their core charter and/or repeated organization-wide intentional activities:
Expand All @@ -35,5 +51,3 @@ Organizations would most commonly be removed if their core charter and/or repeat
- Finance and/or promote other organizations that match these issues

If you disagree with a choice made by the maintenance team, or would like a refund for your sponsorship, please let us know by emailing `typescripteslint@gmail.com`.

> You can always view all financial contributors on [opencollective.com/typescript-eslint](https://opencollective.com/typescript-eslint).
25 changes: 0 additions & 25 deletions packages/website/data/sponsors.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,199 +3,174 @@
"id": "Indeed",
"image": "https://images.opencollective.com/indeed/4b8725e/logo.png",
"name": "Indeed",
"tier": "sponsor",
"totalDonations": 1005000,
"website": "https://Indeed.com"
},
{
"id": "Nx (by Nrwl)",
"image": "https://images.opencollective.com/nx/0efbe42/logo.png",
"name": "Nx (by Nrwl)",
"tier": "sponsor",
"totalDonations": 550000,
"website": "https://nx.dev"
},
{
"id": "ESLint",
"image": "https://images.opencollective.com/eslint/96b09dc/logo.png",
"name": "ESLint",
"tier": "sponsor",
"totalDonations": 215000,
"website": "https://eslint.org/"
},
{
"id": "Airbnb",
"image": "https://images.opencollective.com/airbnb/d327d66/logo.png",
"name": "Airbnb",
"tier": "sponsor",
"totalDonations": 140800,
"website": "https://www.airbnb.com/"
},
{
"id": "Coinbase",
"image": "https://images.opencollective.com/coinbase/a202856/logo.png",
"name": "Coinbase",
"tier": "sponsor",
"totalDonations": 120000,
"website": "https://blog.coinbase.com/engineering-and-security/home"
},
{
"id": "n8n.io - n8n GmbH",
"image": "https://images.opencollective.com/n8n/dca2f0c/logo.png",
"name": "n8n.io - n8n GmbH",
"tier": "sponsor",
"totalDonations": 115000,
"website": "https://n8n.io"
},
{
"id": "Sentry",
"image": "https://images.opencollective.com/sentry/9620d33/logo.png",
"name": "Sentry",
"tier": "sponsor",
"totalDonations": 114800,
"website": "https://sentry.io/welcome/"
},
{
"id": "GitBook",
"image": "https://images.opencollective.com/gitbook/d35a8e7/logo.png",
"name": "GitBook",
"tier": "sponsor",
"totalDonations": 110000,
"website": "https://www.gitbook.com"
},
{
"id": "Codecademy",
"image": "https://images.opencollective.com/codecademy/d56a48d/logo.png",
"name": "Codecademy",
"tier": "sponsor",
"totalDonations": 100000,
"website": "https://codecademy.com"
},
{
"id": "EY Doberman",
"image": "https://images.opencollective.com/ey-doberman/b269462/logo.png",
"name": "EY Doberman",
"tier": "supporter",
"totalDonations": 80400,
"website": "https://doberman.co"
},
{
"id": "Future Processing",
"image": "https://images.opencollective.com/future-processing/1410d26/logo.png",
"name": "Future Processing",
"tier": "supporter",
"totalDonations": 54000,
"website": "https://www.future-processing.com/"
},
{
"id": "Sourcegraph",
"image": "https://images.opencollective.com/sourcegraph/67e40ff/logo.png",
"name": "Sourcegraph",
"tier": "supporter",
"totalDonations": 50000,
"website": "https://about.sourcegraph.com"
},
{
"id": "Whitebox",
"image": "https://images.opencollective.com/whiteboxinc/ef0d11d/logo.png",
"name": "Whitebox",
"tier": "contributor",
"totalDonations": 40000,
"website": "https://whitebox.com"
},
{
"id": "Monito",
"image": "https://images.opencollective.com/monito/50fc878/logo.png",
"name": "Monito",
"tier": "contributor",
"totalDonations": 30000,
"website": "https://www.monito.com"
},
{
"id": "Codiga",
"image": "https://images.opencollective.com/codiga/1065f9f/logo.png",
"name": "Codiga",
"tier": "contributor",
"totalDonations": 30000,
"website": "https://www.codiga.io"
},
{
"id": "STORIS",
"image": "https://images.opencollective.com/storis/dfb0e13/logo.png",
"name": "STORIS",
"tier": "contributor",
"totalDonations": 27000,
"website": "https://www.storis.com/"
},
{
"id": "revo.js",
"image": "https://images.opencollective.com/revojsro/82623a7/logo.png",
"name": "revo.js",
"tier": "contributor",
"totalDonations": 23000,
"website": "https://revojs.ro"
},
{
"id": "Ian MacLeod",
"image": "https://images.opencollective.com/nevir/35c52ef/avatar.png",
"name": "Ian MacLeod",
"tier": "contributor",
"totalDonations": 22000,
"website": "https://twitter.com/nevir"
},
{
"id": "David Johnston",
"image": "https://images.opencollective.com/blacksheepcode/976d69a/avatar.png",
"name": "David Johnston",
"tier": "contributor",
"totalDonations": 15000,
"website": "https://blacksheepcode.com"
},
{
"id": "Joe Alden",
"image": "https://images.opencollective.com/joealden/44a6738/avatar.png",
"name": "Joe Alden",
"tier": "contributor",
"totalDonations": 14000,
"website": "https://joealden.com"
},
{
"id": "Gianfranco Palumbo",
"image": "https://images.opencollective.com/gianpaj/5d62d25/avatar.png",
"name": "Gianfranco Palumbo",
"tier": "contributor",
"totalDonations": 10000,
"website": "http://gian.xyz"
},
{
"id": "Evil Martians",
"image": "https://images.opencollective.com/evilmartians/707ab4d/logo.png",
"name": "Evil Martians",
"tier": "contributor",
"totalDonations": 10000,
"website": "https://evilmartians.com/"
},
{
"id": "The Guardian",
"image": "https://images.opencollective.com/gdndevelopers/0b72bf0/logo.png",
"name": "The Guardian",
"tier": "contributor",
"totalDonations": 10000,
"website": "https://www.theguardian.com/"
},
{
"id": "Balsa",
"image": "https://images.opencollective.com/balsa/77de498/logo.png",
"name": "Balsa",
"tier": "contributor",
"totalDonations": 10000,
"website": "https://balsa.com"
},
{
"id": "Laserhub",
"image": "https://images.opencollective.com/laserhub/bae6275/logo.png",
"name": "Laserhub",
"tier": "contributor",
"totalDonations": 10000,
"website": "https://laserhub.com/"
}
Expand Down
21 changes: 10 additions & 11 deletions packages/website/src/components/FinancialContributors/Sponsors/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,36 +1,35 @@
import sponsors from '@site/data/sponsors.json';
import clsx from 'clsx';
import React from 'react';

import { Sponsor } from '../Sponsor';
import type { SponsorIncludeOptions } from '../types';
import type { SponsorData, SponsorIncludeOptions } from '../types';
import styles from './styles.module.css';

interface SponsorsProps {
className: string;
include?: SponsorIncludeOptions;
expanded?: boolean;
tier?: string;
sponsors: SponsorData[];
title: string;
tier: string;
}

export function Sponsors({
className,
include,
tier,
title,
tier,
sponsors,
}: SponsorsProps): JSX.Element {
return (
<div className={clsx(styles.tierArea, className)}>
<h3>{title}</h3>
<ul className={clsx(styles.sponsorsTier, styles[`tier-${tier}`])}>
{sponsors
.filter(sponsor => sponsor.tier === tier)
.map(sponsor => (
<li key={sponsor.id}>
<Sponsor include={include} sponsor={sponsor} />
</li>
))}
{sponsors.map(sponsor => (
<li key={sponsor.id}>
<Sponsor include={include} sponsor={sponsor} />
</li>
))}
</ul>
</div>
);
Expand Down
36 changes: 21 additions & 15 deletions packages/website/src/components/FinancialContributors/Sponsors/styles.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
.sponsorsTier li {
list-style: none;
margin: 5px;
max-width: 120px;
max-width: 130px;
}

.sponsorsTier img {
Expand All @@ -29,40 +29,42 @@
border: none;
}

.tier-sponsor {
.tier-platinum-sponsor {
gap: 32px 16px;
}

.tier-sponsor img {
.tier-platinum-sponsor img {
display: inline-block;
max-height: 120px;
max-width: 120px;
width: 120px;
max-height: 130px;
max-width: 130px;
width: 130px;
}

.tier-supporter,
.tier-contributor {
.tier-gold-supporter,
.tier-silver-supporter {
align-items: center;
}

.tier-supporter {
.tier-gold-supporter {
font-size: 0.95rem;
line-height: 1;
gap: 24px;
padding-top: 16px;
gap: 12px;
padding-top: 12px;
}

.tier-supporter img {
.tier-gold-supporter img {
max-height: 75px;
max-width: 75px;
width: 75px;
}

.tier-contributor {
gap: 4px 24px;
.tier-silver-supporter {
gap: 4px 16px;
margin: auto;
max-width: 75%;
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Right now we only have 9 silver supporters. Once we get up to 13 or 14 it'll look more reasonable at full width.

}

.tier-contributor img {
.tier-silver-supporter img {
max-height: 45px;
max-width: 45px;
width: 45px;
Expand All @@ -81,4 +83,8 @@
width: auto;
padding: 0 60px;
}

.tier-gold-supporter {
margin-bottom: 0;
}
}
10 changes: 7 additions & 3 deletions packages/website/src/components/FinancialContributors/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import Link from '@docusaurus/Link';
import sponsors from '@site/data/sponsors.json';
import clsx from 'clsx';
import React from 'react';

Expand All @@ -16,19 +17,22 @@ export function FinancialContributors(): JSX.Element {
<Sponsors
className={styles.tierSponsorArea}
include={{ link: true, name: true }}
tier="sponsor"
tier="platinum-sponsor"
title="Platinum Sponsors"
sponsors={sponsors.slice(0, 6)}
/>
<Sponsors
className={styles.tierSupporterArea}
include={{ link: true }}
tier="supporter"
tier="gold-supporter"
title="Gold Supporters"
sponsors={sponsors.slice(6, 16)}
/>
<Sponsors
className={styles.tierOtherArea}
tier="contributor"
tier="silver-supporter"
title="Silver Supporters"
sponsors={sponsors.slice(16, 34)}
/>
</div>
<div className={styles.linksArea}>
Expand Down
Loading