@illinois-toolkit/ilw-quote

ilw-quote

Links: ilw-quote in Builder | Illinois Web Theme | Toolkit Development

Overview

This component represents a quote or testimonial, with optional attribution of author and source. The quote or testimonial is intended to be intermixed with copy and the quote is highlighted and called out.

Quotation marks are added automatically before and after the quote.

This component should not contain a heading element.

The quote should be contained within a paragraph element with the slot attribute set to "content". The author should be contained within a paragraph element with the slot attribute set to "author". The source should be contained within a cite element with the slot attribute set to "source".

Code Examples

<ilw-quote>
    <p slot="content">Either university presses will embrace new technology and offer scholarly content in new forms
        to researchers and under new business models, or they will follow the music industry and spend
        all of their resources on trying to protect their territory &mdash; unsuccessfully.</p>
    <p slot="author">Laura Cerruti</p>
    <cite slot="source">Director of Digital Content Development, University of California Press, profiled in Against the Grain</cite>
</ilw-quote>

Upgrade Process

• Rename il-quote to ilw-quote
• For the content, place it inside a p tag with a slot attribute slot="content"
• for the author, change slot="attributed" to slot="author"
• for the source, change p tag to cite tag and change slot="secondary" to slot="source"

External References

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote

https://theadminbar.com/accessibility-weekly/coding-blockquotes/