Skip to content
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.

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

Add sponsors section to website #16010

Open
wants to merge 5 commits into
base: main
Choose a base branch
from

Conversation

sosukesuzuki
Copy link
Member

@sosukesuzuki sosukesuzuki commented Feb 2, 2024

Description

Closes #15974

We have determined the sponsorship tiers and will be listing them on the website. The tiers are set as follows:

Tier Monthly Donation
Gold $500~/month
Silver $300 ~ $500/month
Bronze $100 ~ $300/month
Backers Up to $100/month

I added a script to fetch the sponsors information, so we can update it by running it manually ( yarn gen:sponsors ). This script only fetches OpenCollective information for now, but we'll change it later to also reference GitHub Sponsors.

Checklist

  • I’ve added tests to confirm my change works.
  • (If changing the API or CLI) I’ve documented the changes I’ve made (in the docs/ directory).
  • (If the change is user-facing) I’ve added my changes to changelog_unreleased/*/XXXX.md file following changelog_unreleased/TEMPLATE.md.
  • I’ve read the contributing guidelines.

Rendered

@sosukesuzuki sosukesuzuki marked this pull request as ready for review February 2, 2024 14:19
website/static/overrides.css Show resolved Hide resolved
@@ -365,6 +438,7 @@ class Index extends React.Component {
<HomeSplash language={language} />
<div className="mainContainer landingContainer">
<TldrSection language={language} />
<SponsorsSection />
Copy link
Member

Choose a reason for hiding this comment

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

WDYT of placing this section towards the bottom of the page?

Screenshot 2024-02-03 at 09 55 47

If I am new to Prettier, I want to learn about its benefits first. Placing sponsors before the list of languages and editors breaks the narrative and does not help build an argument towards using Prettier. The list of sponsors is similar to ‘Used By People You Rely On’ and ‘Established in the Ecosystem’. It’s a confirmation of popularity and trust. Whoever explores the first page will probably scroll through it, so placing the sponsors last can even bring more attention to this section (because scrolling will stop there).

If Sponsors are placed last, it might not be necessary to re-align the header.

const tierDescription = new Map([
[
"gold",
"Gold sponsors are those who have donated an average of $500 over the past 12 months.",
Copy link
Member

@kachkaev kachkaev Feb 3, 2024

Choose a reason for hiding this comment

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

I got a bit confused by the method when I first bumped into this. Was it $500 per month over the last 12 month or $500 total over the last year? We can think of rephrasing, but how about changing the method instead?

One of the goals of this section is to encourage companies to donate. For me to become a gold sponsor with the current method, I need to transfer $500×12 right on the spot. That’s quite a lot, unless I want to wait. Waiting is discouraging.

If we just look at the last month, getting into the list of sponsors will become easier. I can pay $500 and see my company in the list right away. If I stop donating, my company will disappear from the list within a month, so I’d rather keep the donations running.

If there are companies donating big sums of money per year, maybe we can still calculate annual totals as a fallback method, but there should be a way of jumping into the list by paying $500 today. WDYT?

@kachkaev
Copy link
Member

kachkaev commented Feb 3, 2024

👋 @rauchg! If you have a minute, can you please upload an avatar for https://opencollective.com/rauchg2? You can copy it from https://opencollective.com/rauchg. You avatar is currently missing in the preview deployment:
Screenshot 2024-02-03 at 10 23 57

We can hack this on the Prettier side, but there may be other sponsored projects that would want to your avatar. Thanks for supporting Prettier 🙌

);
for (const [, sponsor] of sortedSponsors) {
sponsor.monthlyDonations = Math.round(sponsor.monthlyDonations);
if (sponsor.monthlyDonations >= 50000) {
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
if (sponsor.monthlyDonations >= 50000) {
if (sponsor.monthlyDonations >= 60000) { // 500 × 12

@fisker
Copy link
Member

fisker commented Feb 3, 2024

Looks better to me without this padding on cellphone.

image

Before:

image

After:

image

Co-authored-by: Alexander Kachkaev <alexander@kachkaev.ru>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Put our sponsor's logo on https://prettier.io and README
3 participants