zanui css build

2017-02-24 17:46:56 +08:00
parent 3ba60907b7
commit f524d6ccd2
26 changed files with 71 additions and 30 deletions
@@ -0,0 +1,95 @@
+@import "./mixins/border_retina.pcss";
+
+@component-namespace z {
+  @b dialog-wrapper {
+    position: absolute;
+  }
+
+  @b dialog {
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    transform: translate3d(-50%, -50%, 0);
+    background-color: #fff;
+    width: 85%;
+    border-radius: 4px;
+    font-size: 16px;
+    overflow: hidden;
+    backface-visibility: hidden;
+    transition: .2s;
+
+    @e header {
+      padding: 15px 0 0;
+    }
+
+    @e content {
+      padding: 15px 20px;
+      min-height: 36px;
+      position: relative;
+
+      &::after {
+        @mixin border-retina (bottom);
+      }
+    }
+
+    @e title {
+      text-align: center;
+      padding-left: 0;
+      margin-bottom: 0;
+      font-size: 16px;
+      color: #333;
+    }
+
+    @e message {
+      color: #999;
+      margin: 0;
+      font-size: 14px;
+      line-height: 1.5;
+    }
+
+    @e footer {
+      font-size: 14px;
+      overflow: hidden;
+
+      @when twobtn {
+        .z-dialog__btn {
+          width: 50%;
+        }
+
+        .z-dialog__cancel {
+          &::after {
+            @mixin border-retina (right);
+          }
+        }
+      }
+    }
+
+    @e btn {
+      line-height: 40px;
+      border: 0;
+      background-color: #fff;
+      float: left;
+      box-sizing: border-box;
+      text-align: center;
+      position: relative;
+    }
+
+    @e cancel {
+      color: #333;
+    }
+
+    @e confirm {
+      color: #00C000;
+      width: 100%;
+    }
+  }
+}
+
+.dialog-bounce-enter {
+  opacity: 0;
+  transform: translate3d(-50%, -50%, 0) scale(0.7);
+}
+.dialog-bounce-leave-active {
+  opacity: 0;
+  transform: translate3d(-50%, -50%, 0) scale(0.9);
+}