formir/src/less/core/mixins/functions.less

Pure CSS / HTML Framework

.for(@i, @n) {.-each(@i)}
.for(@n)     when (isnumber(@n)) {.for(1, @n)}
.for(@i, @n) when not (@i = @n)  {
    .for((@i + (@n - @i) / abs(@n - @i)), @n);
}
.for(@array)   when (default()) {.for-impl_(length(@array))}
.for-impl_(@i) when (@i > 1)    {.for-impl_((@i - 1))}
.for-impl_(@i) when (@i > 0) {.-each(extract(@array, @i))}

.by-key(@array, @key, @fallback...) {
  .-(length(@array));
  .-(@i) when (@i > 0) {.-((@i - 1))}
  .-(@i) when (@key = extract(extract(@array, @i), 1)) {
      @by-key: extract(extract(@array, @i), 2);
  }

  .--() {@by-key: @fallback} .--;
}

.gradient(@start, @end) {
  background-color: @start;
  background: linear-gradient(to top, @start 0%, @end 100%);
}
.gradient-vertical(@start, @end) {
  background-color: @start;
  background: linear-gradient(to bottom, @start 0%, @end 100%);
}

.horizontal-gradient(@start, @end) {
  background-color: @start;
  background: linear-gradient(to left, @start 0%, @end 100%);
}

.transform(@x, @y) {
  transform: translate(@x, @y);
}

.ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: auto;
  max-width: 100%;
}

.ellipsis-row(@row) {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-inline-box;
  -webkit-line-clamp: @row;
  -webkit-box-orient: vertical;
}