haiwei-ui 1.0.3 → 1.0.5

package/packages/styles/animation/fade.scss

@@ -1,30 +1,30 @@
 .fade-transverse-leave-active,
 .fade-transverse-enter-active {
-    transition: all .5s;
+  transition: all 0.5s;
 }
 
 .fade-transverse-enter {
-    opacity: 0;
-    transform: translateX(-30px);
+  opacity: 0;
+  transform: translateX(-30px);
 }
 
 .fade-transverse-leave-to {
-    opacity: 0;
-    transform: translateX(30px);
+  opacity: 0;
+  transform: translateX(30px);
 }
 
 // 过渡动画 缩放渐变
 .fade-scale-leave-active,
 .fade-scale-enter-active {
-    transition: all .5s;
+  transition: all 0.5s;
 }
 
 .fade-scale-enter {
-    opacity: 0;
-    transform: scale(1.2);
+  opacity: 0;
+  transform: scale(1.2);
 }
 
 .fade-scale-leave-to {
-    opacity: 0;
-    transform: scale(0.8);
-}
+  opacity: 0;
+  transform: scale(0.8);
+}

package/packages/styles/animation/move.scss

@@ -1,15 +1,15 @@
 @mixin move-motion($className, $keyframeName) {
-    @include make-motion($className, $keyframeName);
+  @include make-motion($className, $keyframeName);
 
-    .#{$className}-enter-active,
-    .#{$className}-appear {
-        opacity: 0;
-        animation-timing-function: ease-in-out;
-    }
+  .#{$className}-enter-active,
+  .#{$className}-appear {
+    opacity: 0;
+    animation-timing-function: ease-in-out;
+  }
 
-    .#{$className}-leave-active {
-        animation-timing-function: ease-in-out;
-    }
+  .#{$className}-leave-active {
+    animation-timing-function: ease-in-out;
+  }
 }
 
 @include move-motion(move-up, MoveUp);
@@ -18,113 +18,113 @@
 @include move-motion(move-right, MoveRight);
 
 @keyframes MoveDownIn {
-    0% {
-        transform-origin: 0 0;
-        transform: translateY(100%);
-        opacity: 0;
-    }
-
-    100% {
-        transform-origin: 0 0;
-        transform: translateY(0%);
-        opacity: 1;
-    }
+  0% {
+    transform-origin: 0 0;
+    transform: translateY(100%);
+    opacity: 0;
+  }
+
+  100% {
+    transform-origin: 0 0;
+    transform: translateY(0%);
+    opacity: 1;
+  }
 }
 
 @keyframes MoveDownOut {
-    0% {
-        transform-origin: 0 0;
-        transform: translateY(0%);
-        opacity: 1;
-    }
-
-    100% {
-        transform-origin: 0 0;
-        transform: translateY(100%);
-        opacity: 0;
-    }
+  0% {
+    transform-origin: 0 0;
+    transform: translateY(0%);
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: 0 0;
+    transform: translateY(100%);
+    opacity: 0;
+  }
 }
 
 @keyframes MoveLeftIn {
-    0% {
-        transform-origin: 0 0;
-        transform: translateX(-100%);
-        opacity: 0;
-    }
-
-    100% {
-        transform-origin: 0 0;
-        transform: translateX(0%);
-        opacity: 1;
-    }
+  0% {
+    transform-origin: 0 0;
+    transform: translateX(-100%);
+    opacity: 0;
+  }
+
+  100% {
+    transform-origin: 0 0;
+    transform: translateX(0%);
+    opacity: 1;
+  }
 }
 
 @keyframes MoveLeftOut {
-    0% {
-        transform-origin: 0 0;
-        transform: translateX(0%);
-        opacity: 1;
-    }
-
-    100% {
-        transform-origin: 0 0;
-        transform: translateX(-100%);
-        opacity: 0;
-    }
+  0% {
+    transform-origin: 0 0;
+    transform: translateX(0%);
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: 0 0;
+    transform: translateX(-100%);
+    opacity: 0;
+  }
 }
 
 @keyframes MoveRightIn {
-    0% {
-        opacity: 0;
-        transform-origin: 0 0;
-        transform: translateX(100%);
-    }
-
-    100% {
-        opacity: 1;
-        transform-origin: 0 0;
-        transform: translateX(0%);
-    }
+  0% {
+    opacity: 0;
+    transform-origin: 0 0;
+    transform: translateX(100%);
+  }
+
+  100% {
+    opacity: 1;
+    transform-origin: 0 0;
+    transform: translateX(0%);
+  }
 }
 
 @keyframes MoveRightOut {
-    0% {
-        transform-origin: 0 0;
-        transform: translateX(0%);
-        opacity: 1;
-    }
-
-    100% {
-        transform-origin: 0 0;
-        transform: translateX(100%);
-        opacity: 0;
-    }
+  0% {
+    transform-origin: 0 0;
+    transform: translateX(0%);
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: 0 0;
+    transform: translateX(100%);
+    opacity: 0;
+  }
 }
 
 @keyframes MoveUpIn {
-    0% {
-        transform-origin: 0 0;
-        transform: translateY(-100%);
-        opacity: 0;
-    }
-
-    100% {
-        transform-origin: 0 0;
-        transform: translateY(0%);
-        opacity: 1;
-    }
+  0% {
+    transform-origin: 0 0;
+    transform: translateY(-100%);
+    opacity: 0;
+  }
+
+  100% {
+    transform-origin: 0 0;
+    transform: translateY(0%);
+    opacity: 1;
+  }
 }
 
 @keyframes MoveUpOut {
-    0% {
-        transform-origin: 0 0;
-        transform: translateY(0%);
-        opacity: 1;
-    }
-
-    100% {
-        transform-origin: 0 0;
-        transform: translateY(-100%);
-        opacity: 0;
-    }
-}
+  0% {
+    transform-origin: 0 0;
+    transform: translateY(0%);
+    opacity: 1;
+  }
+
+  100% {
+    transform-origin: 0 0;
+    transform: translateY(-100%);
+    opacity: 0;
+  }
+}

