A CTA (call to action) block is a pattern that is used to encourage users to take a specific action. This could be to learn more details about a product, contact someone, or to download a file.
The CTA block can be used without a border. This is useful when the CTA block is stacked beneath related content.
.p-cta-block
Main element of the CTA block.
&.is-borderless
Borderless variant, to be used to hide top border and padding.
To import just this component into your project, copy the snippet below and include it in your main Sass file.
// import Vanilla and include base mixins
// this only needs to happen once in a given project
@import 'vanilla-framework';
@include vf-base;
@include vf-p-cta-block;
@include vf-p-buttons;
For more information see Customising Vanilla in your projects, which includes overrides and importing instructions.