assets/less/mixins.less

.translate-origin(@x, @y) {
  -webkit-transform-origin: @x @y;
     -moz-transform-origin: @x @y;
      -ms-transform-origin: @x @y;
       -o-transform-origin: @x @y;
          transform-origin: @x @y;
}

.customTransition(@prop, @delay, @a, @b, @c, @d){
-webkit-transition: @prop, @delay cubic-bezier(@a, @b, @c, @d); 
   -moz-transition: @prop, @delay cubic-bezier(@a, @b, @c, @d); 
    -ms-transition: @prop, @delay cubic-bezier(@a, @b, @c, @d); 
     -o-transition: @prop, @delay cubic-bezier(@a, @b, @c, @d); 
        transition: @prop, @delay cubic-bezier(@a, @b, @c, @d); /* custom */

-webkit-transition-timing-function: cubic-bezier(@a, @b, @c, @d); 
   -moz-transition-timing-function: cubic-bezier(@a, @b, @c, @d); 
    -ms-transition-timing-function: cubic-bezier(@a, @b, @c, @d); 
     -o-transition-timing-function: cubic-bezier(@a, @b, @c, @d); 
        transition-timing-function: cubic-bezier(@a, @b, @c, @d); /* custom */
}

.transition(...) {
  -webkit-transition: @arguments;
  -moz-transition: @arguments;
  -ms-transition: @arguments;
  -o-transition: @arguments;
  transition: @arguments;
}

.bottom-shadow-border(@height: 6px) {
  border-bottom: 1px solid #999;
  .box-shadow(0px @height 0 0 rgba(0, 0, 0, 0.1));
}

.left-shadow-border() {
  border-left: 1px solid #999;
  .box-shadow(-6px 0 rgba(0, 0, 0, 0.1));
}

.noselect() {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.display-flex() {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* rather than run through all permutations of the shorthand options for flex, this just pulls all arguments */
.flex(...) {
  -webkit-flex: @arguments;
  -ms-flex: @arguments;
  flex: @arguments;
}

/* @dir: column or row */
.flex-direction(@dir) {
  -webkit-flex-direction: @dir;
  -ms-flex-direction: @dir;
  flex-direction: @dir;
}