Origami Frontend Components & Services

Readme: o-quote

Styling for quotes - block, pull or otherwise.


Add an o-quote class to any quote you wish to apply the styles to.

<blockquote class="o-quote o-quote--standard">
            The prize for this century’s worst technology product probably belongs to Google Glass, a pair of spectacles with an inbuilt camera and a tiny lens on which you could browse the internet. Suddenly you could film everybody you met, or silently ignore them and read Wikipedia.
    <cite class="o-quote__cite"><span class="o-quote__author">Henry Mance</span><span class="o-quote__source">Financial Times</span></cite>


Either extend the base classes to create a custom theme or use the standard theme.

Silent mode (docs)

With $o-quote-is-silent is set to true, the module won't output any styles.
You can then use the mixins directly in your code:

<div class="article-container">
.article-container blockquote {
    @include oQuoteStandard;

    cite {
        @include oQuoteStandardCite;

Migrating from v1.x.x to v2.x.x


This software is published under the MIT licence.

Support Status
Switch component view

GitHub Repository

Install o-quote

If using the Build Service, add o-quote@^2.1.3 to your link tag.

If running a Manual Build, run bower install --save "o-quote@^2.1.3".

Help & Support

o-quote is maintained directly by the Origami team. If you have any questions about o-quote or Origami in general, we are happy to help. 😊

Slack: #ft-origami
Email: origami.support@ft.com

Feedback / Issues

To report a bug or request features please create an issue on Github. For support or general feedback please get in touch 😊

Slack: #ft-origami
Email: origami.support@ft.com