feat 首页适配自己手机

IOReportSysMP/miniprogram/pages/index/index.scss

@@ -1,47 +1,57 @@
-.banner {
-  display: flex;
-
-  image {
-    width: 200px;
-    height: 150px;
-    margin: 30px auto;
-  }
-}
-
-.btn-list {
+.index-container {
   display: flex;
   flex-direction: column;
-  $btn-item-height: 120rpx;
-  $btn-item-icon: 116rpx;
-  .btn-item {
+  justify-content: center;
+  align-items: center;
+  height: 80vh;
+  .banner {
     display: flex;
-    // border-bottom: 1px solid gray;
-    justify-content: center;
-    align-items: center;
+
     image {
-      background-color: rgb(146, 206, 248);
-      width: $btn-item-icon;
-      height: $btn-item-icon;
-      border-radius: 100%;
-      position: relative;
-      right: 15px;
-      margin: ($btn-item-height - $btn-item-icon) / 2;
-      box-shadow: rgba(128, 128, 128, 0.3) 1px 4px 5px 0.5px;
+      width: 200px;
+      height: 150px;
+      margin: 30px auto;
     }
   }
 
-  text {
-    border-radius: 25rpx;
-    height: $btn-item-height;
-    line-height: $btn-item-height;
-    font-size: 32px;
-    font-weight: 600;
-    color: black;
-    display: block;
-    &::after{
-      content: "";
-      border-bottom: rgba(128, 128, 128, 0.3) solid 1px;
+  .btn-list {
+    display: flex;
+    flex-direction: column;
+    $btn-item-height: 120rpx;
+    $btn-item-icon: 116rpx;
+
+    .btn-item {
+      display: flex;
+      // border-bottom: 1px solid gray;
+      justify-content: center;
+      align-items: center;
+
+      image {
+        background-color: rgb(146, 206, 248);
+        width: $btn-item-icon;
+        height: $btn-item-icon;
+        border-radius: 100%;
+        position: relative;
+        right: 15px;
+        margin: ($btn-item-height - $btn-item-icon) / 2;
+        box-shadow: rgba(128, 128, 128, 0.3) 1px 4px 5px 0.5px;
+      }
+    }
+
+    text {
+      border-radius: 25rpx;
+      height: $btn-item-height;
+      line-height: $btn-item-height;
+      font-size: 32px;
+      font-weight: 600;
+      color: black;
       display: block;
+
+      &::after {
+        content: "";
+        border-bottom: rgba(128, 128, 128, 0.3) solid 1px;
+        display: block;
+      }
     }
   }
 }

IOReportSysMP/miniprogram/pages/index/index.wxml

@@ -1,6 +1,6 @@
 <navigationBar onlyStations title="教师进出校管理系统">
 </navigationBar>
-<view>
+<view class="index-container">
   <view class="banner">
     <image src="/asset/banenr.png"></image>
   </view>