#3710 - Fixed issue with unnecessary padding on first and last items of divided and relaxed lists

/*!
 * # Semantic UI - List
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Copyright 2015 Contributors
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */

/*******************************
            Theme
*******************************/

@type    : 'element';
@element : 'list';

@import (multiple) '../../theme.config';

/*******************************
            List
*******************************/

ul.ui.list,
ol.ui.list,
.ui.list {
  list-style-type: @listStyleType;
  margin: @margin;
  padding: @verticalPadding @horizontalPadding;
}

ul.ui.list:first-child,
ol.ui.list:first-child,
.ui.list:first-child {
  margin-top: 0em;
  padding-top: 0em;
}

ul.ui.list:last-child,
ol.ui.list:last-child,
.ui.list:last-child {
  margin-bottom: 0em;
  padding-bottom: 0em;
}

/*******************************
            Content
*******************************/

/* List Item */
ul.ui.list li,
ol.ui.list li,
.ui.list > .item,
.ui.list .list > .item {
  display: list-item;
  table-layout: fixed;
  list-style-type: @listStyleType;
  list-style-position: @listStylePosition;

  padding: @itemPadding;
  line-height: @itemLineHeight;
}

ul.ui.list > li:first-child:after,
ol.ui.list > li:first-child:after,
.ui.list > .list > .item,
.ui.list > .item:after {
  content: '';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

ul.ui.list li:first-child,
ol.ui.list li:first-child,
.ui.list .list > .item:first-child,
.ui.list > .item:first-child {
  padding-top: 0em;
}
ul.ui.list li:last-child,
ol.ui.list li:last-child,
.ui.list .list > .item:last-child,
.ui.list > .item:last-child {
  padding-bottom: 0em;
}

/* Child List */
ul.ui.list ul,
ol.ui.list ol,
.ui.list .list {
  clear: both;
  margin: 0em;
  padding: @childListPadding;
}

/* Child Item */
ul.ui.list ul li,
ol.ui.list ol li,
.ui.list .list > .item {
  padding: @childItemPadding;
  line-height: @childItemLineHeight;
}

/* Icon */
.ui.list .list > .item > i.icon,
.ui.list > .item > i.icon {
  display: table-cell;
  margin: 0em;
  padding-top: @iconOffset;
  padding-right: @iconDistance;
  vertical-align: @iconContentVerticalAlign;
  transition: @iconTransition;
}
.ui.list .list > .item > i.icon:only-child,
.ui.list > .item > i.icon:only-child {
  display: inline-block;
  vertical-align: @iconVerticalAlign;
}

/* Image */
.ui.list .list > .item > .image,
.ui.list > .item > .image {
  display: table-cell;
  background-color: transparent;
  margin: 0em;
  vertical-align: @imageAlign;
}
.ui.list .list > .item > .image:not(:only-child):not(img),
.ui.list > .item > .image:not(:only-child):not(img) {
  padding-right: @imageDistance;
}
.ui.list .list > .item > .image img,
.ui.list > .item > .image img {
  vertical-align: @imageAlign;
}

.ui.list .list > .item > img.image,
.ui.list .list > .item > .image:only-child,
.ui.list > .item > img.image,
.ui.list > .item > .image:only-child {
  display: inline-block;
}

/* Content */
.ui.list .list > .item > .content,
.ui.list > .item > .content {
  line-height: @contentLineHeight;
}
.ui.list .list > .item > .image + .content,
.ui.list .list > .item > .icon + .content,
.ui.list > .item > .image + .content,
.ui.list > .item > .icon + .content {
  display: table-cell;
  padding: 0em 0em 0em @contentDistance;
  vertical-align: @contentVerticalAlign;
}
.ui.list .list > .item > img.image + .content,
.ui.list > .item > img.image + .content {
  display: inline-block;
}
.ui.list .list > .item > .content > .list,
.ui.list > .item > .content > .list {
  margin-left: 0em;
  padding-left: 0em;
}

/* Header */
.ui.list .list > .item .header,
.ui.list > .item .header {
  display: block;
  margin: 0em;
  font-family: @itemHeaderFontFamily;
  font-weight: @itemHeaderFontWeight;
  color: @itemHeaderColor;
}

/* Description */
.ui.list .list > .item .description,
.ui.list > .item .description {
  display: block;
  color: @itemDescriptionColor;
}

/* Child Link */
.ui.list > .item a,
.ui.list .list > .item a {
  cursor: pointer;
}

/* Linking Item */
.ui.list .list > a.item,
.ui.list > a.item {
  cursor: pointer;
  color: @itemLinkColor;
}
.ui.list .list > a.item:hover,
.ui.list > a.item:hover {
  color: @itemLinkHoverColor;
}

/* Linked Item Icons */
.ui.list .list > a.item i.icon,
.ui.list > a.item i.icon {
  color: @itemLinkIconColor;
}

/* Header Link */
.ui.list .list > .item a.header,
.ui.list > .item a.header {
  cursor: pointer;
  color: @itemHeaderLinkColor !important;
}
.ui.list .list > .item a.header:hover,
.ui.list > .item a.header:hover {
  color: @itemHeaderLinkHoverColor !important;
}

/* Floated Content */
.ui[class*="left floated"].list {
  float: left;
}
.ui[class*="right floated"].list {
  float: right;
}

.ui.list .list > .item [class*="left floated"],
.ui.list > .item [class*="left floated"] {
  float: left;
  margin: @leftFloatMargin;
}
.ui.list .list > .item [class*="right floated"],
.ui.list > .item [class*="right floated"] {
  float: right;
  margin: @rightFloatMargin;
}

/*******************************
            Coupling
*******************************/

.ui.menu .ui.list > .item,
.ui.menu .ui.list .list > .item {
  display: list-item;
  table-layout: fixed;
  background-color: transparent;

  list-style-type: @listStyleType;
  list-style-position: @listStylePosition;

  padding: @itemVerticalPadding @itemHorizontalPadding;
  line-height: @itemLineHeight;
}
.ui.menu .ui.list .list > .item:before,
.ui.menu .ui.list > .item:before {
  border: none;
  background: none;
}
.ui.menu .ui.list .list > .item:first-child,
.ui.menu .ui.list > .item:first-child {
  padding-top: 0em;
}
.ui.menu .ui.list .list > .item:last-child,
.ui.menu .ui.list > .item:last-child {
  padding-bottom: 0em;
}

/*******************************
            Types
*******************************/

/*-------------------
      Horizontal
--------------------*/

.ui.horizontal.list {
  display: inline-block;
  font-size: 0em;
}
.ui.horizontal.list > .item {
  display: inline-block;
  margin-left: @horizontalSpacing;
  font-size: 1rem;
}
.ui.horizontal.list:not(.celled) > .item:first-child {
  margin-left: 0em !important;
  padding-left: 0em !important;
}
.ui.horizontal.list .list {
  padding-left: 0em;
  padding-bottom: 0em;
}

.ui.horizontal.list > .item > .image,
.ui.horizontal.list .list > .item > .image,
.ui.horizontal.list > .item > .icon,
.ui.horizontal.list .list > .item > .icon,
.ui.horizontal.list > .item > .content,
.ui.horizontal.list .list > .item > .content {
  vertical-align: @horizontalVerticalAlign;
}

/* Padding on all elements */
.ui.horizontal.list > .item:first-child,
.ui.horizontal.list > .item:last-child {
  padding-top: @itemVerticalPadding;
  padding-bottom: @itemVerticalPadding;
}

/* Horizontal List */
.ui.horizontal.list > .item > i.icon {
  margin: 0em;
  padding: 0em @horizontalIconDistance 0em 0em;
}
.ui.horizontal.list > .item > .icon,
.ui.horizontal.list > .item > .icon + .content {
  float: none;
  display: inline-block;
}

/*******************************
             States
*******************************/

/*-------------------
       Disabled
--------------------*/

.ui.list .list > .disabled.item,
.ui.list > .disabled.item {
  pointer-events: none;
  color: @disabledColor !important;
}
.ui.inverted.list .list > .disabled.item,
.ui.inverted.list > .disabled.item {
  color: @invertedDisabledColor !important;
}

/*-------------------
        Hover
--------------------*/

.ui.list .list > a.item:hover .icon,
.ui.list > a.item:hover .icon {
  color: @itemLinkIconHoverColor;
}

/*******************************
           Variations
*******************************/

/*-------------------
       Inverted
--------------------*/

.ui.inverted.list .list > a.item > .icon,
.ui.inverted.list > a.item > .icon {
  color: @invertedIconLinkColor;
}
.ui.inverted.list .list > .item .header,
.ui.inverted.list > .item .header {
  color: @invertedHeaderColor;
}
.ui.inverted.list .list > .item .description,
.ui.inverted.list > .item .description {
  color: @invertedDescriptionColor;
}

/* Item Link */
.ui.inverted.list .list > a.item,
.ui.inverted.list > a.item {
  cursor: pointer;
  color: @invertedItemLinkColor;
}
.ui.inverted.list .list > a.item:hover,
.ui.inverted.list > a.item:hover {
  color: @invertedItemLinkHoverColor;
}

/* Linking Content */
.ui.inverted.list .item a:not(.ui) {
  color: @invertedItemLinkColor !important;
}
.ui.inverted.list .item a:not(.ui):hover {
  color: @invertedItemLinkHoverColor !important;
}

/*-------------------
       Aligned
--------------------*/

.ui.list[class*="top aligned"] .image,
.ui.list[class*="top aligned"] .content,
.ui.list [class*="top aligned"] {
  vertical-align: top !important;
}
.ui.list[class*="middle aligned"] .image,
.ui.list[class*="middle aligned"] .content,
.ui.list [class*="middle aligned"] {
  vertical-align: middle !important;
}
.ui.list[class*="bottom aligned"] .image,
.ui.list[class*="bottom aligned"] .content,
.ui.list [class*="bottom aligned"] {
  vertical-align: bottom !important;
}

/*-------------------
       Link
--------------------*/

.ui.link.list .item,
.ui.link.list a.item,
.ui.link.list .item a:not(.ui) {
  color: @linkListItemColor;
  transition: @linkListTransition;
}
.ui.link.list a.item:hover,
.ui.link.list .item a:not(.ui):hover {
  color: @linkListItemHoverColor;
}
.ui.link.list a.item:active,
.ui.link.list .item a:not(.ui):active {
  color: @linkListItemDownColor;
}
.ui.link.list .active.item,
.ui.link.list .active.item a:not(.ui) {
  color: @linkListItemActiveColor;
}

/* Inverted */
.ui.inverted.link.list .item,
.ui.inverted.link.list a.item,
.ui.inverted.link.list .item a:not(.ui) {
  color: @invertedLinkListItemColor;
}
.ui.inverted.link.list a.item:hover,
.ui.inverted.link.list .item a:not(.ui):hover {
  color: @invertedLinkListItemHoverColor;
}
.ui.inverted.link.list a.item:active,
.ui.inverted.link.list .item a:not(.ui):active {
  color: @invertedLinkListItemDownColor;
}
.ui.inverted.link.list a.active.item,
.ui.inverted.link.list .active.item a:not(.ui) {
  color: @invertedLinkListItemActiveColor;
}

/*-------------------
      Selection
--------------------*/

.ui.selection.list .list > .item,
.ui.selection.list > .item {
  cursor: pointer;
  background: @selectionListBackground;
  padding: @selectionListItemVerticalPadding @selectionListItemHorizontalPadding;
  margin: @selectionListItemMargin;
  color: @selectionListColor;
  border-radius: @selectionListItemBorderRadius;
  transition: @selectionListTransition;
}
.ui.selection.list .list > .item:last-child,
.ui.selection.list > .item:last-child {
  margin-bottom: 0em;
}
.ui.selection.list.list >  .item:hover,
.ui.selection.list > .item:hover {
  background: @selectionListHoverBackground;
  color: @selectionListHoverColor;
}
.ui.selection.list .list > .item:active,
.ui.selection.list > .item:active {
  background: @selectionListDownBackground;
  color: @selectionListDownColor;
}
.ui.selection.list .list > .item.active,
.ui.selection.list > .item.active {
  background: @selectionListActiveBackground;
  color: @selectionListActiveColor;
}

/* Inverted */
.ui.inverted.selection.list > .item,
.ui.inverted.selection.list > .item {
  background: @invertedSelectionListBackground;
  color: @invertedSelectionListColor;
}
.ui.inverted.selection.list > .item:hover,
.ui.inverted.selection.list > .item:hover {
  background: @invertedSelectionListHoverBackground;
  color: @invertedSelectionListHoverColor;
}
.ui.inverted.selection.list > .item:active,
.ui.inverted.selection.list > .item:active {
  background: @invertedSelectionListDownBackground;
  color: @invertedSelectionListDownColor;
}
.ui.inverted.selection.list > .item.active,
.ui.inverted.selection.list > .item.active {
  background: @invertedSelectionListActiveBackground;
  color: @invertedSelectionListActiveColor;
}

/* Celled / Divided Selection List */
.ui.celled.selection.list .list > .item,
.ui.divided.selection.list .list > .item,
.ui.celled.selection.list > .item,
.ui.divided.selection.list > .item {
  border-radius: 0em;
}

/*-------------------
       Animated
--------------------*/

.ui.animated.list > .item {
  transition: @animatedListTransition;
}
.ui.animated.list:not(.horizontal) > .item:hover {
  padding-left: @animatedListIndent;
}

/*-------------------
       Fitted
--------------------*/
.ui.fitted.list:not(.selection) .list > .item,
.ui.fitted.list:not(.selection) > .item {
  padding-left: 0em;
  padding-right: 0em;
}
.ui.fitted.selection.list .list > .item,
.ui.fitted.selection.list > .item {
  margin-left: -@selectionListItemHorizontalPadding;
  margin-right: -@selectionListItemHorizontalPadding;
}

/*-------------------
      Bulleted
--------------------*/

ul.ui.list,
.ui.bulleted.list {
  margin-left: @bulletDistance;
}
ul.ui.list li,
.ui.bulleted.list .list > .item,
.ui.bulleted.list > .item {
  position: relative;
}
ul.ui.list li:before,
.ui.bulleted.list .list > .item:before,
.ui.bulleted.list > .item:before {
  user-select: none;
  pointer-events: none;
  position: absolute;
  top: auto;
  left: auto;
  font-weight: normal;
  margin-left: @bulletOffset;
  content: @bulletCharacter;
  opacity: @bulletOpacity;
  color: @bulletColor;
  vertical-align: @bulletVerticalAlign;
}

ul.ui.list ul,
.ui.bulleted.list .list {
  padding-left: @bulletChildDistance;
}

/* Horizontal Bulleted */
ul.ui.horizontal.bulleted.list,
.ui.horizontal.bulleted.list {
  margin-left: 0em;
}
ul.ui.horizontal.bulleted.list li,
.ui.horizontal.bulleted.list > .item {
  margin-left: @horizontalBulletSpacing;
}
ul.ui.horizontal.bulleted.list li:first-child,
.ui.horizontal.bulleted.list > .item:first-child {
  margin-left: 0em;
}
ul.ui.horizontal.bulleted.list li::before,
.ui.horizontal.bulleted.list > .item::before {
  color: @horizontalBulletColor;
}
ul.ui.horizontal.bulleted.list li:first-child::before,
.ui.horizontal.bulleted.list > .item:first-child::before {
  display: none;
}

/*-------------------
       Ordered
--------------------*/

ol.ui.list,
.ui.ordered.list,
.ui.ordered.list .list,
ol.ui.list ol {
  counter-reset: ordered;
  margin-left: @orderedCountDistance;
  list-style-type: none;
}
ol.ui.list li,
.ui.ordered.list .list > .item,
.ui.ordered.list > .item {
  list-style-type: none;
  position: relative;
}
ol.ui.list li:before,
.ui.ordered.list .list > .item:before,
.ui.ordered.list > .item:before {
  position: absolute;
  top: auto;
  left: auto;
  user-select: none;
  pointer-events: none;
  margin-left: -(@orderedCountDistance);
  counter-increment: @orderedCountName;
  content: @orderedCountContent;
  text-align: @orderedCountTextAlign;
  color: @orderedCountColor;
  vertical-align: @orderedCountVerticalAlign;
  opacity: @orderedCountOpacity;
}

ol.ui.inverted.list li:before,
.ui.ordered.inverted.list .list > .item:before,
.ui.ordered.inverted.list > .item:before {
  color: @orderedInvertedCountColor;
}

/* Value */
.ui.ordered.list > .list > .item[data-value],
.ui.ordered.list > .item[data-value] {
  content: attr(data-value);
}
ol.ui.list li[value]:before {
  content: attr(value);
}

/* Child Lists */
ol.ui.list ol,
.ui.ordered.list .list {
  margin-left: @orderedChildCountDistance;
}
ol.ui.list ol li:before,
.ui.ordered.list .list > .item:before {
  margin-left: @orderedChildCountOffset;
}

/* Horizontal Ordered */
ol.ui.horizontal.list,
.ui.ordered.horizontal.list {
  margin-left: 0em;
}
ol.ui.horizontal.list li:before,
.ui.ordered.horizontal.list .list > .item:before,
.ui.ordered.horizontal.list > .item:before {
  position: static;
  margin: 0em @horizontalOrderedCountDistance 0em 0em;
}

/*-------------------
       Divided
--------------------*/

.ui.divided.list > .item {
  border-top: @dividedBorder;
}
.ui.divided.list .list > .item {
  border-top: @dividedChildListBorder;
}
.ui.divided.list .item .list > .item {
  border-top: @dividedChildItemBorder;
}
.ui.divided.list .list > .item:first-child,
.ui.divided.list > .item:first-child {
  border-top: none;
}

/* Sub Menu */
.ui.divided.list:not(.horizontal) .list > .item:first-child {
  border-top-width: @dividedBorderWidth;
}

/* Divided bulleted */
.ui.divided.bulleted.list:not(.horizontal),
.ui.divided.bulleted.list .list {
  margin-left: 0em;
  padding-left: 0em;
}
.ui.divided.bulleted.list > .item:not(.horizontal) {
  padding-left: @bulletDistance;
}

/* Divided Ordered */
.ui.divided.ordered.list {
  margin-left: 0em;
}
.ui.divided.ordered.list .list > .item,
.ui.divided.ordered.list > .item {
  padding-left: @orderedCountDistance;
}
.ui.divided.ordered.list .item .list {
  margin-left: 0em;
  margin-right: 0em;
  padding-bottom: @itemVerticalPadding;
}
.ui.divided.ordered.list .item .list > .item {
  padding-left: @orderedChildCountDistance;
}

/* Divided Selection */
.ui.divided.selection.list .list > .item,
.ui.divided.selection.list > .item {
  margin: 0em;
  border-radius: 0em;
}

/* Divided horizontal */
.ui.divided.horizontal.list {
  margin-left: 0em;
}
.ui.divided.horizontal.list > .item:not(:first-child) {
  padding-left: @horizontalDividedSpacing;
}
.ui.divided.horizontal.list > .item:not(:last-child) {
  padding-right: @horizontalDividedSpacing;
}
.ui.divided.horizontal.list > .item {
  border-top: none;
  border-left: @dividedBorder;
  margin: 0em;
  line-height: @horizontalDividedLineHeight;
}
.ui.horizontal.divided.list > .item:first-child {
  border-left: none;
}
/* Inverted */
.ui.divided.inverted.list > .item,
.ui.divided.inverted.list > .list,
.ui.divided.inverted.horizontal.list > .item {
  border-color: @dividedInvertedBorderColor;
}

/*-------------------
        Celled
--------------------*/

.ui.celled.list > .item,
.ui.celled.list > .list {
  border-top: @celledBorder;
  padding-left: @celledHorizontalPadding;
  padding-right: @celledHorizontalPadding;
}
.ui.celled.list > .item:last-child {
  border-bottom: @celledBorder;
}

/* Padding on all elements */
.ui.celled.list > .item:first-child,
.ui.celled.list > .item:last-child {
  padding-top: @itemVerticalPadding;
  padding-bottom: @itemVerticalPadding;
}

/* Sub Menu */
.ui.celled.list .item .list > .item {
  border-width: 0px;
}
.ui.celled.list .list > .item:first-child {
  border-top-width: 0px;
}

/* Celled Bulleted */
.ui.celled.bulleted.list {
  margin-left: 0em;
}
.ui.celled.bulleted.list .list > .item,
.ui.celled.bulleted.list > .item {
  padding-left: (@bulletDistance);
}
.ui.celled.bulleted.list .item .list {
  margin-left: -(@bulletDistance);
  margin-right: -(@bulletDistance);
  padding-bottom: @itemVerticalPadding;
}

/* Celled Ordered */
.ui.celled.ordered.list {
  margin-left: 0em;
}
.ui.celled.ordered.list .list > .item,
.ui.celled.ordered.list > .item {
  padding-left: @orderedCountDistance;
}
.ui.celled.ordered.list .item .list {
  margin-left: 0em;
  margin-right: 0em;
  padding-bottom: @itemVerticalPadding;
}
.ui.celled.ordered.list .list > .item {
  padding-left: @orderedChildCountDistance;
}

/* Celled Horizontal */
.ui.horizontal.celled.list {
  margin-left: 0em;
}
.ui.horizontal.celled.list .list > .item,
.ui.horizontal.celled.list > .item {
  border-top: none;
  border-left: @celledBorder;
  margin: 0em;
  padding-left: @horizontalCelledSpacing;
  padding-right: @horizontalCelledSpacing;

  line-height: @horizontalCelledLineHeight;
}
.ui.horizontal.celled.list .list > .item:last-child,
.ui.horizontal.celled.list > .item:last-child {
  border-bottom: none;
  border-right: @celledBorder;
}

/* Inverted */
.ui.celled.inverted.list > .item,
.ui.celled.inverted.list > .list {
  border-color: @celledInvertedBorder;
}
.ui.celled.inverted.horizontal.list .list > .item,
.ui.celled.inverted.horizontal.list > .item {
  border-color: @celledInvertedBorder;
}

/*-------------------
       Relaxed
--------------------*/

.ui.relaxed.list:not(.horizontal) > .item:not(:first-child) {
  padding-top: @relaxedItemVerticalPadding;
}
.ui.relaxed.list:not(.horizontal) > .item:not(:last-child) {
  padding-bottom: @relaxedItemVerticalPadding;
}
.ui.horizontal.relaxed.list .list > .item:not(:first-child),
.ui.horizontal.relaxed.list > .item:not(:first-child) {
  padding-left: @relaxedHorizontalPadding;
}
.ui.horizontal.relaxed.list .list > .item:not(:last-child),
.ui.horizontal.relaxed.list > .item:not(:last-child) {
  padding-right: @relaxedHorizontalPadding;
}

/* Very Relaxed */
.ui[class*="very relaxed"].list:not(.horizontal) > .item:not(:first-child) {
  padding-top: @veryRelaxedItemVerticalPadding;
}
.ui[class*="very relaxed"].list:not(.horizontal) > .item:not(:last-child) {
  padding-bottom: @veryRelaxedItemVerticalPadding;
}
.ui.horizontal[class*="very relaxed"].list .list > .item:not(:first-child),
.ui.horizontal[class*="very relaxed"].list > .item:not(:first-child) {
  padding-left: @veryRelaxedHorizontalPadding;
}
.ui.horizontal[class*="very relaxed"].list .list > .item:not(:last-child),
.ui.horizontal[class*="very relaxed"].list > .item:not(:last-child) {
  padding-right: @veryRelaxedHorizontalPadding;
}

/*-------------------
      Sizes
--------------------*/

.ui.mini.list {
  font-size: @relativeMini;
}
.ui.tiny.list {
  font-size: @relativeTiny;
}
.ui.small.list {
  font-size: @relativeSmall;
}
.ui.list {
  font-size: @relativeMedium;
}
.ui.large.list {
  font-size: @relativeLarge;
}
.ui.big.list {
  font-size: @relativeBig;
}
.ui.huge.list {
  font-size: @relativeHuge;
}
.ui.massive.list {
  font-size: @relativeMassive;
}

.ui.mini.horizontal.list .list > .item,
.ui.mini.horizontal.list > .item {
  font-size: @mini;
}
.ui.tiny.horizontal.list .list > .item,
.ui.tiny.horizontal.list > .item {
  font-size: @tiny;
}
.ui.small.horizontal.list .list > .item,
.ui.small.horizontal.list > .item {
  font-size: @small;
}
.ui.horizontal.list .list > .item,
.ui.horizontal.list > .item {
  font-size: @medium;
}
.ui.large.horizontal.list .list > .item,
.ui.large.horizontal.list > .item {
  font-size: @large;
}
.ui.big.horizontal.list .list > .item,
.ui.big.horizontal.list > .item {
  font-size: @big;
}
.ui.huge.horizontal.list .list > .item,
.ui.huge.horizontal.list > .item {
  font-size: @huge;
}
.ui.massive.horizontal.list .list > .item,
.ui.massive.horizontal.list > .item {
  font-size: @massive;
}

.loadUIOverrides();

/*!
 * # Semantic UI - List
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Copyright 2015 Contributors
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */

/*******************************
            Theme
*******************************/

@type    : 'element';
@element : 'list';

@import (multiple) '../../theme.config';

/*******************************
            List
*******************************/

ul.ui.list,
ol.ui.list,
.ui.list {
  list-style-type: @listStyleType;
  margin: @margin;
  padding: @verticalPadding @horizontalPadding;
}

ul.ui.list:first-child,
ol.ui.list:first-child,
.ui.list:first-child {
  margin-top: 0em;
  padding-top: 0em;
}

ul.ui.list:last-child,
ol.ui.list:last-child,
.ui.list:last-child {
  margin-bottom: 0em;
  padding-bottom: 0em;
}

/*******************************
            Content
*******************************/

/* List Item */
ul.ui.list li,
ol.ui.list li,
.ui.list > .item,
.ui.list .list > .item {
  display: list-item;
  table-layout: fixed;
  list-style-type: @listStyleType;
  list-style-position: @listStylePosition;

  padding: @itemPadding;
  line-height: @itemLineHeight;
}

ul.ui.list > li:first-child:after,
ol.ui.list > li:first-child:after,
.ui.list > .list > .item,
.ui.list > .item:after {
  content: '';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

ul.ui.list li:first-child,
ol.ui.list li:first-child,
.ui.list .list > .item:first-child,
.ui.list > .item:first-child {
  padding-top: 0em;
}
ul.ui.list li:last-child,
ol.ui.list li:last-child,
.ui.list .list > .item:last-child,
.ui.list > .item:last-child {
  padding-bottom: 0em;
}

/* Child List */
ul.ui.list ul,
ol.ui.list ol,
.ui.list .list {
  clear: both;
  margin: 0em;
  padding: @childListPadding;
}

/* Child Item */
ul.ui.list ul li,
ol.ui.list ol li,
.ui.list .list > .item {
  padding: @childItemPadding;
  line-height: @childItemLineHeight;
}

/* Icon */
.ui.list .list > .item > i.icon,
.ui.list > .item > i.icon {
  display: table-cell;
  margin: 0em;
  padding-top: @iconOffset;
  padding-right: @iconDistance;
  vertical-align: @iconContentVerticalAlign;
  transition: @iconTransition;
}
.ui.list .list > .item > i.icon:only-child,
.ui.list > .item > i.icon:only-child {
  display: inline-block;
  vertical-align: @iconVerticalAlign;
}

/* Image */
.ui.list .list > .item > .image,
.ui.list > .item > .image {
  display: table-cell;
  background-color: transparent;
  margin: 0em;
  vertical-align: @imageAlign;
}
.ui.list .list > .item > .image:not(:only-child):not(img),
.ui.list > .item > .image:not(:only-child):not(img) {
  padding-right: @imageDistance;
}
.ui.list .list > .item > .image img,
.ui.list > .item > .image img {
  vertical-align: @imageAlign;
}

.ui.list .list > .item > img.image,
.ui.list .list > .item > .image:only-child,
.ui.list > .item > img.image,
.ui.list > .item > .image:only-child {
  display: inline-block;
}

/* Content */
.ui.list .list > .item > .content,
.ui.list > .item > .content {
  line-height: @contentLineHeight;
}
.ui.list .list > .item > .image + .content,
.ui.list .list > .item > .icon + .content,
.ui.list > .item > .image + .content,
.ui.list > .item > .icon + .content {
  display: table-cell;
  padding: 0em 0em 0em @contentDistance;
  vertical-align: @contentVerticalAlign;
}
.ui.list .list > .item > img.image + .content,
.ui.list > .item > img.image + .content {
  display: inline-block;
}
.ui.list .list > .item > .content > .list,
.ui.list > .item > .content > .list {
  margin-left: 0em;
  padding-left: 0em;
}

/* Header */
.ui.list .list > .item .header,
.ui.list > .item .header {
  display: block;
  margin: 0em;
  font-family: @itemHeaderFontFamily;
  font-weight: @itemHeaderFontWeight;
  color: @itemHeaderColor;
}

/* Description */
.ui.list .list > .item .description,
.ui.list > .item .description {
  display: block;
  color: @itemDescriptionColor;
}

/* Child Link */
.ui.list > .item a,
.ui.list .list > .item a {
  cursor: pointer;
}

/* Linking Item */
.ui.list .list > a.item,
.ui.list > a.item {
  cursor: pointer;
  color: @itemLinkColor;
}
.ui.list .list > a.item:hover,
.ui.list > a.item:hover {
  color: @itemLinkHoverColor;
}

/* Linked Item Icons */
.ui.list .list > a.item i.icon,
.ui.list > a.item i.icon {
  color: @itemLinkIconColor;
}

/* Header Link */
.ui.list .list > .item a.header,
.ui.list > .item a.header {
  cursor: pointer;
  color: @itemHeaderLinkColor !important;
}
.ui.list .list > .item a.header:hover,
.ui.list > .item a.header:hover {
  color: @itemHeaderLinkHoverColor !important;
}

/* Floated Content */
.ui[class*="left floated"].list {
  float: left;
}
.ui[class*="right floated"].list {
  float: right;
}

.ui.list .list > .item [class*="left floated"],
.ui.list > .item [class*="left floated"] {
  float: left;
  margin: @leftFloatMargin;
}
.ui.list .list > .item [class*="right floated"],
.ui.list > .item [class*="right floated"] {
  float: right;
  margin: @rightFloatMargin;
}

/*******************************
            Coupling
*******************************/

.ui.menu .ui.list > .item,
.ui.menu .ui.list .list > .item {
  display: list-item;
  table-layout: fixed;
  background-color: transparent;

  list-style-type: @listStyleType;
  list-style-position: @listStylePosition;

  padding: @itemVerticalPadding @itemHorizontalPadding;
  line-height: @itemLineHeight;
}
.ui.menu .ui.list .list > .item:before,
.ui.menu .ui.list > .item:before {
  border: none;
  background: none;
}
.ui.menu .ui.list .list > .item:first-child,
.ui.menu .ui.list > .item:first-child {
  padding-top: 0em;
}
.ui.menu .ui.list .list > .item:last-child,
.ui.menu .ui.list > .item:last-child {
  padding-bottom: 0em;
}

/*******************************
            Types
*******************************/

/*-------------------
      Horizontal
--------------------*/

.ui.horizontal.list {
  display: inline-block;
  font-size: 0em;
}
.ui.horizontal.list > .item {
  display: inline-block;
  margin-left: @horizontalSpacing;
  font-size: 1rem;
}
.ui.horizontal.list:not(.celled) > .item:first-child {
  margin-left: 0em !important;
  padding-left: 0em !important;
}
.ui.horizontal.list .list {
  padding-left: 0em;
  padding-bottom: 0em;
}

.ui.horizontal.list > .item > .image,
.ui.horizontal.list .list > .item > .image,
.ui.horizontal.list > .item > .icon,
.ui.horizontal.list .list > .item > .icon,
.ui.horizontal.list > .item > .content,
.ui.horizontal.list .list > .item > .content {
  vertical-align: @horizontalVerticalAlign;
}

/* Padding on all elements */
.ui.horizontal.list > .item:first-child,
.ui.horizontal.list > .item:last-child {
  padding-top: @itemVerticalPadding;
  padding-bottom: @itemVerticalPadding;
}

/* Horizontal List */
.ui.horizontal.list > .item > i.icon {
  margin: 0em;
  padding: 0em @horizontalIconDistance 0em 0em;
}
.ui.horizontal.list > .item > .icon,
.ui.horizontal.list > .item > .icon + .content {
  float: none;
  display: inline-block;
}

/*******************************
             States
*******************************/

/*-------------------
       Disabled
--------------------*/

.ui.list .list > .disabled.item,
.ui.list > .disabled.item {
  pointer-events: none;
  color: @disabledColor !important;
}
.ui.inverted.list .list > .disabled.item,
.ui.inverted.list > .disabled.item {
  color: @invertedDisabledColor !important;
}

/*-------------------
        Hover
--------------------*/

.ui.list .list > a.item:hover .icon,
.ui.list > a.item:hover .icon {
  color: @itemLinkIconHoverColor;
}

/*******************************
           Variations
*******************************/

/*-------------------
       Inverted
--------------------*/

.ui.inverted.list .list > a.item > .icon,
.ui.inverted.list > a.item > .icon {
  color: @invertedIconLinkColor;
}
.ui.inverted.list .list > .item .header,
.ui.inverted.list > .item .header {
  color: @invertedHeaderColor;
}
.ui.inverted.list .list > .item .description,
.ui.inverted.list > .item .description {
  color: @invertedDescriptionColor;
}

/* Item Link */
.ui.inverted.list .list > a.item,
.ui.inverted.list > a.item {
  cursor: pointer;
  color: @invertedItemLinkColor;
}
.ui.inverted.list .list > a.item:hover,
.ui.inverted.list > a.item:hover {
  color: @invertedItemLinkHoverColor;
}

/* Linking Content */
.ui.inverted.list .item a:not(.ui) {
  color: @invertedItemLinkColor !important;
}
.ui.inverted.list .item a:not(.ui):hover {
  color: @invertedItemLinkHoverColor !important;
}

/*-------------------
       Aligned
--------------------*/

.ui.list[class*="top aligned"] .image,
.ui.list[class*="top aligned"] .content,
.ui.list [class*="top aligned"] {
  vertical-align: top !important;
}
.ui.list[class*="middle aligned"] .image,
.ui.list[class*="middle aligned"] .content,
.ui.list [class*="middle aligned"] {
  vertical-align: middle !important;
}
.ui.list[class*="bottom aligned"] .image,
.ui.list[class*="bottom aligned"] .content,
.ui.list [class*="bottom aligned"] {
  vertical-align: bottom !important;
}

/*-------------------
       Link
--------------------*/

.ui.link.list .item,
.ui.link.list a.item,
.ui.link.list .item a:not(.ui) {
  color: @linkListItemColor;
  transition: @linkListTransition;
}
.ui.link.list a.item:hover,
.ui.link.list .item a:not(.ui):hover {
  color: @linkListItemHoverColor;
}
.ui.link.list a.item:active,
.ui.link.list .item a:not(.ui):active {
  color: @linkListItemDownColor;
}
.ui.link.list .active.item,
.ui.link.list .active.item a:not(.ui) {
  color: @linkListItemActiveColor;
}

/* Inverted */
.ui.inverted.link.list .item,
.ui.inverted.link.list a.item,
.ui.inverted.link.list .item a:not(.ui) {
  color: @invertedLinkListItemColor;
}
.ui.inverted.link.list a.item:hover,
.ui.inverted.link.list .item a:not(.ui):hover {
  color: @invertedLinkListItemHoverColor;
}
.ui.inverted.link.list a.item:active,
.ui.inverted.link.list .item a:not(.ui):active {
  color: @invertedLinkListItemDownColor;
}
.ui.inverted.link.list a.active.item,
.ui.inverted.link.list .active.item a:not(.ui) {
  color: @invertedLinkListItemActiveColor;
}

/*-------------------
      Selection
--------------------*/

.ui.selection.list .list > .item,
.ui.selection.list > .item {
  cursor: pointer;
  background: @selectionListBackground;
  padding: @selectionListItemVerticalPadding @selectionListItemHorizontalPadding;
  margin: @selectionListItemMargin;
  color: @selectionListColor;
  border-radius: @selectionListItemBorderRadius;
  transition: @selectionListTransition;
}
.ui.selection.list .list > .item:last-child,
.ui.selection.list > .item:last-child {
  margin-bottom: 0em;
}
.ui.selection.list.list >  .item:hover,
.ui.selection.list > .item:hover {
  background: @selectionListHoverBackground;
  color: @selectionListHoverColor;
}
.ui.selection.list .list > .item:active,
.ui.selection.list > .item:active {
  background: @selectionListDownBackground;
  color: @selectionListDownColor;
}
.ui.selection.list .list > .item.active,
.ui.selection.list > .item.active {
  background: @selectionListActiveBackground;
  color: @selectionListActiveColor;
}

/* Inverted */
.ui.inverted.selection.list > .item,
.ui.inverted.selection.list > .item {
  background: @invertedSelectionListBackground;
  color: @invertedSelectionListColor;
}
.ui.inverted.selection.list > .item:hover,
.ui.inverted.selection.list > .item:hover {
  background: @invertedSelectionListHoverBackground;
  color: @invertedSelectionListHoverColor;
}
.ui.inverted.selection.list > .item:active,
.ui.inverted.selection.list > .item:active {
  background: @invertedSelectionListDownBackground;
  color: @invertedSelectionListDownColor;
}
.ui.inverted.selection.list > .item.active,
.ui.inverted.selection.list > .item.active {
  background: @invertedSelectionListActiveBackground;
  color: @invertedSelectionListActiveColor;
}

/* Celled / Divided Selection List */
.ui.celled.selection.list .list > .item,
.ui.divided.selection.list .list > .item,
.ui.celled.selection.list > .item,
.ui.divided.selection.list > .item {
  border-radius: 0em;
}

/*-------------------
       Animated
--------------------*/

.ui.animated.list > .item {
  transition: @animatedListTransition;
}
.ui.animated.list:not(.horizontal) > .item:hover {
  padding-left: @animatedListIndent;
}

/*-------------------
       Fitted
--------------------*/
.ui.fitted.list:not(.selection) .list > .item,
.ui.fitted.list:not(.selection) > .item {
  padding-left: 0em;
  padding-right: 0em;
}
.ui.fitted.selection.list .list > .item,
.ui.fitted.selection.list > .item {
  margin-left: -@selectionListItemHorizontalPadding;
  margin-right: -@selectionListItemHorizontalPadding;
}

/*-------------------
      Bulleted
--------------------*/

ul.ui.list,
.ui.bulleted.list {
  margin-left: @bulletDistance;
}
ul.ui.list li,
.ui.bulleted.list .list > .item,
.ui.bulleted.list > .item {
  position: relative;
}
ul.ui.list li:before,
.ui.bulleted.list .list > .item:before,
.ui.bulleted.list > .item:before {
  user-select: none;
  pointer-events: none;
  position: absolute;
  top: auto;
  left: auto;
  font-weight: normal;
  margin-left: @bulletOffset;
  content: @bulletCharacter;
  opacity: @bulletOpacity;
  color: @bulletColor;
  vertical-align: @bulletVerticalAlign;
}

ul.ui.list ul,
.ui.bulleted.list .list {
  padding-left: @bulletChildDistance;
}

/* Horizontal Bulleted */
ul.ui.horizontal.bulleted.list,
.ui.horizontal.bulleted.list {
  margin-left: 0em;
}
ul.ui.horizontal.bulleted.list li,
.ui.horizontal.bulleted.list > .item {
  margin-left: @horizontalBulletSpacing;
}
ul.ui.horizontal.bulleted.list li:first-child,
.ui.horizontal.bulleted.list > .item:first-child {
  margin-left: 0em;
}
ul.ui.horizontal.bulleted.list li::before,
.ui.horizontal.bulleted.list > .item::before {
  color: @horizontalBulletColor;
}
ul.ui.horizontal.bulleted.list li:first-child::before,
.ui.horizontal.bulleted.list > .item:first-child::before {
  display: none;
}

/*-------------------
       Ordered
--------------------*/

ol.ui.list,
.ui.ordered.list,
.ui.ordered.list .list,
ol.ui.list ol {
  counter-reset: ordered;
  margin-left: @orderedCountDistance;
  list-style-type: none;
}
ol.ui.list li,
.ui.ordered.list .list > .item,
.ui.ordered.list > .item {
  list-style-type: none;
  position: relative;
}
ol.ui.list li:before,
.ui.ordered.list .list > .item:before,
.ui.ordered.list > .item:before {
  position: absolute;
  top: auto;
  left: auto;
  user-select: none;
  pointer-events: none;
  margin-left: -(@orderedCountDistance);
  counter-increment: @orderedCountName;
  content: @orderedCountContent;
  text-align: @orderedCountTextAlign;
  color: @orderedCountColor;
  vertical-align: @orderedCountVerticalAlign;
  opacity: @orderedCountOpacity;
}

ol.ui.inverted.list li:before,
.ui.ordered.inverted.list .list > .item:before,
.ui.ordered.inverted.list > .item:before {
  color: @orderedInvertedCountColor;
}

/* Value */
.ui.ordered.list > .list > .item[data-value],
.ui.ordered.list > .item[data-value] {
  content: attr(data-value);
}
ol.ui.list li[value]:before {
  content: attr(value);
}

/* Child Lists */
ol.ui.list ol,
.ui.ordered.list .list {
  margin-left: @orderedChildCountDistance;
}
ol.ui.list ol li:before,
.ui.ordered.list .list > .item:before {
  margin-left: @orderedChildCountOffset;
}

/* Horizontal Ordered */
ol.ui.horizontal.list,
.ui.ordered.horizontal.list {
  margin-left: 0em;
}
ol.ui.horizontal.list li:before,
.ui.ordered.horizontal.list .list > .item:before,
.ui.ordered.horizontal.list > .item:before {
  position: static;
  margin: 0em @horizontalOrderedCountDistance 0em 0em;
}

/*-------------------
       Divided
--------------------*/

.ui.divided.list > .item {
  border-top: @dividedBorder;
}
.ui.divided.list .list > .item {
  border-top: @dividedChildListBorder;
}
.ui.divided.list .item .list > .item {
  border-top: @dividedChildItemBorder;
}
.ui.divided.list .list > .item:first-child,
.ui.divided.list > .item:first-child {
  border-top: none;
}

/* Sub Menu */
.ui.divided.list:not(.horizontal) .list > .item:first-child {
  border-top-width: @dividedBorderWidth;
}

/* Divided bulleted */
.ui.divided.bulleted.list:not(.horizontal),
.ui.divided.bulleted.list .list {
  margin-left: 0em;
  padding-left: 0em;
}
.ui.divided.bulleted.list > .item:not(.horizontal) {
  padding-left: @bulletDistance;
}

/* Divided Ordered */
.ui.divided.ordered.list {
  margin-left: 0em;
}
.ui.divided.ordered.list .list > .item,
.ui.divided.ordered.list > .item {
  padding-left: @orderedCountDistance;
}
.ui.divided.ordered.list .item .list {
  margin-left: 0em;
  margin-right: 0em;
  padding-bottom: @itemVerticalPadding;
}
.ui.divided.ordered.list .item .list > .item {
  padding-left: @orderedChildCountDistance;
}

/* Divided Selection */
.ui.divided.selection.list .list > .item,
.ui.divided.selection.list > .item {
  margin: 0em;
  border-radius: 0em;
}

/* Divided horizontal */
.ui.divided.horizontal.list {
  margin-left: 0em;
}
.ui.divided.horizontal.list > .item {
  border-top: none;
  border-left: @dividedBorder;
  margin: 0em;
  padding-left: @horizontalDividedSpacing;
  padding-right: @horizontalDividedSpacing;
  line-height: @horizontalDividedLineHeight;
}
.ui.horizontal.divided.list > .item:first-child {
  border-left: none;
}
/* Inverted */
.ui.divided.inverted.list > .item,
.ui.divided.inverted.list > .list,
.ui.divided.inverted.horizontal.list > .item {
  border-color: @dividedInvertedBorderColor;
}

/*-------------------
        Celled
--------------------*/

.ui.celled.list > .item,
.ui.celled.list > .list {
  border-top: @celledBorder;
  padding-left: @celledHorizontalPadding;
  padding-right: @celledHorizontalPadding;
}
.ui.celled.list > .item:last-child {
  border-bottom: @celledBorder;
}

/* Padding on all elements */
.ui.celled.list > .item:first-child,
.ui.celled.list > .item:last-child {
  padding-top: @itemVerticalPadding;
  padding-bottom: @itemVerticalPadding;
}

/* Sub Menu */
.ui.celled.list .item .list > .item {
  border-width: 0px;
}
.ui.celled.list .list > .item:first-child {
  border-top-width: 0px;
}

/* Celled Bulleted */
.ui.celled.bulleted.list {
  margin-left: 0em;
}
.ui.celled.bulleted.list .list > .item,
.ui.celled.bulleted.list > .item {
  padding-left: (@bulletDistance);
}
.ui.celled.bulleted.list .item .list {
  margin-left: -(@bulletDistance);
  margin-right: -(@bulletDistance);
  padding-bottom: @itemVerticalPadding;
}

/* Celled Ordered */
.ui.celled.ordered.list {
  margin-left: 0em;
}
.ui.celled.ordered.list .list > .item,
.ui.celled.ordered.list > .item {
  padding-left: @orderedCountDistance;
}
.ui.celled.ordered.list .item .list {
  margin-left: 0em;
  margin-right: 0em;
  padding-bottom: @itemVerticalPadding;
}
.ui.celled.ordered.list .list > .item {
  padding-left: @orderedChildCountDistance;
}

/* Celled Horizontal */
.ui.horizontal.celled.list {
  margin-left: 0em;
}
.ui.horizontal.celled.list .list > .item,
.ui.horizontal.celled.list > .item {
  border-top: none;
  border-left: @celledBorder;
  margin: 0em;
  padding-left: @horizontalCelledSpacing;
  padding-right: @horizontalCelledSpacing;

  line-height: @horizontalCelledLineHeight;
}
.ui.horizontal.celled.list .list > .item:last-child,
.ui.horizontal.celled.list > .item:last-child {
  border-bottom: none;
  border-right: @celledBorder;
}

/* Inverted */
.ui.celled.inverted.list > .item,
.ui.celled.inverted.list > .list {
  border-color: @celledInvertedBorder;
}
.ui.celled.inverted.horizontal.list .list > .item,
.ui.celled.inverted.horizontal.list > .item {
  border-color: @celledInvertedBorder;
}

/*-------------------
       Relaxed
--------------------*/

.ui.relaxed.list:not(.horizontal) > .item {
  padding-top: @relaxedItemVerticalPadding;
  padding-bottom: @relaxedItemVerticalPadding;
}
.ui.relaxed.list:not(.horizontal) .list > .item {
  padding-top: @relaxedChildItemVerticalPadding;
  padding-bottom: @relaxedChildItemVerticalPadding;
}
.ui.horizontal.relaxed.list > .item {
  padding-left: @relaxedHorizontalPadding;
  padding-right: @relaxedHorizontalPadding;
}

/* Very Relaxed */
.ui[class*="very relaxed"].list:not(.horizontal) > .item {
  padding-top: @veryRelaxedItemVerticalPadding;
  padding-bottom: @veryRelaxedItemVerticalPadding;
}
.ui[class*="very relaxed"].list:not(.horizontal) .list > .item {
  padding-top: @veryRelaxedChildItemVerticalPadding;
  padding-bottom: @veryRelaxedChildItemVerticalPadding;
}
.ui.horizontal[class*="very relaxed"].list .list > .item,
.ui.horizontal[class*="very relaxed"].list > .item {
  padding-left: @veryRelaxedHorizontalPadding;
  padding-right: @veryRelaxedHorizontalPadding;
}

/*-------------------
      Sizes
--------------------*/

.ui.mini.list {
  font-size: @relativeMini;
}
.ui.tiny.list {
  font-size: @relativeTiny;
}
.ui.small.list {
  font-size: @relativeSmall;
}
.ui.list {
  font-size: @relativeMedium;
}
.ui.large.list {
  font-size: @relativeLarge;
}
.ui.big.list {
  font-size: @relativeBig;
}
.ui.huge.list {
  font-size: @relativeHuge;
}
.ui.massive.list {
  font-size: @relativeMassive;
}

.ui.mini.horizontal.list .list > .item,
.ui.mini.horizontal.list > .item {
  font-size: @mini;
}
.ui.tiny.horizontal.list .list > .item,
.ui.tiny.horizontal.list > .item {
  font-size: @tiny;
}
.ui.small.horizontal.list .list > .item,
.ui.small.horizontal.list > .item {
  font-size: @small;
}
.ui.horizontal.list .list > .item,
.ui.horizontal.list > .item {
  font-size: @medium;
}
.ui.large.horizontal.list .list > .item,
.ui.large.horizontal.list > .item {
  font-size: @large;
}
.ui.big.horizontal.list .list > .item,
.ui.big.horizontal.list > .item {
  font-size: @big;
}
.ui.huge.horizontal.list .list > .item,
.ui.huge.horizontal.list > .item {
  font-size: @huge;
}
.ui.massive.horizontal.list .list > .item,
.ui.massive.horizontal.list > .item {
  font-size: @massive;
}

.loadUIOverrides();


Create 00-config.less

Create 00-config.less

// LESS values : adaptez-les à vos designs
@basefont : 14; // si "14" alors 1em = 14px
@l-h : 1.5;     // equiv line-height 1.5

// fonts
@font-family : 'Arial, sans-serif';

// couleurs projets
// $abbréviation-projet - color

// couleurs
@color-links : #2573be;
@color-hover : #000;
@color-hr : #000;
@hr-height : 1px;
@color-alert : #bf0000;

// largeurs
@input-defaut-size : 250px;

// RTL
@rtl_option : false;

// hyphens
@hyphenation_default : false;

// LESS functions : pas touche ;)

.pxtoem (@fontsize) {font-size: (@fontsize / @basefont) + 0em;}

.line (@fontsize) {line-height: @l-h *2 / (@fontsize / @basefont) + 0em}

.grid (@number) {width: (100%-(@gutter*(@number - 1))) / @number;}

/* calculées via http://soqr.fr/vertical-rhythm/ merci @goetter & @eQRoeil */

// valeur d'arrondi, pour le nombre de chiffres après la virgule => 10000 => 1.6667 ; 100000 => 1.13374
.flow_hx(@font-size, @base-font: @basefont, @base-height: @l-h, @rounding-value: 10000) {

  @coef: ceil(1 / (@base-height * @base-font / @font-size));
  @other_coef: ceil(@base-height * @base-font / @font-size);
  @size: (@font-size / @base-font) + 0em;
  @height: (@base-font * @base-height / @font-size);
  @mar-top: (@height * @coef );

font-size: round(@size * @rounding-value) / @rounding-value;
line-height: round(@height * @coef * @rounding-value) / @rounding-value;
margin: ( round(@mar-top*@rounding-value)/@rounding-value * @other_coef + 0em) 0 (round(@mar-top*@rounding-value)/@rounding-value/2 * @other_coef + 0em) 0;

}

// pour les classes smaller, bigger, etc.
.flow_other(@font-size, @base-font: @basefont, @base-height: @l-h, @rounding-value: 10000) {

  @coef: ceil(1 / (@base-height * @base-font / @font-size));
  @other_coef: ceil(@base-height * @base-font / @font-size);
  @size: (@font-size / @base-font) + 0em;
  @height: (@base-font * @base-height / @font-size);
  @mar-top: (@height * @coef );

font-size: round(@size * @rounding-value) / @rounding-value;
line-height: round(@height * @coef * @rounding-value) / @rounding-value;
margin: ( round(@mar-top*@rounding-value)/@rounding-value + 0em) 0;

}

error: pathspec 'less/rocssti-fr/00-config.less' did not match any file(s) known to git


Dialog: add accent color

Dialog: add accent color

fatal: unable to access 'https://github.com/deplug/deplug.git/': The requested URL returned error: 403


Made text-align class names more consistent on media queries


Updated less for the demo page.

Updated less for the demo page.

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/jimmynotjim/generator-cf.git/'


Simplify preloader animation

Simplify preloader animation

/* === Preloader === */
.preloader {
    display: inline-block;
    width: 20px;
    height: 20px;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-animation: preloader-spin 1s steps(12, end) infinite;
    animation: preloader-spin 1s steps(12, end) infinite;
}
.preloader:after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    .encoded-svg-background("<svg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><defs><line id='l' x1='60' x2='60' y1='7' y2='27' stroke='#6c6c6c' stroke-width='11' stroke-linecap='round'/></defs><g><use xlink:href='#l' opacity='.27'/><use xlink:href='#l' opacity='.27' transform='rotate(30 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(60 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(90 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(120 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(150 60,60)'/><use xlink:href='#l' opacity='.37' transform='rotate(180 60,60)'/><use xlink:href='#l' opacity='.46' transform='rotate(210 60,60)'/><use xlink:href='#l' opacity='.56' transform='rotate(240 60,60)'/><use xlink:href='#l' opacity='.66' transform='rotate(270 60,60)'/><use xlink:href='#l' opacity='.75' transform='rotate(300 60,60)'/><use xlink:href='#l' opacity='.85' transform='rotate(330 60,60)'/></g></svg>");
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat;

}
.preloader-white:after {
    .encoded-svg-background("<svg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><defs><line id='l' x1='60' x2='60' y1='7' y2='27' stroke='#fff' stroke-width='11' stroke-linecap='round'/></defs><g><use xlink:href='#l' opacity='.27'/><use xlink:href='#l' opacity='.27' transform='rotate(30 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(60 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(90 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(120 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(150 60,60)'/><use xlink:href='#l' opacity='.37' transform='rotate(180 60,60)'/><use xlink:href='#l' opacity='.46' transform='rotate(210 60,60)'/><use xlink:href='#l' opacity='.56' transform='rotate(240 60,60)'/><use xlink:href='#l' opacity='.66' transform='rotate(270 60,60)'/><use xlink:href='#l' opacity='.75' transform='rotate(300 60,60)'/><use xlink:href='#l' opacity='.85' transform='rotate(330 60,60)'/></g></svg>");
}
@-webkit-keyframes preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
    }
}
@keyframes preloader-spin {
    100% {
        transform: rotate(360deg);
    }
}

