diff --git a/docusaurus.config.js b/docusaurus.config.js index f4b5912..8fae8fe 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -67,6 +67,11 @@ const config = { label: 'Documentation', position: 'left' }, + { + to: '/sponsors', + label: 'Sponsor', + position: 'left' + }, { href: 'https://github.com/cucumber', label: 'GitHub', diff --git a/netlify.toml b/netlify.toml new file mode 100644 index 0000000..2a70909 --- /dev/null +++ b/netlify.toml @@ -0,0 +1,4 @@ +[[redirects]] + from = "/tools/cucumber-open/sponsors" + to = "/sponsors" + status = 301 diff --git a/src/css/custom.scss b/src/css/custom.scss index 8a57eaa..e8346f8 100644 --- a/src/css/custom.scss +++ b/src/css/custom.scss @@ -18,6 +18,12 @@ --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3); } +.readable-blurb { + max-width: 60rem; + margin-left: auto; + margin-right: auto; +} + .footer__copyright { font-size: 0.75rem; line-height: 1em; diff --git a/src/pages/sponsors.module.scss b/src/pages/sponsors.module.scss new file mode 100644 index 0000000..97d73c0 --- /dev/null +++ b/src/pages/sponsors.module.scss @@ -0,0 +1,56 @@ +.tiersList { + display: flex; + list-style: none; + padding: 0; + margin: -0.5rem; +} + +.tiersItem { + box-sizing: border-box; + display: flex; + flex-direction: column; + justify-content: space-between; + width: calc(25% - 1rem); + padding: 2rem; + border: 1px solid var(--ifm-color-secondary); + margin: 0.5rem; +} + +@media all and (max-width: 799px) { + .tiersList { + flex-wrap: wrap; + } + + .tiersItem { + width: calc(50% - 1rem); + } +} + +@media all and (max-width: 499px) { + + .tiersItem { + width: 100%; + } +} + +.tiersAmount { + display: block; + font-weight: 300; + font-size: 2.5rem; + line-height: 1em; +} + +.tiersFrequency { + display: block; + color: var(--ifm-color-secondary-darkest); + font-size: 0.875rem; +} + +.tiersTitle { + margin-top: 0.5rem; +} + +.reasonIllustration { + max-width: 80%; + max-height: 150px; +} diff --git a/src/pages/sponsors.tsx b/src/pages/sponsors.tsx new file mode 100644 index 0000000..8cc358a --- /dev/null +++ b/src/pages/sponsors.tsx @@ -0,0 +1,102 @@ +import React, {FC} from "react"; +import Layout from "@theme/Layout"; +import Link from "@docusaurus/Link"; +import styles from './sponsors.module.scss' +import clsx from "clsx"; + +const numberFormat = new Intl.NumberFormat("en", { style: "currency", currency: "USD", maximumFractionDigits: 0 }) + +const tiers = [ + { + title: 'Individual', + description: 'For individuals who want to support the project', + amount: 5, + url: 'https://opencollective.com/cucumber/contribute/monthly-backers-182/checkout', + from: true + }, + { + title: 'Bronze', + description: 'For small organisations; our most popular tier', + amount: 100, + url: 'https://opencollective.com/cucumber/contribute/bronze-sponsors-181/checkout', + from: false + }, + { + title: 'Silver', + description: 'For organisations of more than 50 people', + amount: 250, + url: 'https://opencollective.com/cucumber/contribute/silver-sponsors-3222/checkout', + from: false + }, + { + title: 'Gold', + description: 'For organisations of more than 100 people', + amount: 500, + url: 'https://opencollective.com/cucumber/contribute/gold-sponsors-3224/checkout', + from: false + } +] as const + +const Tiers: FC = () => { + return
    + {tiers.map(tier => { + return
  1. +
    + {numberFormat.format(tier.amount)} + {tier.from && 'or above, '}monthly +

    {tier.title}

    +

    {tier.description}

    +
    + + Sponsor + +
    2. + })} +
+} + +export default function Sponsors() { + return +
+
+

Sponsor Cucumber

+

Cucumber was downloaded over 100 million times in 2023.

+

Thousands of companies rely on Cucumber tests to validate their software. We are a team of volunteers who maintain the core Gherkin parser, the Java, Ruby, JavaScript and Go flavoured implementations of Cucumber. That's a lot of work!

+

Your sponsorship ensures the team can get paid for their time, and ensures Cucumber will remain a reliable and fun way to test your software for years to come.

+
+
+
+

If you can, we'd love for you to commit a regular amount to support Cucumber

+ +
+
+

Or, you can always make a one-time donation

+

+ Donate +

+
+
+
+

Why sponsor?

+

Your sponsorship will directly contribute to the core team's most important and impactful work:

+
+
+ +

Boring stuff

+

Releases, security, bug fixes, issue triage. Domains, hosting, tools, admin. Unglamorous but essential.

+
+
+ +

Extensibility

+

Adapting our architecture so you - and other tools you love - can extend Cucumber for whatever you need.

+
+
+ +

Documentation

+

Expanding and improving the docs so it's as easy as possible for people to be successful with Cucumber.

+
+
+
+
+ +} diff --git a/static/img/illustrations/admin.svg b/static/img/illustrations/admin.svg new file mode 100644 index 0000000..9240024 --- /dev/null +++ b/static/img/illustrations/admin.svg @@ -0,0 +1,81 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/img/illustrations/code.svg b/static/img/illustrations/code.svg new file mode 100644 index 0000000..d8fbc36 --- /dev/null +++ b/static/img/illustrations/code.svg @@ -0,0 +1 @@ + diff --git a/static/img/illustrations/docs.svg b/static/img/illustrations/docs.svg new file mode 100644 index 0000000..efbaafe --- /dev/null +++ b/static/img/illustrations/docs.svg @@ -0,0 +1 @@ +