Examples
Default styling
PREPARE FOR A SPECTACULAR NIGHT OF COMEDY
On website image will be 4:3 on mobile
.paragraph--full-height-single-image-single-copy--image-right
image right
PREPARE FOR A SPECTACULAR NIGHT OF COMEDY
On website image will be 4:3 on mobile
Markup: components/full-height-single-image-single-copy/full-height-single-image-single-copy.twig
<section class="paragraph--full-height-single-image-single-copy {{modifier_class}} bg--dark-blue">
<div class="fhsisc__image-wrapper objectfit">
<img src="kss-assets/images/spice_3-4_2x.jpg">
</div>
<div class="fhsisc__text-wrapper">
<div class="fhsisc__text cr-body">
<h1 class="font--white text-align-center">
PREPARE FOR A SPECTACULAR NIGHT OF COMEDY
</h1>
<p class="text-align-center font--white">On website image will be 4:3 on mobile</p>
<p class="text-align-center"><a class="btn btn--ruby" href="https://www.comicrelief.com/#newsletter" title="find out more about Spectacular">Sign up for pre-sale tickets</a></p>
</div>
</div>
</section>
Source:
_sr18-styleguide.scss
, line 142