package/packages/styles/components/box-small/_index.scss

@@ -1,73 +1,73 @@
 #{$prefix}box-small {
-    position: relative;
-    width: 100%;
-    height: 100px;
-    border-radius: 5px;
-    cursor: pointer;
+  position: relative;
+  width: 100%;
+  height: 100px;
+  border-radius: 5px;
+  cursor: pointer;
 
-    .inner {
-        position: relative;
-        padding: 15px;
-        color: #fff;
-        height: 100%;
-        box-sizing: border-box;
-
-        .value {
-            font-size: 30px;
-            font-weight: 600;
+  .inner {
+    position: relative;
+    padding: 15px;
+    color: #fff;
+    height: 100%;
+    box-sizing: border-box;
 
-            .unit {
-                font-size: 13px;
-            }
-        }
+    .value {
+      font-size: 30px;
+      font-weight: 600;
 
-        .label {
-            position: absolute;
-            bottom: 20px;
-            font-size: 15px;
-        }
+      .unit {
+        font-size: 13px;
+      }
     }
 
-    .icon {
-        position: absolute;
-        top: 5px;
-        right: 0;
-        color: rgba(0, 0, 0, 0.15);
-        font-size: 70px;
-        transition: all 0.3s ease-in;
-        transform: scale(0.8);
+    .label {
+      position: absolute;
+      bottom: 20px;
+      font-size: 15px;
     }
+  }
 
-    .more {
-        position: absolute;
-        display: none;
-        bottom: 0;
-        padding: 7px 0;
-        width: 100%;
-        text-align: center;
-        color: rgba(255, 255, 255, 0.8);
-        background: rgba(0, 0, 0, 0.15);
-        font-size: 13px;
-        transition: all 0.2s ease-in;
-        border: 0 !important;
+  .icon {
+    position: absolute;
+    top: 5px;
+    right: 0;
+    color: rgba(0, 0, 0, 0.15);
+    font-size: 70px;
+    transition: all 0.3s ease-in;
+    transform: scale(0.8);
+  }
 
-        #{prefix}icon {
-            font-size: 13px;
-        }
+  .more {
+    position: absolute;
+    display: none;
+    bottom: 0;
+    padding: 7px 0;
+    width: 100%;
+    text-align: center;
+    color: rgba(255, 255, 255, 0.8);
+    background: rgba(0, 0, 0, 0.15);
+    font-size: 13px;
+    transition: all 0.2s ease-in;
+    border: 0 !important;
 
-        &:hover {
-            background: rgba(0, 0, 0, 0.25);
-            color: #fff;
-        }
+    #{prefix}icon {
+      font-size: 13px;
     }
 
     &:hover {
-        .icon {
-            transform: scale(1);
-        }
+      background: rgba(0, 0, 0, 0.25);
+      color: #fff;
+    }
+  }
 
-        .more {
-            display: block;
-        }
+  &:hover {
+    .icon {
+      transform: scale(1);
+    }
+
+    .more {
+      display: block;
     }
-}
+  }
+}

package/packages/styles/components/button/_index.scss

@@ -1,9 +1,9 @@
 #{$prefix}button {
-    #{$prefix}icon {
-        transform: scale(1.4);
-    }
+  #{$prefix}icon {
+    transform: scale(1.4);
+  }
 
-    #{$prefix}icon+&-text {
-        margin-left: 5px;
-    }
-}
+  #{$prefix}icon + &-text {
+    margin-left: 5px;
+  }
+}

package/packages/styles/components/container/_index.scss

@@ -1,36 +1,36 @@
 //容器
 #{$prefix}container {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  box-sizing: border-box;
