Browse Source

fix: 修正tab side显示问题

ChenYangfan 6 years ago
parent
commit
9134c23c17

+ 2 - 2
src/components/Layouts/TabSideComponent.vue

@@ -47,6 +47,7 @@ export default {
   max-width: 450px;
   margin: 0 auto;
   padding: 0 16px;
+  box-sizing: border-box;
 }
 
 .small {
@@ -56,12 +57,11 @@ export default {
   left: 0;
   right: 0;
   display: flex;
-  width: 100%;
   flex: 1;
-  padding: 24px;
   align-items: center;
   background: white;
   & > .content {
+    padding: 64px 24px;
     min-height: 60vh;
   }
 }

+ 2 - 2
src/views/shared/UserHomeLayout.vue

@@ -24,7 +24,7 @@
     <div class="menu-container-small">
       <template v-for="tab of tabs">
         <icon-button
-          :size="50"
+          :size="44"
           :theme="currentRouteName.match(tab.name) ? 'blue' : ''"
           :key="tab.name"
           @click="handleIconButtonClick(tab.name)"
@@ -153,7 +153,7 @@ export default {
     background: rgba(255, 255, 255, 0.8);
     width: 100%;
     position: fixed;
-    padding: 12px 0;
+    padding: 8px 0 12px 0;
     height: 54px;
     box-sizing: border-box;
     bottom: 0;