Blockquote

The blockquote reset provides styles to semantic HTML5 blockquotes.

Styles

The styles applied to blockquotes are versatile, allowing users to provide only paragraphs or paragraphs with semantic <footer> and <cite> elements. Either option will have consistent styling. The accent color used for the top/bottom borders and footer attributions are pulled from the global theme accent background color.

Simplified

Adding a .cwf-blockquote--simplified class to a blockquote, or when a blockquote is used within a card component's body, simplifies its styles to remove the top/bottom borders, reduce padding, and make the leading left double-quote to look like regular text.

Tips

Examples

Two paragraphs

I am a very interesting paragraph in a blockquote that needs extra attention drawn to it.

Name attributed to quote
Credentials
Credentials

Three paragraphs

I am a very interesting paragraph in a blockquote that needs extra attention drawn to it.

I am another paragraph in a blockquote.

Name attributed to quote
Credentials
Credentials

Semantic

I am a very interesting paragraph in a blockquote that needs extra attention drawn to it.

I am another paragraph in a blockquote.

Name attributed to quote
Credentials
Credentials

Simplified

I am a very interesting paragraph in a blockquote that needs extra attention drawn to it.

I am another paragraph in a blockquote.