Loading

• src
• components
• loading.scss

Class list

Description

The .loading element inherits its font size from its parent element. The size of the .loading element is 1:1 with the font size that is applied to it.

Example

<span class="loading h4"></span>

Multipliers

Use the multiplier classes on a .loading to change the size ratio in relation to whatever font-size is applied to the .loading element.

<span class="loading"></span>
<span class="loading x2"></span>
<span class="loading x3"></span>
<span class="loading x4"></span>

Paused

<span class="loading x4 is-paused"></span>

Reversed

<span class="loading x4 is-reversed"></span>

Font size scaling

Use the font-size utility classes on a .loading to change its size.

<span class="loading h6"></span>
<span class="loading h5"></span>
<span class="loading h4"></span>
<span class="loading h3"></span>
<span class="loading h2"></span>
<span class="loading h1"></span>