Browse Source

优化布局

master
ltlzx 4 years ago
parent
commit
c2ee1c0cbd
  1. 8
      src/assets/css/main.css
  2. 3
      src/components/Header.vue
  3. 27
      src/components/Home.vue
  4. 2
      src/components/Sidebar.vue

8
src/assets/css/main.css

@ -8,7 +8,7 @@ body,
.wrapper {
width: 100%;
height: 100%;
overflow: hidden;
/* overflow: hidden; */
}
body {
font-family: 'PingFang SC', "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif;
@ -29,13 +29,15 @@ body {
.body{
padding: 0 20px;
padding-top: 20px;
}
.query{
height: 105px;
background-color: white;
padding-left: 36px;
padding-right: 30px;
min-width: 1460px;
/* min-width: 1460px; */
}
.f_title{
font-size:16px
@ -78,7 +80,7 @@ body {
padding-right: 30px;
box-sizing: border-box;
overflow-y: auto;
min-width: 1460px;
/* min-width: 1460px; */
}
.table_title{
display: flex;

3
src/components/Header.vue

@ -40,7 +40,8 @@ export default {
color: white;
}
.header{
width: 100%;
/* width: 100%; */
min-width: 1903px;
height: 65px;
display: flex;
align-items: center;

27
src/components/Home.vue

@ -3,13 +3,15 @@
<v-head :name="data.accountName"></v-head>
<div class="bootm">
<v-sidebar :auth="data.auth"></v-sidebar>
<div class="content-box">
<div class="content">
<transition name="move" mode="out-in">
<router-view></router-view>
</transition>
<!-- <div> -->
<div class="content-box">
<div class="content">
<transition name="move" mode="out-in">
<router-view></router-view>
</transition>
</div>
</div>
</div>
<!-- </div> -->
</div>
</div>
</template>
@ -72,18 +74,27 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.wrapper{
overflow:auto;
/* overflow: overlay */
}
.content-box{
width: 100%;
min-height:903px;
min-width: 1700px;
border-top: 2px solid #9A9A9A;
border-left: 2px solid #9A9A9A;
background: #F0F2F5;
box-sizing: border-box;
/* overflow: auto; */
}
.content{
}
.bootm{
display: flex;
height: 100%;
/* height: 100%; */
/* min-height:903px; */
background: #F0F2F5;
}
</style>

2
src/components/Sidebar.vue

@ -196,7 +196,7 @@ export default {
<style scoped>
.sidebar_body{
width: 200px;
height: 100%;
/* height: 100%; */
}
.sidebar{
height: 100%;

Loading…
Cancel
Save