Vignette
Create a vignette effect around image/video/etc
Variables
$config
Variable Type: Map
Module Settings
$config: (
"background-color" : rgb(0,0,0),
"image-filter" : saturate(85%)
);
File Information
- File: _vignette.scss
- Group: vignette
- Type: variable
- Lines (comments): 13-16
- Lines (code): 18-21
Map Properties
Name | Type | Default | Description |
---|---|---|---|
background-color | Color | rgb(0,0,0) | Color used for the fade-in of the vignette. Must be actual color not color module palette name |
image-filter | CssValue | saturate(85%) | Filter value placed over image. |
Mixins
set()
Mixin
Change modules $config
File Information
- File: _vignette.scss
- Group: vignette
- Type: mixin
- Lines (comments): 23-26
- Lines (code): 28-30
Examples
@include ulu.component-vignette-set(( "property" : value ));
Parameters
Name | Type | Description |
---|---|---|
$changes | Map |
Map of changes |
Require
styles()
Mixin
Output component stylesheet
File Information
- File: _vignette.scss
- Group: vignette
- Type: mixin
- Lines (comments): 41-43
- Lines (code): 45-63
Examples
@include ulu.component-vignette-styles();
Require
Functions
get()
Function
Get a config option
File Information
- File: _vignette.scss
- Group: vignette
- Type: function
- Lines (comments): 32-35
- Lines (code): 37-39
Examples
@include ulu.component-vignette-get("property");
Parameters
Name | Type | Description |
---|---|---|
$name | Map |
Name of property |