/*******************************

List

*******************************/

/*——————-

View

——————–*/

/* List */ @listStyleType: none; @listStylePosition: outside; @margin: 1em 0em; @verticalPadding: 0em; @horizontalPadding: 0em;

/* Sub List */ @childListPadding: 0.75em 0em 0.25em 0.5em; @childListIndent: 1em;

/* List Item */ @itemVerticalPadding: 0.3em; @itemHorizontalPadding: 0em; @itemLineHeight: 1.2;

/*——————-

Elements

——————–*/

/* Icon */ @iconDistance: 0.3em; @iconOffset: ((@itemLineHeight - 1rem) / 2); @iconTransition: color 0.2s ease; @iconVerticalAlign: top; @iconContentVerticalAlign: middle;

/* Image */ @imageDistance: 0.5em; @imageAlign: middle;

/* Content */ @contentDistance: 0.5em; @contentLineHeight: 1.2em; @contentLineHeightOffset: (@contentLineHeight - 1em) / 2; @contentVerticalAlign: middle;

/* Link */ @itemLinkColor: @textColor; @itemLinkHoverColor: @linkHoverColor;

/* Linked Icon */ @itemLinkIconColor: @lightTextColor; @itemLinkIconHoverColor: @textColor; @invertedIconLinkColor: @invertedLightTextColor;

/* Header */ @itemHeaderFontFamily: @headerFont; @itemHeaderFontWeight: bold; @itemHeaderColor: @textColor;

/* Description */ @itemDescriptionColor: @textColor;

/*——————-

States

——————–*/

@disabledColor: @disabledTextColor; @invertedDisabledColor: @invertedDisabledTextColor;

/*——————-

Variations

——————–*/

/* Float */ @floatDistance: 1em; @leftFloatMargin: 0em @floatDistance 0em 0em; @rightFloatMargin: 0em 0em 0em @floatDistance;

/* Horizontal */ @horizontalSpacing: 1em; @horizontalIconDistance: 0.25em;

/* Inverted */ @invertedListIconColor: @invertedLightTextColor; @invertedHeaderColor: @invertedTextColor; @invertedDescriptionColor: @invertedLightTextColor; @invertedItemLinkColor: @invertedTextColor; @invertedItemLinkHoverColor: @linkHoverColor;

/* Link List */ @linkListItemColor: @unselectedTextColor; @linkListItemHoverColor: @hoveredTextColor; @linkListItemDownColor: @pressedTextColor; @linkListItemActiveColor: @selectedTextColor; @linkListTransition:

0.2s color @defaultEasing

;

/* Inverted Link List */ @invertedLinkListItemColor: @invertedUnselectedTextColor; @invertedLinkListItemHoverColor: @invertedHoveredTextColor; @invertedLinkListItemDownColor: @invertedPressedTextColor; @invertedLinkListItemActiveColor: @invertedSelectedTextColor;

/* Selection List */ @selectionListItemMargin: 0em; @selectionListItemBorderRadius: 0.5em; @selectionListItemVerticalPadding: 0.5em; @selectionListItemHorizontalPadding: 0.5em; @selectionListTransition:

0.2s color @defaultEasing,
0.2s padding-left @defaultEasing,
0.2s background-color @defaultEasing

;

/* Selection List States */ @selectionListBackground: transparent; @selectionListColor: @unselectedTextColor; @selectionListHoverBackground: @subtleTransparentBlack; @selectionListHoverColor: @hoveredTextColor; @selectionListDownBackground: @transparentBlack; @selectionListDownColor: @pressedTextColor; @selectionListActiveBackground: @transparentBlack; @selectionListActiveColor: @selectedTextColor;

/* Inverted Selection List */ @invertedSelectionListBackground: transparent; @invertedSelectionListColor: @invertedUnselectedTextColor; @invertedSelectionListHoverBackground: @subtleTransparentWhite; @invertedSelectionListHoverColor: @invertedHoveredTextColor; @invertedSelectionListDownBackground: @transparentWhite; @invertedSelectionListDownColor: @invertedPressedTextColor; @invertedSelectionListActiveBackground: @transparentWhite; @invertedSelectionListActiveColor: @invertedSelectedTextColor;

/* Animated List */ @animatedListTransition:

0.2s color ease,
0.2s padding-left ease,
0.2s background-color ease

; @animatedListIndent: 1em;

/* Bulleted */ @bulletDistance: 1rem; @bulletOffset: -1rem;

@bulletOpacity: 1; @bulletCharacter: ‘•’; @bulletColor: @textColor; @bulletVerticalAlign: top; @bulletChildDistance: @bulletDistance;

/* Horizontal Bullets */ @horizontalBulletSpacing: 1.5rem;

/* Ordered List */ @orderedCountName: ordered; @orderedCountContent: counters(ordered, “.”) “ ”; @orderedCountColor: @textColor; @orderedCountDistance: 1.25rem; @orderedCountOpacity: 0.8; @orderedCountTextAlign: right; @orderedCountVerticalAlign: middle;

@orderedChildCountDistance: 1em; @orderedChildCountOffset: -2em;

/* Horizontal Ordereded */ @horizontalOrderedCountDistance: 0.5em;

/* Divided */ @dividedBorderWidth: 1px; @dividedBorder: @dividedBorderWidth solid @borderColor; @dividedInvertedBorderColor: @whiteBorderColor; @dividedChildListBorder: none; @dividedChildItemBorder: none;

/* Divided Horizontal */ @horizontalDividedSpacing: (@horizontalSpacing / 2); @horizontalDividedLineHeight: 0.6;

/* Divided */ @celledBorderWidth: 1px; @celledBorder: @celledBorderWidth solid @borderColor; @celledInvertedBorder: @dividedBorderWidth solid @whiteBorderColor; @celledHorizontalPadding: 0.5em; @celledChildListBorder: none; @celledChildItemBorder: none;

/* Divided Horizontal */ @horizontalCelledSpacing: (@horizontalSpacing / 2); @horizontalCelledLineHeight: 0.6;

/* Relaxed */ @relaxedVerticalPadding: 0.5rem; @relaxedHeaderMargin: 0.25rem; @relaxedHorizontalPadding: 1.25rem;

/* Very Relaxed */ @veryRelaxedVerticalPadding: 1rem; @veryRelaxedHeaderMargin: 0.5rem; @veryRelaxedHorizontalPadding: 2rem;