+
+  &-main {
+    padding: 5px;
     height: 100%;
-    overflow: hidden;
     box-sizing: border-box;
 
-    &-main {
-        padding: 5px;
-        height: 100%;
-        box-sizing: border-box;
-
-        >#{$prefix}scrollbar {
-            .el-scrollbar__wrap {
-                overflow-x: hidden;
-
-                .el-scrollbar__view {
-                    height: 100%;
-                }
-            }
+    > #{$prefix}scrollbar {
+      .el-scrollbar__wrap {
+        overflow-x: hidden;
 
-            .is-horizontal {
-                display: none;
-            }
+        .el-scrollbar__view {
+          height: 100%;
         }
+      }
+
+      .is-horizontal {
+        display: none;
+      }
     }
+  }
 
-    &.is-horizontal {
-        .is-horizontal {
-            display: block;
-        }
+  &.is-horizontal {
+    .is-horizontal {
+      display: block;
     }
-}
+  }
+}

package/packages/styles/components/date-range-picker/_index.scss

@@ -1,6 +1,6 @@
 //日期选择组件
 #{$prefix}date-range-picker {
-   .el-date-editor{
-       width: 100% !important;
-   }
-}
+  .el-date-editor {
+    width: 100% !important;
+  }
+}

package/packages/styles/components/details/_index.scss

@@ -1,82 +1,81 @@
 #{$prefix}details {
-    width: 100%;
-    overflow: hidden;
-    border: 1px solid $border-color3;
-
-    &-group {
-        @include flex-row();
-        overflow: hidden;
+  width: 100%;
+  overflow: hidden;
+  border: 1px solid $border-color3;
 
-        &:first-child {
-            border-top: none;
+  &-group {
+    @include flex-row();
+    overflow: hidden;
 
-            #{$prefix}details-item-label,
-            #{$prefix}details-item-content {
-                border-top: none;
-            }
-        }
+    &:first-child {
+      border-top: none;
 
-        &-1 {
-            #{$prefix}details-item {
-                width: 100%;
-            }
-        }
+      #{$prefix}details-item-label,
+      #{$prefix}details-item-content {
+        border-top: none;
+      }
+    }
 
-        &-2 {
-            #{$prefix}details-item {
-                width: 50%;
-            }
-        }
+    &-1 {
+      #{$prefix}details-item {
+        width: 100%;
+      }
+    }
 
-        &-3 {
-            #{$prefix}details-item {
-                width: 33.3333333%;
-            }
-        }
+    &-2 {
+      #{$prefix}details-item {
+        width: 50%;
+      }
+    }
 
-        &-4 {
-            #{$prefix}details-item {
-                width: 25%;
-            }
-        }
+    &-3 {
+      #{$prefix}details-item {
+        width: 33.3333333%;
+      }
+    }
 
-        &-5 {
-            #{$prefix}details-item {
-                width: 20%;
-            }
-        }
+    &-4 {
+      #{$prefix}details-item {
+        width: 25%;
+      }
     }
 
-    &-item {
-        float: left;
-        @include flex-row();
+    &-5 {
+      #{$prefix}details-item {
+        width: 20%;
+      }
+    }
+  }
 
-        &-label {
-            padding: 10px;
-            display: flex;
-            align-items: center;
-            justify-content: flex-end;
-            flex-shrink: 0;
-            color: #336199;
-            background-color: #EDF3F4;
-            border-top: 1px solid #F7FBFF;
-        }
+  &-item {
+    float: left;
+    @include flex-row();
 
-        &-content {
-            padding: 10px;
-            display: flex;
-            align-items: center;
-            justify-content: flex-start;
-            flex-grow: 1;
-            box-sizing: border-box;
-            font-size: 14px;
-            border-top: 1px dotted $border-color3;
-            line-height: 150%;
-        }
+    &-label {
+      padding: 10px;
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+      flex-shrink: 0;
+      color: #336199;
+      background-color: #edf3f4;
+      border-top: 1px solid #f7fbff;
     }
 
-    &.no-border {
-        border: none !important;
-
+    &-content {
+      padding: 10px;
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      flex-grow: 1;
+      box-sizing: border-box;
+      font-size: 14px;
+      border-top: 1px dotted $border-color3;
+      line-height: 150%;
     }
-}
+  }
+
+  &.no-border {
+    border: none !important;
+  }
+}

package/packages/styles/components/details-dialog/_index.scss

@@ -1,19 +1,19 @@
 @import './variables';
 
 #{$prefix}details-dialog {
-    >.el-dialog {
-        >.el-dialog__body {
-            >#{$prefix}dialog-body {
-                >#{$prefix}dialog-content {
-                    >#{$prefix}scrollbar {
-                        >.el-scrollbar__wrap {
-                            >.el-scrollbar__view {
-                                padding: 5px;
-                            }
-                        }
-                    }
-                }
+  > .el-dialog {
+    > .el-dialog__body {
+      > #{$prefix}dialog-body {
+        > #{$prefix}dialog-content {
+          > #{$prefix}scrollbar {
+            > .el-scrollbar__wrap {
+              > .el-scrollbar__view {
+                padding: 5px;
+              }
             }
+          }
         }
+      }
     }
-}
+  }
+}