Browse Source

Merge branch 'v2' of https://github.com/jdf2e/nutui into v2

unknown 6 years ago
parent
commit
a299b0585c
4 changed files with 97 additions and 95 deletions
  1. 1 0
      src/nutui.js
  2. 1 0
      src/packages/popup/index.js
  3. 95 0
      src/packages/popup/popup.scss
  4. 0 95
      src/packages/popup/popup.vue

+ 1 - 0
src/nutui.js

@@ -95,6 +95,7 @@ import TextBox from "./packages/textbox/index.js";
 import Elevator from "./packages/elevator/index.js";
 import "./packages/elevator/elevator.scss";
 import Popup from "./packages/popup/index.js";
+import "./packages/popup/popup.scss";
 const packages = {
   Cell,
   Dialog,

+ 1 - 0
src/packages/popup/index.js

@@ -1,4 +1,5 @@
 import Popup from "./popup.vue";
+import "./popup.scss";
 
 Popup.install = function(Vue) {
   Vue.component(Popup.name, Popup);

+ 95 - 0
src/packages/popup/popup.scss

@@ -0,0 +1,95 @@
+.popup-fade-enter-active {
+    animation: 0.2s nut-fade-in;
+  }
+  .popup-fade-leave-active {
+    animation: 0.2s nut-fade-out;
+  }
+  
+  .popup-slide {
+    &-top-enter,
+    &-top-leave-active {
+      transform: translate(0, -100%);
+    }
+    &-right-enter,
+    &-right-leave-active {
+      transform: translate(100%, 0);
+    }
+  
+    &-bottom-enter,
+    &-bottom-leave-active {
+      transform: translate(0, 100%);
+    }
+  
+    &-left-enter,
+    &-left-leave-active {
+      transform: translate(-100%, 0);
+    }
+  }
+  
+  .popup-center {
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+  
+  .popup-bottom {
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    &.round {
+      border-radius: 25px 25px 0 0;
+    }
+  }
+  .popup-right {
+    top: 0;
+    right: 0;
+    &.round {
+      border-radius: 25px 0 0 25px;
+    }
+  }
+  
+  .popup-left {
+    top: 0;
+    left: 0;
+    &.round {
+      border-radius: 0 25px 25px 0;
+    }
+  }
+  .popup-top {
+    top: 0;
+    left: 0;
+    width: 100%;
+    &.round {
+      border-radius: 0 0 25px 25px;
+    }
+  }
+  .popup-box {
+    position: fixed;
+    max-height: 100%;
+    overflow-y: auto;
+    background-color: #fff;
+    transition: transform 0.2s;
+    -webkit-overflow-scrolling: touch;
+    z-index: 2028;
+  }
+  @keyframes nut-fade-in {
+    from {
+      opacity: 0;
+    }
+  
+    to {
+      opacity: 1;
+    }
+  }
+  
+  @keyframes nut-fade-out {
+    from {
+      opacity: 1;
+    }
+  
+    to {
+      opacity: 0;
+    }
+  }
+ 
+  

+ 0 - 95
src/packages/popup/popup.vue

@@ -99,98 +99,3 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
-.popup-fade-enter-active {
-  animation: 0.2s van-fade-in;
-}
-.popup-fade-leave-active {
-  animation: 0.2s van-fade-out;
-}
-
-.popup-slide {
-  &-top-enter,
-  &-top-leave-active {
-    transform: translate(0, -100%);
-  }
-  &-right-enter,
-  &-right-leave-active {
-    transform: translate(100%, 0);
-  }
-
-  &-bottom-enter,
-  &-bottom-leave-active {
-    transform: translate(0, 100%);
-  }
-
-  &-left-enter,
-  &-left-leave-active {
-    transform: translate(-100%, 0);
-  }
-}
-
-.popup-center {
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
-
-.popup-bottom {
-  bottom: 0;
-  left: 0;
-  width: 100%;
-  &.round {
-    border-radius: 25px 25px 0 0;
-  }
-}
-.popup-right {
-  top: 0;
-  right: 0;
-  &.round {
-    border-radius: 25px 0 0 25px;
-  }
-}
-
-.popup-left {
-  top: 0;
-  left: 0;
-  &.round {
-    border-radius: 0 25px 25px 0;
-  }
-}
-.popup-top {
-  top: 0;
-  left: 0;
-  width: 100%;
-  &.round {
-    border-radius: 0 0 25px 25px;
-  }
-}
-.popup-box {
-  position: fixed;
-  max-height: 100%;
-  overflow-y: auto;
-  background-color: #fff;
-  transition: transform 0.2s;
-  -webkit-overflow-scrolling: touch;
-  z-index: 2028;
-}
-@keyframes van-fade-in {
-  from {
-    opacity: 0;
-  }
-
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes van-fade-out {
-  from {
-    opacity: 1;
-  }
-
-  to {
-    opacity: 0;
-  }
-}
-</style>