/* === Preloader === */
.preloader {
    display: inline-block;
    width: 20px;
    height: 20px;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-animation: preloader-spin 1s step-end infinite;
    animation: preloader-spin 1s step-end infinite;
}
.preloader:after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    .encoded-svg-background("<svg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><defs><line id='l' x1='60' x2='60' y1='7' y2='27' stroke='#6c6c6c' stroke-width='11' stroke-linecap='round'/></defs><g><use xlink:href='#l' opacity='.27'/><use xlink:href='#l' opacity='.27' transform='rotate(30 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(60 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(90 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(120 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(150 60,60)'/><use xlink:href='#l' opacity='.37' transform='rotate(180 60,60)'/><use xlink:href='#l' opacity='.46' transform='rotate(210 60,60)'/><use xlink:href='#l' opacity='.56' transform='rotate(240 60,60)'/><use xlink:href='#l' opacity='.66' transform='rotate(270 60,60)'/><use xlink:href='#l' opacity='.75' transform='rotate(300 60,60)'/><use xlink:href='#l' opacity='.85' transform='rotate(330 60,60)'/></g></svg>");
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat;

}
.preloader-white:after {
    .encoded-svg-background("<svg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><defs><line id='l' x1='60' x2='60' y1='7' y2='27' stroke='#fff' stroke-width='11' stroke-linecap='round'/></defs><g><use xlink:href='#l' opacity='.27'/><use xlink:href='#l' opacity='.27' transform='rotate(30 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(60 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(90 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(120 60,60)'/><use xlink:href='#l' opacity='.27' transform='rotate(150 60,60)'/><use xlink:href='#l' opacity='.37' transform='rotate(180 60,60)'/><use xlink:href='#l' opacity='.46' transform='rotate(210 60,60)'/><use xlink:href='#l' opacity='.56' transform='rotate(240 60,60)'/><use xlink:href='#l' opacity='.66' transform='rotate(270 60,60)'/><use xlink:href='#l' opacity='.75' transform='rotate(300 60,60)'/><use xlink:href='#l' opacity='.85' transform='rotate(330 60,60)'/></g></svg>");
}
@-webkit-keyframes preloader-spin {
    .preloader-loop(0);
    .preloader-loop(@i) when (@i <= 12) {
        @j: ((@i * (1/12)) * 100%);
        @{j} {
            @deg: (@i) * 30deg;
            -webkit-transform: rotate(@deg);
        }
        .preloader-loop(@i + 1);
    }
}
@keyframes preloader-spin {
    .preloader-loop(0);
    .preloader-loop(@i) when (@i <= 12) {
        @j: ((@i * (1/12)) * 100%);
        @{j} {
            @deg: (@i) * 30deg;
            transform: rotate(@deg);
        }
        .preloader-loop(@i + 1);
    }
}


