Commentary

The blockquote component is a simple container that conforms to web accessibility best practice (see Mozilla). It's layout is in a classic format that is common for content pages. It includes top and bottom margins to fit into the text flow.

Usage

Classes:
.blockquote Defines typically a figure HTML tag as container.
Dependencies:
File: blockquote.css
Variables: --element-background, --family-serif, --line-height-125, --line-height-150, --margin-form, --pad-horz, --pad-vert, --secondary, --size-5, --text-darker, --weight-medium

Examples

Profit is not the purpose of a business, but rather the test of its validity. The purpose of a business is to create and keep a customer.

Peter Drucker, Innovation and Entrepreneurship

                <figure class="blockquote">
                    <blockquote cite="https://www.goodreads.com/quotes/search?utf8=%E2%9C%93&q=peter+drucker+purpose&commit=Search">
                        <p>Profit is not the purpose of a business, but rather the test of its validity.
                            The purpose of a business is to create and keep a customer. </p>
                    </blockquote>
                    <figcaption>
                        <a href="https://en.wikipedia.org/wiki/Peter_Drucker" target="_blank">Peter Drucker</a>,
                        <cite>Innovation and Entrepreneurship</cite>
                    </figcaption>
                </figure>