装入

这个 折纸 提供了可视加载指标的组件.

• 使用量
• 标记
• 萨斯
• 移徙指南
• 联系人
• 许可证

使用量

检查出来 如何将 Origami 组件纳入您的项目 开始 o-loading。 。 。 .

标记

为了在产品中显示加载指标,您需要在标记中提供主题和大小修饰符,例如:

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

萨斯

为了输出主题和规模上的所有变化 o-loading,您需要包括以下内容:

@import '@financial-times/o-loading/main';

@include oLoading();

通过使用一个地图,您还可以对您想要输出的加载指示器的主题或大小进行更多的选择. 这个 $opts 地图接受两个列表:

主题 :

• 光线
• 阴暗

而"尺寸":

• 小型
• 小数
• 介质
• 大块

@import '@financial-times/o-loading/main';

@include oLoading(
    $opts: (
        'themes': (
            'light',
        ),
        'sizes': (
            'medium',
            'large',
        ),
    )
);

// outputs a large light spinner and a medium light spinner

如果需要将一个加载自旋器建入一个组件,例如,可以使用以下混合:

@import '@financial-times/o-loading/main';

.my-loading-spinner {
    @include oLoadingContent(
        $opts: (
            'theme': 'light',
            'size': 'small',
        )
    );
}

移徙指南

联系人

如果您对本部分有任何问题或评论,或需要帮助使用本部分,请 提出问题访问 #origami - 支持 或电子邮件 折纸支持。 。 。 .

许可证

本软件由金融时报根据以下规定出版: 麻省理工学院许可证。 。 。 .