Scroll-slider
Overflow scrolling slider component (use with ui/overflow-scroller.js)
Variables
$config
Variable Type: Map
Module Settings
$config: (
"background-color" : false,
"container" : "container",
"containers" : ("container",),
"margin-bottom" : 3rem,
"margin-top" : 1rem,
"padding-bottom" : 0,
"padding-top" : 0,
"prefix": "scroll-slider",
"button-border" : 2px solid white,
"button-border-color-hover" : white,
"button-border-radius" : 50%,
"button-box-shadow" : element.get("box-shadow"),
"button-color" : color.get("type"),
"button-color-hover" : color.get("link"),
"button-font-size" : 1.35rem,
"button-icon-offset-x" : false,
"button-icon-offset-y" : false,
"button-indent" : 1.5rem,
"button-indent-small" : 0.5rem,
"button-size" : 3rem,
);
File Information
- File: _scroll-slider.scss
- Group: scroll-slider
- Type: variable
- Lines (comments): 15-36
- Lines (code): 38-59
Map Properties
Name | Type | Default |
---|---|---|
background-color | Color | false |
container | String | "container" |
containers | List | ("container",) |
margin-bottom | Dimension | 3rem |
margin-top | Dimension | 1rem |
padding-bottom | Dimension | 0 |
padding-top | Dimension | 0 |
prefix | String | "scroll-slide" |
button-border | CssValue | 2px solid white |
button-border-color-hover | Color | white |
button-border-radius | Dimension | 50% |
button-box-shadow | CssValue | element.get("box-shadow") |
button-color | Color | color.get("type") |
button-color-hover | Color | color.get("link") |
button-font-size | Dimension | 1.35rem |
button-indent | Dimension | 1.5rem |
button-indent-small | Dimension | 0.5rem |
button-size | Dimension | 3rem |
button-icon-offset-x | Dimension | false |
button-icon-offset-y | Dimension | false |
Mixins
set()
Mixin
Change modules $config
File Information
- File: _scroll-slider.scss
- Group: scroll-slider
- Type: mixin
- Lines (comments): 61-64
- Lines (code): 66-68
Examples
@include ulu.component-scroll-slider-set(( "property" : value ));
Parameters
Name | Type | Description |
---|---|---|
$changes | Map |
Map of changes |
Require
styles()
Mixin
Output component stylesheet
File Information
- File: _scroll-slider.scss
- Group: scroll-slider
- Type: mixin
- Lines (comments): 79-81
- Lines (code): 83-200
Examples
@include ulu.component-scroll-slider-styles();
Require
Functions
get()
Function
Get a config option
File Information
- File: _scroll-slider.scss
- Group: scroll-slider
- Type: function
- Lines (comments): 70-73
- Lines (code): 75-77
Examples
@include ulu.component-scroll-slider-get("property");
Parameters
Name | Type | Description |
---|---|---|
$name | Map |
Name of property |