BlocksCall To Action Block

1import * as React from "react"
2
3export default function Block({
4  subheading,
5  heading,
6  text,
7  buttons,
8  ...props
9}) {
10  return (
11    <section py="6|8|12|20" {...props}>
12      <div variant="container">
13        {subheading && (
14          <p color="primary" textTransform="uppercase" m="0">
15            {subheading}
16          </p>
17        )}
18        {heading && (
19          <h1 variant="heading.h1" fontWeight="bolder" lineHeight="tight">
20            {heading}
21          </h1>
22        )}
23        {text && (
24          <p variant="text.lead" mt="2">
25            {text}
26          </p>
27        )}
28        {buttons}
29      </div>
30    </section>
31  )
32}

1import * as React from "react"
2import { Icon } from "reflexjs"
3import Block from "../src/components/call-to-action-001"
4
5export default function Example() {
6  return (
7    <Block
8      subheading="Subheading"
9      heading="Start building today"
10      text="Reiciendis quia totam esse. Dicta minus iusto quisquam doloribus temporibus."
11      buttons={
12        <a variant="button.accent.lg" href="#" mt="6">
13          Get started <Icon name="arrow-right" ml="2" size="4" />
14        </a>
15      }
16    />
17  )
18}