rishabhsrao/voxel

View on GitHub
src/styles/components/code-snippet/_mixins.scss

Summary

Maintainability
Test Coverage
@mixin voxel-code-snippet() {
  margin-bottom: $voxel-code-snippet__margin-bottom;
  margin-left: $voxel-code-snippet__margin-left;
  margin-right: $voxel-code-snippet__margin-right;
  margin-top: $voxel-code-snippet__margin-top;
  padding: $voxel-code-snippet__padding;
  position: $voxel-code-snippet__position;

  &::before {
    content: "";
    display: $voxel-code-snippet__icon__display;
    height: $voxel-code-snippet__icon__height;
    position: $voxel-code-snippet__icon__position;
    right: $voxel-code-snippet__icon__right;
    top: $voxel-code-snippet__icon__top;
    width: $voxel-code-snippet__icon__width;
  }
}

@mixin voxel-code-snippet--html() {
  &::before {
    background-image: $voxel-code-snippet__icon__background-image--html;
  }
}

@mixin voxel-code-snippet--js() {
  &::before {
    background-image: $voxel-code-snippet__icon__background-image--js;
  }
}

@mixin voxel-code-snippet--css() {
  &::before {
    background-image: $voxel-code-snippet__icon__background-image--css;
  }
}

@mixin voxel-code-snippet--jsx() {
  &::before {
    background-image: $voxel-code-snippet__icon__background-image--jsx;
  }
}

@mixin voxel-code-snippet__pre() {
  background-color: $voxel-code-snippet__pre__background-color;
  border-radius: $voxel-code-snippet__pre__border-radius;
  border: $voxel-code-snippet__pre__border;
  color: $voxel-code-snippet__pre__color;
  font-size: $voxel-code-snippet__pre__font-size;
  line-height: $voxel-code-snippet__pre__line-height;
  margin: $voxel-code-snippet__pre__margin;
  overflow: $voxel-code-snippet__pre__overflow;
  padding: $voxel-code-snippet__pre__padding;
  word-break: $voxel-code-snippet__pre__word-break;
  word-wrap: $voxel-code-snippet__pre__word-wrap;
}