Section
Centred band
A copied section band. Paste it in, then own every line: it never upgrades under semver.
Stop writing chase emails
Free for 30 days. No card, no setup call, no data import to sit through.
{% comment %}
CTA / centred band: the tinted band that closes a page.
Beat Phase D journey: Marketing CTA (icvoss/django-brickwork#544). Dual CTA
(primary + secondary) on the tinted band. Recolour by overriding brand tokens
only (`--bw-color-accent`, `--bw-color-surface-marketing-tint`, and the rest
of the brand-pack delta); do not fork this markup or marketing.css. See
docs/examples/brand-pack/ and docs/BRANDING.md.
The shipped _cta.html already is this, so the example is the include.
band="tint" is the default and composes --bw-color-surface-marketing-tint,
which is contrast-checked in both themes. Pass band="plain" to sit the same
content on the page surface instead, when the page already has enough bands.
A heading is REQUIRED: with no heading the component renders nothing at all
rather than an empty band. That is deliberate across this kit.
States: none of its own: see _cta.html's own header (the include this file
wraps) for the full states/accessibility/responsive contract, unchanged
here.
Accessibility: see _cta.html.
Responsive: see _cta.html; band="tint" and width (defaulted here to
"contained") are the same CSS-only axes documented there.
{% endcomment %}
{% include "brickwork_marketing/components/_cta.html" with heading="Stop writing chase emails" body="Free for 30 days. No card, no setup call, no data import to sit through." primary_cta_label="Start free trial" primary_cta_href="/accounts/signup/" secondary_cta_label="Talk to us" secondary_cta_href="/contact/" %}
Details
| Kind | Section |
|---|---|
| Used in | None (a document skeleton, used everywhere) |
Composed from
| Template | Description |
|---|---|
brickwork_marketing/components/_cta.html |
A call-to-action band with a heading and buttons. |