feat(module: styles): styles in sync with antd mobile of react (#376)

* feat(module: styles): styles in sync with antd mobile of react

components/accordion/style/addon.less

@@ -2,4 +2,8 @@
 
 .@{accordionPrefixCls} {
   display: block;
-}
+}
+
+accordionpanel {
+  display: block;
+}

components/accordion/style/index.less

@@ -3,10 +3,6 @@
 
 @accordionPrefixCls: am-accordion;
 
-accordionpanel {
-  display: block;
-}
-
 .@{accordionPrefixCls} {
   position: relative;
   .hairline('top');

components/action-sheet/style/index.less

@@ -43,19 +43,35 @@
       height: @actionsheet-item-height;
       line-height: @actionsheet-item-height;
       box-sizing: border-box;
+      white-space: nowrap;
+      text-overflow: ellipsis;
       .hairline('top');
       &&-active {
         background-color: @fill-tap;
       }
     }
-
+    &-badge {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .am-badge {
+        margin-left: 8 * @hd;
+        flex-shrink: 0;
+      }
+    }
+    &-item-content {
+      display: inline-block;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
     .@{ActionSheetPrefixCls}-cancel-button {
-      margin-top: @v-spacing-sm;
+      padding-top: @v-spacing-sm;
       position: relative;
 
       &-mask {
         position: absolute;
-        top: -@v-spacing-sm;
+        top: 0;
         left: 0;
         width: 100%;
         height: @v-spacing-sm;

components/activity-indicator/style/index.less

@@ -1,5 +1,5 @@
-@import '../../style/mixins';
 @import '../../style/themes/default';
+@import '../../style/mixins';
 
 @activityIndicatorPrefixCls: am-activity-indicator;
 
@@ -74,4 +74,4 @@
       transform: rotate(360deg);
     }
   }
-}
+}

components/button/style/index.less

