pricing tier card with a highlighted "popular" variant.
Install
From your site folder, run:
jprot add CardPriceThat downloads the self-contained component into theme/components/CardPrice.js,
where it is picked up automatically — the same way as any built-in component.
To remove it later, just delete that file.
Use it as a homepage section
Add an entry to the sections: list in jprot.config.js:
sections: [
{ component: 'CardPrice', title: 'CardPrice' },
]Use it inside a page
On its own line in any Markdown file, passing the props:
:::CardPrice name="Pro" price="19" per="mo" text="For growing teams." popular="false" features='["Unlimited pages","Custom domain","Priority mail"]'Props
| Prop | Type | Note |
|---|---|---|
name | string | plan name |
price | string | amount |
per | string | period suffix |
text | string | short pitch |
popular | boolean | highlight the card |
features | array | checkmark list |
ctaLabel | string | button text |