[breaking change] rebuild style struct (#2021)

2018-11-03 21:08:06 +08:00
parent a5576762d8
commit 11ce2a602f
165 changed files with 1371 additions and 4729 deletions
@@ -0,0 +1,146 @@
+@import '../style/var';
+
+.van-step {
+  flex: 1;
+  font-size: 14px;
+  position: relative;
+  color: @gray-dark;
+
+  &--horizontal {
+    float: left;
+
+    &:first-child {
+      .van-step__title {
+        transform: none;
+        margin-left: 0;
+      }
+    }
+
+    &:last-child {
+      position: absolute;
+      right: 10px;
+      width: auto;
+
+      .van-step__title {
+        transform: none;
+        margin-left: 0;
+      }
+
+      .van-step__circle-container {
+        left: auto;
+        right: -9px;
+      }
+
+      .van-step__line {
+        width: 0;
+      }
+    }
+
+    .van-step__circle-container {
+      position: absolute;
+      top: 28px;
+      left: -8px;
+      padding: 0 8px;
+      background-color: @white;
+      z-index: 1;
+    }
+
+    .van-step__title {
+      font-size: 12px;
+      transform: translate3d(-50%, 0, 0);
+      display: inline-block;
+      margin-left: 3px;
+    }
+
+    .van-step__line {
+      position: absolute;
+      left: 0;
+      top: 30px;
+      width: 100%;
+      height: 1px;
+      background-color: @border-color;
+    }
+
+    &.van-step--finish {
+      color: @text-color;
+
+      .van-step__circle,
+      .van-step__line {
+        background-color: @green;
+      }
+    }
+
+    &.van-step--process {
+      color: @text-color;
+
+      .van-step__circle-container {
+        top: 24px;
+      }
+
+      .van-icon {
+        font-size: 12px;
+        color: @green;
+        display: block;
+      }
+    }
+  }
+
+  .van-step__circle {
+    display: block;
+    width: 5px;
+    height: 5px;
+    border-radius: 50%;
+    background-color: @gray-dark;
+  }
+
+  &--vertical {
+    float: none;
+    display: block;
+    font-size: 14px;
+    line-height: 18px;
+    padding: 10px 10px 10px 0;
+
+    &:not(:last-child)::after {
+      border-bottom-width: 1px;
+    }
+
+    &:first-child {
+      &::before {
+        content: '';
+        position: absolute;
+        width: 1px;
+        height: 20px;
+        background-color: @white;
+        top: 0;
+        left: -15px;
+        z-index: 1;
+      }
+    }
+
+    .van-step__circle-container > i {
+      position: absolute;
+      z-index: 2;
+    }
+
+    .van-icon-checked {
+      top: 12px;
+      left: -20px;
+      line-height: 1;
+      font-size: 12px;
+    }
+
+    .van-step__circle {
+      top: 16px;
+      left: -17px;
+    }
+
+    .van-step__line {
+      position: absolute;
+      top: 0;
+      left: -15px;
+      width: 1px;
+      height: 100%;
+      background-color: @border-color;
+    }
+  }
+}