Breadcrumb

Variables

Module Settings

$config: (
  "row-gap":              0.5em,
  "margin" :              (0 0 1.25em 0),
  "color":                 "type-tertiary",
  "color-hover":           "link-hover",
  "line-height":           true,
  "item-max-width":        15em,
  "separator-margin":      (0 0.5em),
  "separator-color":       null,
  "separator-opacity":     0.7,
);

File Information

• File: _breadcrumb.scss
• Group: breadcrumb
• Type: variable
• Lines (comments): 24-34
• Lines (code): 36-46

Map Properties

Name	Type	Default	Description
margin	List	(0 0 1.25em 0)	Margin for component
row-gap	CssUnit	0.35em	Gap when breadcrumbs wrap
color	Color	"type-tertiary"	Base color (links inherit this)
color-hover	Color	"link-hover"	Color for link hover
line-height	CssUnit	true	Line height, defaults to typography line-height-densest
item-max-width	CssUnit	15em	Max length of item text
separator-color	Color	null	Optional color to apply to separator
separator-opacity	Number	0.7	Optional opacity for separator
separator-margin	List	(0 0.5em)	Separator margin

Mixins

Change modules $config

File Information

• File: _breadcrumb.scss
• Group: breadcrumb
• Type: mixin
• Lines (comments): 48-51
• Lines (code): 53-55

Examples

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

Parameters

Name	Type	Description
$changes	Map	Map of changes

Require

• $config

Prints component styles

File Information

• File: _breadcrumb.scss
• Group: breadcrumb
• Type: mixin
• Lines (comments): 67-70
• Lines (code): 72-110

Examples

@include ulu.component-breadcrumb-styles();

Require

• get()

Functions

Get a config option

File Information

• File: _breadcrumb.scss
• Group: breadcrumb
• Type: function
• Lines (comments): 57-60
• Lines (code): 62-65

Examples

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

Parameters

Name	Type	Description
$name	Map	Name of property

Require

• $config