mixins.less

.transform (@func) {
  -webkit-transform: @arguments;
  -moz-transform: @arguments;
  -ms-transform: @arguments;
  -o-transform: @arguments;
  transform: @arguments;
}

.transform-origin (@x, @y) {
  -webkit-transform-origin: @arguments;
  -moz-transform-origin: @arguments;
  -ms-transform-origin: @arguments;
  -o-transform-origin: @arguments;
  transform-origin: @arguments;
}

// Allows use of rgba() in gradients. This will not provide a fallback for IE.
.rgba-vertial-gradient(@startColor:#555, @endColor:#333) {
  background-color: mix(@startColor, @endColor, 60%);
  background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
  background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
  background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
  background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
  background-image: linear-gradient(top, @startColor, @endColor); // The standard
  background-repeat: repeat-x;
}

.rgba-vertical-gradient-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
  background-color: mix(@midColor, @endColor, 80%);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
  background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
  background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
  background-image: -ms-linear-gradient(@startColor, @midColor @colorStop, @endColor);
  background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
  background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
  background-repeat: no-repeat;
}

.tag {
  display: inline-block;
  margin-bottom: 4px;
  color:  @tabTextColor;
  background-color: @tagBackgroundColor;
  padding: 1px 10px;
  border: 1px solid darken(@tagBackgroundColor, 10%);
  .border-radius(100px);
  .box-shadow(inset 0 1px 0 lighten(@tagBackgroundColor, 10%));
}

a.tag:hover {
  text-decoration: none;
  color: #fff;
  background-color: @btnPrimaryBackground;
  border: 1px solid darken(@btnPrimaryBackground, 10%);
  .box-shadow(inset 0 1px 0 lighten(@btnPrimaryBackground, 10%));
}

.pill {
  display: inline-block;
  background-color: @pillBackgroundColor;
  color: @pillTextColor;
  padding: 2px 10px 1px 10px;
  margin-right: 5px;
  font-weight: normal;
  .border-radius(100px);
  a {
    color: @pillTextColor;
    &.remove {
      font-size: 11px;
    }
  }
}

.unstyled {
  margin: 0;
  list-style: none;
}

.simple-item {
  font-size: 12px;
  line-height: 14 / 12em;
  padding: 7px @gutterX;
  border-bottom: 1px dotted @genericBorderColor;
  &:last-of-type {
    border-bottom: 0;
  }
}

.simple-list {
  .clearfix;
  .unstyled;

  & > li {
    .simple-item;
  }

  .ckan-icon {
    position: relative;
    top: 0px;
  }
}

.module-narrow .simple-list > li {
  padding-left:  @gutterSmallX;
  padding-right: @gutterSmallX;
  position: relative;
}

.listing li {
  text-align: right;
  //overflow: hidden;
  //white-space: nowrap;
  //text-overflow: ellipsis;
  margin-bottom: 5px;
}

.listing .key,
.listing .value {
}

.listing .key {
  clear: right;
  font-weight: bold;
}

.js .tab-content {
  display: none;
}

.js .tab-content.active {
  display: block;
}

.box {
  background-color: #FFF;
  border: 1px solid @layoutTrimBorderColor;
  .border-radius(4px);
  .box-shadow(0 0 0 4px rgba(0, 0, 0, 0.05));
}