DevPatternCard

components/dev/PatternCard.vue

Documentation scaffold for pattern examples — name/description/when header, live example frame, collapsible copyable code.

Hero Section

A headline, supporting copy, and primary action that open a marketing page.

When to use:Opening a landing page with one clear message and call to action.

See every byte. Control every flow.

Qpoint gives you visibility into traffic you didn't know you had.

components/dev/PatternCard.vue

Usage

<DevPatternCard code = "—" > Content here </DevPatternCard>

Props

PropTypeDefaultDescription
codeStringThe copyable pattern code (required)

Slots

SlotDescription
namePattern name
descriptionWhat the pattern is
whenWhen to use it
defaultThe live example

Related

Qpoint Brand Style Guide