Usage

Import the component from its dedicated entry. The component loads its structural styles.

Import the theme in your application entry:

import '@astryx-vue/themes/neutral.css'

Component usage:

<script setup lang="ts">
import { Blockquote } from '@astryx-vue/core/Blockquote'
</script>

<template>
  <Blockquote cite="Steve Jobs">
    Design is not just what it looks like and feels like. Design is how it works.
  </Blockquote>
</template>

Best practices

Guidance	Practices
Do	Use for quoted text, testimonials, or highlighted excerpts from external sources.
Do	Provide a cite prop when the source of the quote is known.
Don't	Use for callout boxes or informational notes; use Banner for those.

Examples

Common quote and attribution configurations.

With attribution

Design is not just what it looks like and feels like. Design is how it works.

The people who are crazy enough to think they can change the world are the ones who do.

Steve Jobs

A quote can stand alone. When its source is known, use cite to credit the author or publication.