@@ -89,6 +89,9 @@
   &-inline {
     display: inline-block;
     padding: 0 @h-spacing-lg;
+    &.@{buttonPrefixCls}-icon {
+      display: inline-flex;
+    }
   }
 
   &-small {

components/calendar/style/index.less

@@ -1,6 +1,5 @@
 @import '../../style/mixins';
 @import '../../style/themes/default';
-//@import './common/index';
 @prefixClass: am-calendar;
 
 // Animation

components/carousel/style/addon.less

@@ -2,6 +2,10 @@ dotindicator{
   display: block;
 }
 
+carouselslide {
+  display: block;
+}
+
 .carousel {
   position: relative;
   display: block;
@@ -29,3 +33,24 @@ dotindicator{
   transform: translate3d(0px, 0px, 0px);
   box-sizing: border-box;
 }
+
+.carousel-container {
+  position: absolute;
+  display: inline-block;
+  list-style-type: none;
+  vertical-align: top;
+  height: auto;
+  box-sizing: border-box;
+}
+
+.carousel-slide {
+  background: white;
+}
+
+.dot-indicator {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  text-align: center;
+}

components/carousel/style/index.less

@@ -1,10 +1,6 @@
 @import '../../style/mixins';
 @import '../../style/themes/default';
 
-carouselslide {
-  display: block;
-}
-
 .am-carousel {
   position: relative;
 

components/components.less

@@ -12,7 +12,6 @@
 @import "./calendar/style/addon.less";
 @import "./card/style/index.less";
 @import "./card/style/addon.less";
-@import "./carousel/style/carousel-slide.less";
 @import "./carousel/style/index.less";
 @import "./carousel/style/addon.less";
 @import "./checkbox/style/index.less";
@@ -29,7 +28,6 @@
 @import "./image-picker/style/addon.less";
 @import "./input-item/style/custom-keyboard.less";
 @import "./input-item/style/index.less";
-@import "./input-item/style/input-item.less";
 @import "./input-item/style/addon.less";
 @import "./list/style/index.less";
 @import "./list/style/addon.less";
@@ -41,7 +39,6 @@
 @import "./modal/style/addon.less";
 @import "./nav-bar/style/index.less";
 @import "./notice-bar/style/index.less";
-@import "./notice-bar/style/notice-bar.less";
 @import "./notice-bar/style/addon.less";
 @import "./pagination/style/index.less";
 @import "./pagination/style/addon.less";
@@ -52,6 +49,7 @@
 @import "./picker-view/style/addon.less";
 @import "./popover/style/base.less";
 @import "./popover/style/index.less";
+@import "./popover/style/addon.less";
 @import "./progress/style/index.less";
 @import "./progress/style/addon.less";
 @import "./pull-to-refresh/style/index.less";

components/flex/style/index.less

@@ -19,10 +19,16 @@
 
   &&-dir-column {
     flex-direction: column;
+    .@{flexPrefixCls}-item {
+      margin-left: 0;
+    }
   }
 
   &&-dir-column-reverse {
     flex-direction: column-reverse;
+    .@{flexPrefixCls}-item {
+      margin-left: 0;
+    }
   }
 
   &&-nowrap {
@@ -82,23 +88,23 @@
   }
 
   &&-align-content-end {
-    align-items: flex-end;
+    align-content: flex-end;
   }
 
   &&-align-content-center {
-    align-items: center;
+    align-content: center;
   }
 
   &&-align-content-between {
-    align-items: stretch;
+    align-content: space-between;
   }
 
   &&-align-content-around {
-    align-items: baseline;
+    align-content: space-around;
   }
 
   &&-align-content-stretch {
-    align-items: baseline;
+    align-content: stretch;
   }
 
   & &-item {

components/grid/style/index.less

@@ -27,7 +27,6 @@
         width: 100%;
         height: 100%;
         padding: @v-spacing-lg 0;
-        box-sizing: content-box;
 
         .@{gridPrefixCls}-item-inner-content {
           display: flex;
@@ -38,16 +37,12 @@
           .@{gridPrefixCls}-icon {
             max-width: 100%;
           }
-          .error {
-            color: red;
-            font-size: 24px;
-          }
+
           .@{gridPrefixCls}-text {
             margin-top: @v-spacing-md;
             font-size: @font-size-caption-sm;
             color: @color-text-base;
             text-align: center;
-            line-height: 1;
           }
 
           &.column-num-3 {
@@ -80,19 +75,20 @@
 
       .@{flexPrefixCls}-item {
         position: relative;
-        // &:first-child {
-        //   .hairline('left');
-        // }
+        &:first-child {
+          .hairline('left');
+        }
         &:not(:last-child) {
           .hairline('right');
         }
       }
     }
-  }
-  &.@{gridPrefixCls}-carousel {
-    .@{gridPrefixCls}-carousel-page {
-      .hairline('top');
-      .hairline('right');
+
+    &.@{gridPrefixCls}-carousel {
+      .@{gridPrefixCls}-carousel-page {
+        .hairline('top');
+        .hairline('right');
+      }
     }
   }
 

components/icon/style/index.less

@@ -1,5 +1,5 @@
-@import '../../style/mixins';
 @import '../../style/themes/default';
+@import '../../style/mixins';
 
 .am-icon {
   fill: currentColor;

components/image-picker/style/index.less

@@ -1,5 +1,5 @@
-@import '../../style/mixins';
 @import '../../style/themes/default';
+@import '../../style/mixins';
 
 @imagePickerPrefixCls: am-image-picker;
 

components/input-item/style/addon.less

@@ -9,3 +9,51 @@ customKeyboard,
 customInput {
   display: block;
 }
+
+.am-list-item.am-list-item-middle .am-list-line {
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.am-list-item .am-list-line {
+  position: relative;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  -webkit-align-self: stretch;
+  -ms-flex-item-align: stretch;
+  align-self: stretch;
+  padding-right: 15px;
+  overflow: hidden;
+}
+
+.am-list-item.am-input-item {
+  height: 44px;
+  padding-left: 15px;
+}
+
+.am-list-item {
+  position: relative;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  padding-left: 15px;
+  min-height: 44px;
+  background-color: #fff;
+  vertical-align: middle;
+  overflow: hidden;
+  -webkit-transition: background-color 200ms;
+  transition: background-color 200ms;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+}

components/input-item/style/custom-keyboard.less

@@ -1,7 +1,6 @@
 @import '../../style/themes/default';
 @import '../../style/mixins';
 
-
 @listPrefixCls: am-list;
 @inputPrefixCls: am-input;
 @keyboardPrefixCls: am-number-keyboard;
@@ -80,7 +79,6 @@
   left: 0;
   right: 0;
   width: 100%;
-  height: 200 * @hd;
   z-index: 10000;
   font-family: 'PingFang SC';
   background-color: #f6f6f7;
@@ -163,4 +161,4 @@
   to {
     opacity: 1;
   }
-}
+}