less version

less version

@nice-blue: #5B83AD;

p{
	margin:0;
}

.lt.h1 {
    font-size: 44px;
}
.lt.h2 {
    font-size: 37px;
}
.lt.h3 {
    font-size: 27px;
}
.lt.h4 {
    font-size: 23px;
}
.lt.h5 {
    font-size: 17px;
}
.lt.h6 {
    font-size: 14px;
}
.lt.strong{
     font-weight:bold;
}

.lt.strike{
    text-decoration: line-through;
}

.lt.link{
    text-decoration: underline;
}

.lt.em{
	font-style: italic
}
.lt.list_item{
	font-style: italic
}
.lt.cite{
	   background-color: #16A085;
    color:#DDE4F0;
}
.lt.code{
	 background: none repeat scroll 0 0 #CFE6E1;
    color: #16A085;
    font-family: monospace;
    font-size: 1.3em;
    line-height: 1.3em;
    margin-top: 9px;
    padding-top: 0.3em;
}

.lt.selected{
	background:#1abc9c
}

.lt.fi, .lt.fi.selected{
	background:#2980b9
}

.lt.nd, .lt.nd.selected{
	background:#3498db
}

//** transform span to block (line breaks before and after) */
/* fi : first*/
/*  */
.lt.h1.fi:before,.lt.h2.fi:before,.lt.h3.fi:before,.lt.h4.fi:before,.lt.h5.fi:before,.lt.h6.fi:before {
    clear: both;
    content: "";
    display: block;
    height: 1px;
    width: 1px;
}
.lt.h1.nd:after, .lt.h2.nd:after,.lt.h3.nd:after,.lt.h4.nd:after,.lt.h5.nd:after,.lt.h6.nd:after  {
    clear: both;
    content: "";
    display: block;
    height: 1px;
    width: 1px;
}

