Origami Frontend Components & Services

Demos: o-promobox deprecated

o-promobox is deprecated. This component should not be used for new projects. Only security-related bugs will be fixed for this component, though existing implementations will continue to work.

Base

<div class="o-promobox">
	<h3 class="o-promobox__title">Repeating work&#x2026; again, again, again</h3>
	<img class="o-promobox__image" src="https://www.ft.com/__origami/service/image/v2/images/raw/http:%2F%2Forigami.ft.com%2Fimg%2Fdevices.png?width=167&amp;source=docs" alt="Duplication, duplication, duplication ">
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam erat justo, placerat sed sem a, mattis semper lectus. Vestibulum molestie sem eget pulvinar volutpat. Donec nulla enim, scelerisque at dictum placerat, elementum at sem. Duis ut nisi at risus eleifend euismod. Curabitur eget velit nulla. In ac ullamcorper nisl, ut iaculis libero. Integer pharetra faucibus elit, at molestie tortor eleifend at.</p>
</div>

Skinny

<div class="o-promobox o-promobox--skinny">
	<h3 class="o-promobox__title">Repeating work&#x2026; again, again, again</h3>
	<img class="o-promobox__image" src="https://www.ft.com/__origami/service/image/v2/images/raw/http:%2F%2Forigami.ft.com%2Fimg%2Fdevices.png?width=167&amp;source=docs" alt="Duplication, duplication, duplication ">
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam erat justo, placerat sed sem a, mattis semper lectus. Vestibulum molestie sem eget pulvinar volutpat. Donec nulla enim, scelerisque at dictum placerat, elementum at sem. Duis ut nisi at risus eleifend euismod. Curabitur eget velit nulla. In ac ullamcorper nisl, ut iaculis libero. Integer pharetra faucibus elit, at molestie tortor eleifend at.</p>
</div>

Standard

<div class="o-promobox o-promobox--standard">
	<h3 class="o-promobox__title">Repeating work&#x2026; again, again, again</h3>
	<img class="o-promobox__image" src="https://www.ft.com/__origami/service/image/v2/images/raw/http:%2F%2Forigami.ft.com%2Fimg%2Fdevices.png?width=167&amp;source=docs" alt="Duplication, duplication, duplication ">
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam erat justo, placerat sed sem a, mattis semper lectus. Vestibulum molestie sem eget pulvinar volutpat. Donec nulla enim, scelerisque at dictum placerat, elementum at sem. Duis ut nisi at risus eleifend euismod. Curabitur eget velit nulla. In ac ullamcorper nisl, ut iaculis libero. Integer pharetra faucibus elit, at molestie tortor eleifend at.</p>
</div>

Standard-skinny

<div class="o-promobox o-promobox--skinny o-promobox--standard">
	<h3 class="o-promobox__title">Repeating work&#x2026; again, again, again</h3>
	<img class="o-promobox__image" src="https://www.ft.com/__origami/service/image/v2/images/raw/http:%2F%2Forigami.ft.com%2Fimg%2Fdevices.png?width=167&amp;source=docs" alt="Duplication, duplication, duplication ">
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam erat justo, placerat sed sem a, mattis semper lectus. Vestibulum molestie sem eget pulvinar volutpat. Donec nulla enim, scelerisque at dictum placerat, elementum at sem. Duis ut nisi at risus eleifend euismod. Curabitur eget velit nulla. In ac ullamcorper nisl, ut iaculis libero. Integer pharetra faucibus elit, at molestie tortor eleifend at.</p>
</div>
Switch component view

GitHub Repository

Install o-promobox

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

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

Help & Support

o-promobox is maintained directly by the Origami team. If you have any questions about o-promobox 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