rishabhsrao/voxel

@mixin voxel-list() {
  list-style-type: none;
  padding-left: $voxel-list__padding-left;
}

@mixin voxel-list--ordered() {
  counter-reset: voxel-list__counter;
}

@mixin voxel-list__item() {
  &::before {
    display: block;
    float: left;
    font-weight: bold;
    padding-bottom: $voxel-list__item__before__padding-bottom;
    padding-top: $voxel-list__item__before__padding-top;
  }
}

@mixin voxel-list--ordered__item() {
  counter-increment: voxel-list__counter;

  &::before {
    content: counters(voxel-list__counter, ".") ".";
    margin-right: $voxel-list__item__counter__margin-right;
  }
}

@mixin voxel-list__item__text() {
  font-weight: bold;
  margin-bottom: 0;
  margin-top: 0;
  padding-bottom: $voxel-list__item__text__padding-bottom;
  padding-top: $voxel-list__item__text__padding-top;
}

@mixin voxel-list__item__link() {
  display: block;
  padding-bottom: $voxel-list__item__link__padding-bottom;
  padding-top: $voxel-list__item__link__padding-top;
  text-decoration: none;

  &:hover {
    @include background-image(
      linear-gradient(
        to right,
        $voxel-list__item__link--hover__background-gradient__color--start,
        $voxel-list__item__link--hover__background-gradient__color--end
      )
    );
  }
}

@mixin voxel-list__item__link__themes($theme) {
  &:hover {
    @include background-image(
      linear-gradient(
        to right,
        $voxel-list__item__link--hover__background-gradient__color--start,
        map-get(
          map-get(
            $voxel-color__themes,
            $theme
          ),
          $voxel-list__item__link--hover__background-gradient__color--end__shade
        )
      )
    );
  }
}


@mixin voxel-list__item__link--active() {
  @include background-image(
    linear-gradient(
      to right,
      $voxel-list__item__link--active__background-gradient__color--start,
      $voxel-list__item__link--active__background-gradient__color--end
    )
  );
}

@mixin voxel-list__item__link--active__themes($theme) {
  @include background-image(
    linear-gradient(
      to right,
      $voxel-list__item__link--active__background-gradient__color--start,
      map-get(
        map-get(
          $voxel-color__themes,
          $theme
        ),
        $voxel-list__item__link--active__background-gradient__color--end__shade
      )
    )
  );
}