.fa-markup{

}

.fa-h1:before, .fa-h2:before, .fa-h3:before, .fa-h4:before,.fa-h5:before, .fa-h6:before{
	content: "";

}
.mk_val_subtype_h1, .mk_val_subtype_h2, .mk_val_subtype_h3, .mk_val_subtype_h4, .mk_val_subtype_h5, .mk_val_subtype_h6{
	text-transform:uppercase;
}

i.fa-comment:before {
    content: "";

}

i.fa-em:before {
    content: "em";

    font-style:italic;
}

i.fa-strike:before {
    content: "s";
     text-decoration: line-through;

}
i.fa-strong:before {
    content: "b";
    display: block;
    font-weight:bold;
}

i.fa-cite:before {
    content: "q";

}
i.fa-list_item:before {
    content: "list";
    display: block;
    font-weight:bold;
}

i.fa-container_class:before {
    content: "css";
    display: block;
    font-style:italic;
}

i.fa-note:before {
    content: "n";
    display: block;
    font-style:italic;
}

.markup_displayer .mk_val {
    display: inline-block;
    float: right;
    font-size: 0.65em;
    line-height: 1.3;
    padding: 0;
    text-align: left;
    width: 86%;
}
.markup_displayer .icon_col {
    display: inline-block;
    float: left;
    font-size: 0.7em;
    padding: 0;
    text-align: left;
    width: 10%;
}

