zachharkey
6/25/2014 - 7:00 PM

Some minimal utility mixins. See: http://codepen.io/chriscoyier/blog/some-mini-sass-mixins-i-like

@mixin coverer($position: absolute) {
  position: $position;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@mixin centerer($position: absolute) {
  position: $position;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@mixin word-wrap() {
  word-break:     break-word;
  -webkit-hyphens: auto;
  -moz-hyphens:    auto;
  hyphens:         auto;
}

@mixin ellipsis() {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@function black($opacity) {
  @return rgba(black, $opacity)
}
@function white($opacity) {
  @return rgba(white, $opacity)
}