| 1 | --- |
| 2 | import Button from "./Button.astro"; |
| 3 | import Section from "./Section.astro"; |
| 4 | |
| 5 | interface Props { |
| 6 | heading: string; |
| 7 | } |
| 8 | const { heading } = Astro.props; |
| 9 | --- |
| 10 | |
| 11 | <Section padding="20px 32px 40px"> |
| 12 | <div class="alc-cta"> |
| 13 | <h2 class="alc-h2">{heading}</h2> |
| 14 | <div class="alc-cta__buttons"> |
| 15 | <Button variant="primary" icon="arrow" href="/getting-started">Start the tutorial</Button> |
| 16 | <Button variant="secondary" href="/">Read the docs</Button> |
| 17 | <Button variant="ghost" icon="github" href="https://github.com/alchemy-run/alchemy">GitHub</Button> |
| 18 | </div> |
| 19 | </div> |
| 20 | </Section> |
| 21 | |
| 22 | <style> |
| 23 | .alc-cta { |
| 24 | text-align: center; |
| 25 | } |
| 26 | .alc-cta__buttons { |
| 27 | display: flex; |
| 28 | gap: 10px; |
| 29 | justify-content: center; |
| 30 | flex-wrap: wrap; |
| 31 | margin-top: 16px; |
| 32 | } |
| 33 | </style> |