ProseHero
components/prose/Hero.vue
Full-width hero section with title, subtitle, description, CTA slot, and optional image. The standard page opener for marketing pages.
See Every Connection
Real-time visibility into encrypted traffic
Deploy in minutes. No sidecars, no proxies, no code changes.
components/prose/Hero.vue
Usage
<ProseHero
title = "—"
subTitle = "—"
description = "—"
image = "null"
imageAlt = "—"
:maxImgWidth = "maxImgWidth"
:screenshot = "false"
>
Content here
</ProseHero>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| title | String | — | Main heading (required, supports HTML) |
| subTitle | String | '' | Secondary heading below the title |
| description | String | — | Body text (required, supports HTML) |
| image | String | null | Hero image URL |
| imageAlt | String | '' | Alt text for the hero image |
| maxImgWidth | String | Number | null | Max width in px for the hero image |
| screenshot | Boolean | false | Adds screenshot styling to the image container |
Slots
| Slot | Description |
|---|---|
| default | CTA buttons or additional content below the description |
| right | Optional content in the right column (replaces image) |