init

init

styles/mixins/animation.less

@@ -0,0 +1,5 @@
+.animation(@string) {
+    -webkit-animation:  @string;
+    -moz-animation:     @string;
+    animation:          @string;
+}

styles/mixins/box-shadow.less

@@ -0,0 +1,5 @@
+.box-shadow (@string) {
+    -webkit-box-shadow: @string;
+    -moz-box-shadow:    @string;
+    box-shadow:         @string;
+}

styles/mixins/clearfix.less

@@ -0,0 +1,16 @@
+// mixins for clearfix
+
+.clearfix() {
+    zoom: 1;
+    &:before,
+    &:after {
+        content: "";
+        display: table;
+    }
+    &:after {
+        clear: both;
+        visibility: hidden;
+        font-size: 0;
+        height: 0;
+    }
+}

styles/mixins/index.less

@@ -0,0 +1,8 @@
+@import "clearfix";
+@import "box-shadow";
+@import "transition";
+@import "transform";
+@import "animation";
+@import "button";
+@import "layout";
+@import "size";

styles/mixins/layout.less

@@ -0,0 +1,65 @@
+@row-prefix-cls: ~"@{css-prefix}row";
+@col-prefix-cls: ~"@{css-prefix}col";
+
+.make-row(@gutter: @grid-gutter-width) {
+    position: relative;
+    margin-left: (@gutter / -2);
+    margin-right: (@gutter / -2);
+    height: auto;
+    .clearfix;
+}
+
+.float-grid-columns() {
+    .col(@index) { // initial
+        @item: ~".@{col-prefix-cls}-span-@{index}";
+        .col((@index + 1), @item);
+    }
+    .col(@index, @list) when (@index =< @grid-columns) { // general
+        @item: ~".@{col-prefix-cls}-span-@{index}";
+        .col((@index + 1), ~"@{list}, @{item}");
+    }
+    .col(@index, @list) when (@index > @grid-columns) { // terminal
+        @{list} {
+            float: left;
+            flex: 0 0 auto;
+        }
+    }
+    .col(1); // kickstart it
+}
+
+.loop-grid-columns(@index) when (@index > 0) {
+    .@{col-prefix-cls}-span-@{index} {
+        display: block;
+        width: percentage((@index / @grid-columns));
+    }
+    .@{col-prefix-cls}-push-@{index} {
+        left: percentage((@index / @grid-columns));
+    }
+    .@{col-prefix-cls}-pull-@{index} {
+        right: percentage((@index / @grid-columns));
+    }
+    .@{col-prefix-cls}-offset-@{index} {
+        margin-left: percentage((@index / @grid-columns));
+    }
+    .@{col-prefix-cls}-order-@{index} {
+        order: @index;
+    }
+    .loop-grid-columns((@index - 1));
+}
+
+.loop-grid-columns(@index) when (@index = 0) {
+    .@{col-prefix-cls}-@{index} {
+        display: none;
+    }
+    .@{col-prefix-cls}-push-@{index} {
+        left: auto;
+    }
+    .@{col-prefix-cls}-pull-@{index} {
+        right: auto;
+    }
+}
+
+.make-grid() {
+    .float-grid-columns();
+    .loop-grid-columns(@grid-columns);
+}

styles/mixins/size.less

@@ -0,0 +1,8 @@
+.size(@width; @height) {
+    width: @width;
+    height: @height;
+}
+
+.square(@size) {
+    .size(@size; @size);
+}

styles/mixins/transform.less

@@ -0,0 +1,10 @@
+.transform(@string) {
+    -webkit-transform: @string;
+    -moz-transform:    @string;
+    transform:         @string;
+}
+.transform-origin(@string) {
+    -webkit-transform-origin: @string;
+    -moz-transform-origin:    @string;
+    transform-origin:         @string;
+}

styles/mixins/transition.less

@@ -0,0 +1,5 @@
+.transition (@string) {
+    -webkit-transition: @string;
+    -moz-transition:    @string;
+    transition:         @string;
+}