.markup_displayer {

    display: inline-block;
    float: left;
    width: 100%;
 margin-bottom: 2px;
}

.markup_displayer_img .icon_col {

    width: 100%;
}

div.markup_editor{
	width:100%;
}

i.fa-img {
    background: none repeat scroll 0 0 #ffffff;
    float: right;
    position: relative;
    right: 5px;
    top: -33px;
    width: 14px;
    z-index: 9999;
}
i.fa-img:before {
    content: "";
    display: block;

}

.fa.selected_true{
	color:#1abc9c
}

.layout_ i.fa {
    border: 1px solid;
    border-radius: 5px;
    display: block;
    font-size: 10px;
    padding: 2px 2px 3px 3px;
    text-align: center;
}

.layout_name_left i.fa {
    float: left;
    margin-right: 0;
}
.layout_name_right i.fa {
    float: left;
    margin-right: 2px;
    margin-top: 3px;
}

 .css-form input.ng-invalid.ng-dirty {
    background-color: #FA787E;
  }

  .css-form input.ng-valid.ng-dirty {
    background-color: #78FA89;
  }

error: pathspec 'public/css/charset.less' did not match any file(s) known to git


use blue75

use blue75

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/Thinkful/ui.git/'


potentially destructive word wrapping ¯\_(ツ)_/¯

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/flashwave/sakura.git/'


