style(action-sheet): make sure the layout is correct when actions is to much (#7401)

src/action-sheet/index.less

@@ -2,7 +2,10 @@
 @import '../style/mixins/hairline';
 
 .van-action-sheet {
+  display: flex;
+  flex-direction: column;
   max-height: @action-sheet-max-height;
+  overflow: hidden;
   color: @action-sheet-item-text-color;
 
   &__item,
@@ -42,6 +45,8 @@
   }
 
   &__cancel {
+    flex-shrink: 0;
+    box-sizing: border-box;
     color: @action-sheet-cancel-text-color;
   }
 
@@ -59,6 +64,7 @@
   }
 
   &__header {
+    flex-shrink: 0;
     font-weight: @font-weight-bold;
     font-size: @action-sheet-header-font-size;
     line-height: @action-sheet-header-height;
@@ -67,6 +73,7 @@
 
   &__description {
     position: relative;
+    flex-shrink: 0;
     padding: 20px @padding-md;
     color: @action-sheet-description-color;
     font-size: @action-sheet-description-font-size;
@@ -96,4 +103,16 @@
       color: @action-sheet-close-icon-active-color;
     }
   }
+
+  &__inner {
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    overflow: hidden;
+  }
+
+  &__main {
+    flex: 1;
+    overflow-y: scroll;
+  }
 }