Spoke-spinner

Variables

Module Settings

$config: (
  "size" : 48px,
  "spoke-width" : 3px,
  "spoke-height" : 12px,
  "color" : "accent",
  "border-radius" : 2px,
  "duration" :  1.2s
);

File Information

• File: _spoke-spinner.scss
• Group: spoke-spinner
• Type: variable
• Lines (comments): 13-14
• Lines (code): 16-23

Map of other sizes (use as modifiers), same properties as config/defaults

$styles: ();

File Information

• File: _spoke-spinner.scss
• Group: spoke-spinner
• Type: variable
• Lines (comments): 25-25
• Lines (code): 26-26

Mixins

Change modules $config

File Information

• File: _spoke-spinner.scss
• Group: spoke-spinner
• Type: mixin
• Lines (comments): 28-31
• Lines (code): 33-35

Examples

@include ulu.component-spoke-spinner-set(( "property" : value ));

Parameters

Name	Type	Description
$changes	Map	Map of changes

Require

• $config

Set tag styles

File Information

• File: _spoke-spinner.scss
• Group: spoke-spinner
• Type: mixin
• Lines (comments): 37-39
• Lines (code): 41-43

Parameters

Name	Type	Description
$changes	Map	Map of changes
$merge-mode	String	Merge mode see utils.map-merge() [null

Require

• $styles

Output component stylesheet

File Information

• File: _spoke-spinner.scss
• Group: spoke-spinner
• Type: mixin
• Lines (comments): 54-73
• Lines (code): 75-193

Examples

@include ulu.component-spoke-spinner-styles();

Example markup

<div class="spoke-spinner">
  <div class="spoke-spinner__spinner">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  </div>
</div>

Require

• get()
• $styles

Functions

Get a config option

File Information

• File: _spoke-spinner.scss
• Group: spoke-spinner
• Type: function
• Lines (comments): 45-48
• Lines (code): 50-52

Examples

@include ulu.component-spoke-spinner-get("property");

Parameters

Name	Type	Description
$name	Map	Name of property

Require

• $config