Readme: o-loading

This is an Origami component that provides a visual loading indicator.

Usage

Loading indicators come in the following themes:

• light
• dark

And the following sizes:

• small
• medium
• large

Mixins, silent mode and classes

Mixins and silent mode are only available if you're including o-loading in your project using Bower. If you're using o-loading via the build service, you must use the o-loading classes instead. Both are documented below.

Full documentation of mixins and variables

Default loading indicator

<div class="o-loading o-loading--light o-loading--small"></div>

$o-loading-is-silent: false;
@import 'o-loading/main';

Custom loading indicator

@import 'o-loading/main';

.my-custom-indicator {
    @include oLoading();
    @include oLoadingSize('small');
    @include oLoadingColor('light');
}

Migration guide

Migrating from 1.X.X to 2.X.X

V1 -> V2 introduces the new majors of o-colors. Updating to this new version will mean updating any other components that you have which are using o-colors. There are no other breaking changes in this release.

Contact

If you have any questions or comments about this component, or need help using it, please either raise an issue, visit #ft-origami or email Origami Support.

Licence

This software is published by the Financial Times under the MIT licence.