From f723a61a2dcb159630b247d8851a447c9e05ce99 Mon Sep 17 00:00:00 2001 From: scosman Date: Sun, 18 Feb 2024 16:22:32 -0500 Subject: [PATCH 1/2] Improved pricing boilerplate with FAQ template and grid template. Icons were public domain icons. --- .../(marketing)/pricing/pricing_module.svelte | 183 ++++++++++++++++++ 1 file changed, 183 insertions(+) diff --git a/src/routes/(marketing)/pricing/pricing_module.svelte b/src/routes/(marketing)/pricing/pricing_module.svelte index 5cb25ecc..030f0723 100644 --- a/src/routes/(marketing)/pricing/pricing_module.svelte +++ b/src/routes/(marketing)/pricing/pricing_module.svelte @@ -6,6 +6,46 @@ export let callToAction: string export let currentPlanId: string = "" export let center = true + + type PlanFeatureRow = { + name: string + freeIncluded?: boolean + proIncluded?: boolean + freeString?: string + proString?: string + header?: boolean + } + + const planFeatures: PlanFeatureRow[] = [ + { + name: "Section 1", + header: true, + }, + { + name: "Feature 1", + freeIncluded: true, + proIncluded: true, + }, + { + name: "Feature 2", + freeIncluded: false, + proIncluded: true, + }, + { + name: "Section 2", + header: true, + }, + { + name: "Feature 3", + freeIncluded: true, + proIncluded: true, + }, + { + name: "Feature 4", + freeIncluded: false, + proIncluded: true, + }, + ]
{/each}
+ +

Pricing FAQ

+
+
+
+ +
+ Is this template free to use? +
+
+

Yup! This template is free to use for any project.

+
+
+
+ +
+ Why does a free template have a pricing page? +
+
+

+ The pricing page is part of the boilerplate. It shows how the pricing + page integrates into the billing portal and the Stripe Checkout flows. +

+
+
+
+ +
+ What license is the template under? +
+
+

The template is under the MIT license.

+
+
+
+ +
+ Can I try out purchase flows without real a credit card? +
+
+

+ Our demo page SaasStarter.work has a functional demo page, using Stripe's test environment. +

+

+ You can use the credit card number 4242 4242 4242 4242 with any future + expiry date to test the payment and upgrade flows. +

+
+
+
+
+ + + + + + + + + + + + + + + + + +

Plan Features

+

+ Example feature table +

+ +
+ + + + + + + + + + {#each planFeatures as feature} + {#if feature.header} + + + + {:else} + + + + + + {/if} + {/each} + +
FreePro
{feature.name}
{feature.name} + {#if feature.freeString} + {feature.freeString} + {:else if feature.freeIncluded} + + + + {:else} + + + + {/if} + + {#if feature.proString} + {feature.proString} + {:else} + + + + {/if} +
+
From 2fa8695985d694039522d947d70b2d868c417506 Mon Sep 17 00:00:00 2001 From: scosman Date: Sun, 18 Feb 2024 16:23:50 -0500 Subject: [PATCH 2/2] Add "check" to README to match CI --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 7f9f013b..05d264ae 100644 --- a/README.md +++ b/README.md @@ -145,6 +145,7 @@ set -e npm run format_check npm run lint npm run build +npm run check ``` Finally: if you find build, formatting or linting rules too tedious, you can disable enforcement by deleting the CI files (`.github/workflows/*`) and remove the git hook (`.git/hooks/pre-commit`).