Fixed empty space when user nick has  in name and change css unit from  to .

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/topics-im/topics.git/'


Fix indentation

Fix indentation

/**
 *    Copyright 2015 ppy Pty. Ltd.
 *
 *    This file is part of osu!web. osu!web is distributed with the hope of
 *    attracting more community contributions to the core ecosystem of osu!.
 *
 *    osu!web is free software: you can redistribute it and/or modify
 *    it under the terms of the Affero GNU General Public License version 3
 *    as published by the Free Software Foundation.
 *
 *    osu!web is distributed WITHOUT ANY WARRANTY; without even the implied
 *    warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 *    See the GNU Affero General Public License for more details.
 *
 *    You should have received a copy of the GNU Affero General Public License
 *    along with osu!web.  If not, see <http://www.gnu.org/licenses/>.
 *
 */
.landing-logo {
  display: flex;
  position: absolute;
  width: @landing-logo-size;
  height: @landing-logo-size;
  left: 0;
  right: 0;
  top: 30px;
  margin: auto;
  z-index: @z-index--nav-float;

  &__header {
    // Visually hidden h1 for SEO purposes
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }

  &__overlay,
  &__glow,
  &__timing,
  &__bounce {
    position: absolute;
    width: 100%;
    height: 100%;
  }

  &__overlay {
    .at2x("/images/layout/osu-logo.png", @landing-logo-size, @landing-logo-size);
    z-index: 10;
    opacity: 0.15;
    width: 100%;
    height: 100%;
  }

  &__bounce {
    .at2x("/images/layout/osu-logo.png", @landing-logo-size, @landing-logo-size);
    animation-name: logo-bounce;
    animation-duration: 0.6s;
    animation-iteration-count: 0;
  }

  &__timing,
  &__glow {
    .at2x("/images/layout/osu-logo-glow.png", @landing-logo-size, @landing-logo-size);
    animation-name: logo-glow;
    animation-duration: 1.2s;
    animation-timing-function: ease-out;
    animation-iteration-count: 0;
    animation-delay: 0.3s;
    opacity: 0;
  }

  &__timing {
    animation-delay: 0.9s;
  }

  &:hover span {
    animation-iteration-count: infinite;
  }
}


Add config for stacked navigation to default template

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/mattmilburn/javelin-bp.git/'


fixed css typo

fixed css typo

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/cablelabs/dev-portal.git/'


some less mixins

some less mixins

Signed-off-by: TR <d9e83874d260f2f10d48d98c0b773b836096d426@trs-mbp-2.local>

fatal: unable to access 'https://github.com/ultimo/tr.git/': The requested URL returned error: 403


https for google fonts css

https for google fonts css

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/raidr/raidr.net.git/'