From e359ed6acec068601e1d12b58aa497c1fc9af516 Mon Sep 17 00:00:00 2001
From: codpoe <codpoe.me@gmail.com>
Date: Wed, 11 Sep 2019 20:38:55 +0800
Subject: [PATCH] feat(Sku): update style (#4437)

---
 src/sku/Sku.js                    |  1 -
 src/sku/components/SkuMessages.js |  2 +-
 src/sku/index.less                | 26 +++++++++++---------------
 src/style/var.less                |  2 +-
 4 files changed, 13 insertions(+), 18 deletions(-)

diff --git a/src/sku/Sku.js b/src/sku/Sku.js
index c764cfb13..c36ceb489 100644
--- a/src/sku/Sku.js
+++ b/src/sku/Sku.js
@@ -546,7 +546,6 @@ export default createComponent({
         round
         closeable
         position="bottom"
-        closeIcon="clear"
         class="van-sku-container"
         getContainer={this.getContainer}
         closeOnClickOverlay={this.closeOnClickOverlay}
diff --git a/src/sku/components/SkuMessages.js b/src/sku/components/SkuMessages.js
index cdb8a5c0c..27b6412c1 100644
--- a/src/sku/components/SkuMessages.js
+++ b/src/sku/components/SkuMessages.js
@@ -113,7 +113,7 @@ export default createComponent({
 
   render() {
     return (
-      <CellGroup class={bem()}>
+      <CellGroup class={bem()} border={this.messages.length > 0}>
         {this.messages.map((message, index) => (message.type === 'image' ? (
           <Cell
             class={bem('image-cell')}
diff --git a/src/sku/index.less b/src/sku/index.less
index 97d01872f..6bba8b17b 100644
--- a/src/sku/index.less
+++ b/src/sku/index.less
@@ -6,17 +6,11 @@
     display: flex;
     flex-direction: column;
     align-items: stretch;
-    height: 80%;
-    max-height: max-content; /* avoid androiod keyboard cover fields */
+    min-height: 50%;
+    max-height: 80%;
     overflow-y: visible;
     font-size: @font-size-md;
     background: @white;
-
-    .van-popup__close-icon {
-      top: @padding-sm;
-      color: @sku-icon-gray-color;
-      font-size: 20px;
-    }
   }
 
   &-body {
@@ -55,6 +49,9 @@
     }
 
     &__goods-info {
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-end;
       min-height: 96px;
       padding: @padding-sm 36px @padding-sm @padding-xs;
       overflow: hidden;
@@ -225,8 +222,7 @@
   }
 
   &-messages {
-    padding-bottom: @padding-xs;
-    background: @background-color;
+    padding-bottom: @padding-xl;
 
     &__image-cell {
       .van-cell__title {
@@ -314,7 +310,7 @@
     padding: @padding-xs @padding-md;
 
     .van-button {
-      height: 36px;
+      height: 40px;
       font-weight: 500;
       font-size: @font-size-md;
       line-height: 34px;
@@ -322,13 +318,13 @@
       border-radius: 0;
 
       &:first-of-type {
-        border-top-left-radius: 18px;
-        border-bottom-left-radius: 18px;
+        border-top-left-radius: 20px;
+        border-bottom-left-radius: 20px;
       }
 
       &:last-of-type {
-        border-top-right-radius: 18px;
-        border-bottom-right-radius: 18px;
+        border-top-right-radius: 20px;
+        border-bottom-right-radius: 20px;
       }
 
       &--warning {
diff --git a/src/style/var.less b/src/style/var.less
index 484534ec2..df1cd664e 100644
--- a/src/style/var.less
+++ b/src/style/var.less
@@ -437,7 +437,7 @@
 // Popup
 @popup-background-color: @white;
 @popup-transition: transform @animation-duration-base ease-out;
-@popup-round-border-radius: 12px;
+@popup-round-border-radius: 20px;
 @popup-close-icon-size: 18px;
 @popup-close-icon-color: @gray-dark;
 @popup-close-icon-margin: 16px;