@moodxd/component-image v1.0.3

MoO Image

Standard

<div class="Image" style="background-image:url(https://ununsplash.imgix.net/photo-1420708392410-3c593b80d416?fit=crop&amp;fm=jpg&amp;q=75&amp;w=950)"></div>

Fluid

<div class="Image Image--fluid" style="background-image:url(https://ununsplash.imgix.net/photo-1420708392410-3c593b80d416?fit=crop&amp;fm=jpg&amp;q=75&amp;w=950)"></div>

Short

<div class="Image Image--short" style="background-image:url(https://ununsplash.imgix.net/photo-1420708392410-3c593b80d416?fit=crop&amp;fm=jpg&amp;q=75&amp;w=950)"></div>

Tall

<div class="Image Image--fluid Image--tall" style="background-image:url(https://ununsplash.imgix.net/photo-1420708392410-3c593b80d416?fit=crop&amp;fm=jpg&amp;q=75&amp;w=950)"></div>

Full Height

<div style="height: 500px;">
  <div class="Image Image--fluid Image--fullHeight" style="background-image:url(https://ununsplash.imgix.net/photo-1420708392410-3c593b80d416?fit=crop&amp;fm=jpg&amp;q=75&amp;w=950)"></div>
</div>

Centered

<div class="Image Image--centered" style="background-image:url(https://ununsplash.imgix.net/photo-1420708392410-3c593b80d416?fit=crop&amp;fm=jpg&amp;q=75&amp;w=950)"></div>

Side Left

<div class="Image Image--sideLeft" style="background-image:url(https://ununsplash.imgix.net/photo-1420708392410-3c593b80d416?fit=crop&amp;fm=jpg&amp;q=75&amp;w=950)"></div>

Side Right

<div class="Image Image--sideRight" style="background-image:url(https://ununsplash.imgix.net/photo-1420708392410-3c593b80d416?fit=crop&amp;fm=jpg&amp;q=75&amp;w=950)"></div>