From 1e506513de1552643f13c159b0427818fec2bef4 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Wed, 23 Oct 2019 17:42:40 +0800
Subject: [PATCH] feat(Popup): improve transform style (#2193)

---
 example/pages/popup/index.wxml |  2 +-
 packages/popup/index.less      | 22 ++++++----------------
 2 files changed, 7 insertions(+), 17 deletions(-)

diff --git a/example/pages/popup/index.wxml b/example/pages/popup/index.wxml
index 29adf6e9..5f98c12b 100644
--- a/example/pages/popup/index.wxml
+++ b/example/pages/popup/index.wxml
@@ -2,7 +2,7 @@
   <van-cell title="展示弹出层" is-link bind:click="showBasic" />
   <van-popup
     show="{{ show.basic }}"
-    custom-style="padding: 16px 16px 160px"
+    custom-style="padding: 30px 50px"
     bind:close="hideBasic"
   >
     内容
diff --git a/packages/popup/index.less b/packages/popup/index.less
index 4139c813..8d7a027f 100644
--- a/packages/popup/index.less
+++ b/packages/popup/index.less
@@ -3,8 +3,6 @@
 
 .van-popup {
   position: fixed;
-  top: 50%;
-  left: 50%;
   box-sizing: border-box;
   max-height: 100%;
   overflow-y: auto;
@@ -14,6 +12,8 @@
   .theme(background-color, '@white');
 
   &--center {
+    top: 50%;
+    left: 50%;
     transform: translate3d(-50%, -50%, 0);
 
     &.van-popup--round {
@@ -23,11 +23,8 @@
 
   &--top {
     top: 0;
-    right: auto;
-    bottom: auto;
-    left: 50%;
+    left: 0;
     width: 100%;
-    transform: translate3d(-50%, 0, 0);
 
     &.van-popup--round {
       .theme(
@@ -40,8 +37,6 @@
   &--right {
     top: 50%;
     right: 0;
-    bottom: auto;
-    left: auto;
     transform: translate3d(0, -50%, 0);
 
     &.van-popup--round {
@@ -53,12 +48,9 @@
   }
 
   &--bottom {
-    top: auto;
-    right: auto;
     bottom: 0;
-    left: 50%;
+    left: 0;
     width: 100%;
-    transform: translate3d(-50%, 0, 0);
 
     &.van-popup--round {
       .theme(
@@ -70,8 +62,6 @@
 
   &--left {
     top: 50%;
-    right: auto;
-    bottom: auto;
     left: 0;
     transform: translate3d(0, -50%, 0);
 
@@ -169,12 +159,12 @@
 
 .van-bottom-enter,
 .van-bottom-leave-to {
-  transform: translate3d(-50%, 100%, 0);
+  transform: translate3d(0, 100%, 0);
 }
 
 .van-top-enter,
 .van-top-leave-to {
-  transform: translate3d(-50%, -100%, 0);
+  transform: translate3d(0, -100%, 0);
 }
 
 .van-left-enter,