Style Guide

Button Styles

Buttons can be added by using the button tag or adding a class of button to an element, usually and anchor tag. See an example below:

<a class="button" href="http://celtic7.com">Button Name</a>

Button Default Info Success Warning Danger

Pull Quotes Styles

To use the pull quote, you simply need to add a class of pull-right or pull-left to your content. This can be done in the Text editor view. See an example below:

<span class="pull-right">Pull this text right.</span>

This pull quote is pull to the right side of the content.

A pull quote (also known as a lift-out quote) is a quotation or excerpt from an article that is typically placed in a larger or distinctive typeface on the same page, serving to entice readers into an article or to highlight a key topic. The term is principally used in journalism and publishing.

Placement of a pull quote on a page may be defined in a publication’s or website’s style guide. Such a typographic device may or may not be aligned with a column on the page. Some designers, for example, choose not to align the quote. In that case, the quotation cuts into two or more columns, as in the example shown.

This pull quote is pull to the left side of the content.

Pull quotes need not be a verbatim copy of the text being quoted; depending on a publication’s house style pull quotes may be abbreviated for space and/or paraphrased for clarity, with or without indication. A quotation can also refer to the repeated use of units of any other form of expression.

Drop Cap Styles

To use a drop cap, you simply need to add a class of drop-cap to your content. This can be done in the Text editor view. See an example below:

<p class="drop-cap">Drop cap example.</p>

Alternatively, you can wrap a single letter in a tag. See an example below:

<span class="drop-cap">D</span>rop cap example.