fix: fix overflow hidden for mobile page

web/src/App.vue

@@ -67,155 +67,4 @@ html, body {
   white-space: nowrap;
 }
 
-.sl {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-  overflow: hidden;
-}
-
-.sl3 {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-  overflow: hidden;
-}
-
-.sl4 {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-  overflow: hidden;
-}
-
-/* 居中布局 */
-.auto_center {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
-
-.h_center {
-  width: 100%;
-  position: absolute;
-  top: 50%;
-  transform: translateY(-50%);
-  -webkit-transform: translateY(-50%);
-}
-
-.w_center {
-  position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
-  -webkit-transform: translateX(-50%);
-}
-
-/* flex布局 */
-.flex-row {
-  display: flex;
-  flex-direction: row;
-}
-
-.flex-col {
-  display: flex;
-  flex-direction: column;
-}
-
-.justify-start {
-  justify-content: flex-start;
-}
-
-.justify-end {
-  justify-content: flex-end;
-}
-
-.justify-center {
-  justify-content: center;
-}
-
-.justify-between {
-  justify-content: space-between;
-}
-
-.justify-around {
-  justify-content: space-around;
-}
-
-.justify-evenly {
-  justify-content: space-evenly;
-}
-
-.items-start {
-  align-items: flex-start;
-}
-
-.items-end {
-  align-items: flex-end;
-}
-
-.items-center {
-  align-items: center;
-}
-
-.items-baseline {
-  align-items: baseline;
-}
-
-.items-stretch {
-  align-items: stretch;
-}
-
-.self-start {
-  align-self: flex-start;
-}
-
-.self-end {
-  align-self: flex-end;
-}
-
-.self-center {
-  align-self: center;
-}
-
-.self-baseline {
-  align-self: baseline;
-}
-
-.self-stretch {
-  align-self: stretch;
-}
-
-.flex-1 {
-  flex: 1 1 0%;
-}
-
-.flex-auto {
-  flex: 1 1 auto;
-}
-
-.grow {
-  flex-grow: 1;
-}
-
-.grow-0 {
-  flex-grow: 0;
-}
-
-.shrink {
-  flex-shrink: 1;
-}
-
-.shrink-0 {
-  flex-shrink: 0;
-}
-
-.shrink-1 {
-  flex-shrink: 1;
-}
-
-.relative {
-  position: relative;
-}
-
 </style>

web/src/assets/css/main.css

@@ -4,7 +4,6 @@ body,
 .wrapper {
   width: 100%;
   height: 100%;
-  overflow: hidden;
 }
 body {
   font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;

web/src/assets/css/main.styl

@@ -9,7 +9,6 @@ body,
 .wrapper {
   width: 100%;
   height: 100%;
-  overflow: hidden;
 }
 
 body {

web/src/assets/css/mobile/chat-list.css

@@ -1,13 +1,13 @@
-.mobile-chat-list .content .van-cell__value .chat-list-item {
+.mobile-chat-list .content .van-list .van-cell__value .chat-list-item {
   display: flex;
   font-size: 14px;
 }
-.mobile-chat-list .content .van-cell__value .chat-list-item .van-image {
+.mobile-chat-list .content .van-list .van-cell__value .chat-list-item .van-image {
   min-width: 32px;
   width: 32px;
   height: 32px;
 }
-.mobile-chat-list .content .van-cell__value .chat-list-item .van-ellipsis {
+.mobile-chat-list .content .van-list .van-cell__value .chat-list-item .van-ellipsis {
   margin-top: 5px;
   margin-left: 10px;
 }

web/src/assets/css/mobile/chat-list.styl

@@ -1,19 +1,21 @@
 .mobile-chat-list {
   .content {
-    .van-cell__value {
-      .chat-list-item {
-        display flex
-        font-size 14px
+    .van-list {
+      .van-cell__value {
+        .chat-list-item {
+          display flex
+          font-size 14px
 
-        .van-image {
-          min-width 32px
-          width 32px
-          height 32px
-        }
+          .van-image {
+            min-width 32px
+            width 32px
+            height 32px
+          }
 
-        .van-ellipsis {
-          margin-top 5px;
-          margin-left 10px;
+          .van-ellipsis {
+            margin-top 5px;
+            margin-left 10px;
+          }
         }
       }
     }

web/src/assets/css/mobile/chat-session.css

@@ -1,5 +1,4 @@
 .mobile-chat .message-list-box {
-  padding-top: 50px;
   padding-bottom: 10px;
   overflow-x: auto;
   background: #f5f5f5;

web/src/assets/css/mobile/chat-session.styl

@@ -1,6 +1,6 @@
 .mobile-chat {
   .message-list-box {
-    padding-top 50px
+    //padding-top 50px
     padding-bottom 10px
     overflow-x auto
     background #F5F5F5;

web/src/assets/css/mobile/image-mj.css

@@ -104,7 +104,7 @@
   width: 100%;
 }
 .mobile-mj .content .finish-job-list .van-grid .van-grid-item .van-grid-item__content .job-item .opt .opt-btn {
-  padding: 3px 10px;
+  padding: 2px 0;
   text-align: center;
   border-radius: 5px;
   margin: 3px 0;
@@ -112,6 +112,8 @@
   cursor: pointer;
   background-color: #4e5058;
   color: #fff;
+  font-size: 14px;
+  width: 100%;
 }
 .mobile-mj .content .finish-job-list .van-grid .van-grid-item .van-grid-item__content .job-item .van-image {
   width: 100%;

web/src/assets/css/mobile/image-mj.styl

@@ -144,7 +144,7 @@
 
               .opt {
                 .opt-btn {
-                  padding 3px 10px
+                  padding 2px 0
                   text-align center
                   border-radius 5px
                   margin 3px 0
@@ -152,6 +152,8 @@
                   cursor pointer
                   background-color #4E5058
                   color #ffffff
+                  font-size 14px
+                  width 100%
                 }
               }
 

web/src/views/mobile/Home.vue

@@ -48,7 +48,7 @@ const onChange = (index) => {
     }
 
     .content {
-      padding 46px 10px 60px 10px;
+      padding 46px 10px 60px 10px
     }
   }
 

web/src/views/mobile/ImageMj.vue

@@ -163,7 +163,7 @@
 
                 <div class="opt" v-if="item['can_opt']">
 
-                  <van-grid :gutter="0" :column-num="4">
+                  <van-grid :gutter="3" :column-num="4">
                     <van-grid-item><a @click="upscale(1, item)" class="opt-btn">U1</a></van-grid-item>
                     <van-grid-item><a @click="upscale(2, item)" class="opt-btn">U2</a></van-grid-item>
                     <van-grid-item><a @click="upscale(3, item)" class="opt-btn">U3</a></van-grid-item>

web/src/views/mobile/ImgWall.vue

@@ -12,6 +12,7 @@
               error-text="请求失败，点击重新加载"
               finished-text="没有更多了"
               @load="onLoad"
+              style="height: 100%;width: 100%;"
           >
             <van-cell v-for="item in data['mj'].data" :key="item.id">
               <van-image :src="item['img_thumb']" @click="showPrompt(item)" fit="cover"/>