Arrow

The .arrow-<color> classes create an arrow shape. Height can be controlled by adding a .h1, .h2, ... tag.

{% apply view_source %}

H1

.h1

Centered

Shadow

H2

.h2

Centered

Shadow

H3

.h3

Centered

Shadow

H4

.h4

Centered

Shadow

{% end %}

For large heights, use the .display-* classes.

{% apply view_source %}

Display-1

Display-2

Display-3

Display-4

{% end %}

Stages

To create phases / stages, add a .arrow-tail class to add a tail to the arrow.

{% apply view_source %}
First
Second
Third
Fourth
{% end %}

TODO: Allow arrows to overlap.