Contents

/* Mixins ------------------------------------------------------------------ */
@mixin absolutePosition($coordinates: null null null null) {
  position: absolute; top: nth($coordinates, 1); right: nth($coordinates, 2); bottom: nth($coordinates, 3); left: nth($coordinates, 4); }

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

@mixin user-select-none {
  -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;
}

@mixin border($color) {
  &:after { content: ''; display: block; height: 1px;
            background-color: $color; @include position(absolute, 0px 0px null 1em); }
}

@mixin noBorder { &:after { display: none; } }

@mixin noFocus { &:focus { outline: none; } }

@mixin customScrollbar {
  &::-webkit-scrollbar { width: 6px; background-color: $neutralColor; }
  &::-webkit-scrollbar-thumb { background-color: $contrastColor; border-radius: 3px; }
}

@mixin scrollable { overflow: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch; }

@mixin spinner {
  border:      .25em solid rgba($positiveColor, 0.2);
  border-left: .25em solid $positiveColor;
  -webkit-animation: spinning 1.1s infinite linear; animation: spinning 1.1s infinite linear;
  &, &:after { border-radius: 50%; width: 1.75em; height: 1.75em; }
}

@-webkit-keyframes spinning {
  0%   { -webkit-transform: rotate(0deg);   transform: rotate(0deg);   }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes spinning {
  0%   { -webkit-transform: rotate(0deg);   transform: rotate(0deg);   }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@mixin headerButton($color: $positiveColor) {
  color: $color; &:hover { opacity: .5; }
}

@mixin shadow {
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
chr-0.2.1	app/assets/stylesheets/core/_mixins.scss
chr-0.2.0	app/assets/stylesheets/core/_mixins.scss