scales-base-blockquotes v1.1.0

Base Block Quotes for Scales

These are the base styles for block quotes.

Requirements

Scales patterns use the Sass CSS preprocessor, you'll need either Ruby Sass or LibSass.

Installation

• NPM: npm install --save scales-base-blockquotes
• Bower: bower install --save scales-base-blockquotes

Usage

A nice semantic way to markup a blockquote is using the figure element. See http://alistapart.com/blog/post/more-thoughts-about-blockquotes-than-are-strictly-required for the rationale behind this approach.

Default blockquote

<figure>
    <blockquote class="blockquote">
        <p class="blockquote__quote">For me, it is far better to grasp the Universe as it really is than to persist in delusion, however satisfying and reassuring.</p>
    </blockquote>
    <figcaption class="blockquote__source">Carl Sagan, <cite>The Demon-Haunted World</cite></figcaption>
</figure>

Available Classes

• .blockquote
• .blockquote__quote
• .blockquote__source

Available Variables

• $source-prefix

The Scales Namespace Variable

All Scales patterns expose the $scales-namespace variable.

$scales-namespace accepts a string that will prefix all Scales classes. The default value is null.

To give all Scales classes a namespace, you will need to set this variable in a file that is imported before any scales files. For example:

@import your-project/settings; // $scales-namespace is set in this file
@import your-project/scales; // Imports the Scales library
@import your-project/project // The rest of your project imports