lifegadget/ui-list

.no-select {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ui-list.list-container {
  display: flex;
  flex-direction: column;
}
.ui-list.list-container.horizontal {
  flex-direction: row;
}

.ui-list.item .aspect {

}
.ui-list.item .left-pane .aspect {
  margin-right: 5px;
}
.ui-list.item .left-pane .aspect:first-child {
  margin-right: 0px;
}
.ui-list.item .right-pane .aspect {
  margin-left: 5px;
}
.ui-list.item .right-pane .aspect:first-child {
  margin-left: 0px;
}
.ui-list.item .aspect.icon {
  font-size: 1.2em;
}
.ui-list.item .left-pane.has-sub-heading .aspect.icon {
  font-size: 2em;
}

.ui-list .ui-image {
    margin-top: 5px;
    margin-bottom: 5px;
}
.ui-list.disabled .ui-image  {
    opacity: .4;
}

.ui-list.item .block-pane {
  text-align: center;
  margin: auto;
}

.ui-list .item.full {
  flex: 1 1;
}
.ui-list .item {
  flex: initial;
}


.ui-list .sub-heading {
    font-size: smaller;
    color: darkgrey;
}

/* SIZING::DEFAULTs */
.ui-list.item.tiny {
    font-size: .9em;
}
.ui-list.item.small {
    font-size: 1em;
}
.ui-list.item.large {
    font-size: 1.5em;
}
.ui-list.item.huge {
    font-size: 2em;
}

/* HORIZONTAL PADDING */
.ui-list.item .hpad {
    width: 10px;
    margin: 0;
}
.ui-list.item .hpad.squeezed {
    width: 5px;
}
.ui-list.item .hpad.left,
.ui-list.item .hpad.right {
    width: 15px;
}
.ui-list.item.tiny .hpad.left,
.ui-list.item.tiny .hpad.right {
    width: 8px;
}
.ui-list.item.small .hpad.left,
.ui-list.item.small .hpad.right {
    width: 10px;
}
/* SQUEEZED*/
.ui-list.item.squeezed .hpad {
    width: 3px;
}
.ui-list.item.squeezed .hpad.left,
.ui-list.item.squeezed .hpad.right {
    width: 10px;
}
.ui-list.tiny.item.squeezed .hpad.left,
.ui-list.item.squeezed .hpad.right {
    width: 5px;
}
.ui-list.small.item.squeezed .hpad.left,
.ui-list.item.squeezed .hpad.right {
    width: 8px;
}
/* STRIPING */
.ui-list.stripe .item.odd {
  background-color: hsl(0, 0%, 95%)
}

/* DEFAULT IMAGE SIZING */
.ui-list .ui-image {
    margin-bottom: 5px;
}
.ui-list.tiny .ui-image {
    height: 25px;
    width: auto;
}
.ui-list.small .ui-image {
    height: 30px;
    width: auto;
}
.ui-list .ui-image {
    height: 40px;
    width: auto;
}
.ui-list.large .ui-image {
    height: 60px;
    width: auto;
}
.ui-list.huge .ui-image {
    height: 90px;
    width: auto;
}

/* DISABLED STYLING */
.ui-list.disabled {
    background-color: #F2F2F2;
    border-color: darkgrey;
    border-style: dashed;
}
.ui-list.item.disabled {
  cursor: not-allowed;
}

.ui-list.disabled .ui-icon {
    color: lightgrey;
}
.ui-list.disabled .badge {
    background-color: lightgrey;
}
.ui-list.disabled .title {
    color: #686868;
}

/* DEFAULT MOODS */
.ui-list.mood-success.enabled {
    color: hsl(120, 39%, 20%);
    border-color: hsl(120,39%, 40%);
}
.ui-list.mood-success.enabled .badge {
    background-color: hsl(120, 39%, 20%);
}
/* info */
.ui-list.mood-info.enabled {
    color: hsl(194, 66%, 20%);
    border-color: hsl(194,66%, 61%);
}
.ui-list.mood-info.enabled .badge {
    background-color: hsl(194, 66%, 20%);
}
/* warn */
.ui-list.mood-warning.enabled {
    color: hsl(35, 84%, 20%);
    border-color: hsl(35,84%, 62%);
}
.ui-list.mood-warning.enabled .badge {
    background-color: hsl(35, 84%, 20%);
}
/* error */
.ui-list.mood-error.enabled {
    color: hsl(2, 84%, 20%);
    border-color: hsl(2,64%, 58%);
}
.ui-list.mood-error.enabled .badge {
    background-color: hsl(2, 64%, 20%);
}
/* aged */
.ui-list.mood-aged.enabled {
    color: hsl(0, 0%, 40%);
    border-color: hsl(0, 0%, 85%);
}
.ui-list.mood-aged.enabled .badge {
    background-color: hsl(0, 0%, 50%);
}
/* ancient */
.ui-list.mood-ancient.enabled {
    color: hsl(0, 0%, 50%);
    border-color: hsl(0, 0%, 90%);
}
.ui-list.mood-ancient.enabled .badge {
    background-color: hsl(0, 0%, 60%);
}