UP 大布局更换为flex布局
This commit is contained in:
parent
b2585ff6cd
commit
f47dcabad7
|
|
@ -15,8 +15,12 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
|
|||
::-webkit-scrollbar-track {background-color: rgba(50, 50, 50, 0.1);}
|
||||
::-webkit-scrollbar-track:hover {background-color: rgba(50, 50, 50, 0.2);}
|
||||
|
||||
.aminui-side-split {position: absolute;top:0px;left:0px;bottom:0px;width:65px;background: #333;z-index: 5;}
|
||||
.adminui-side-split-scroll {position: absolute;top:0px;left:0px;bottom:0px;right:0px;overflow: auto;overflow-x:hidden;}
|
||||
/* 大布局样式 */
|
||||
.aminui {display: flex;}
|
||||
|
||||
/* 左侧菜单 */
|
||||
.aminui-side-split {width:65px;background: #333;}
|
||||
.adminui-side-split-scroll {overflow: auto;overflow-x:hidden;height: 100%;}
|
||||
.aminui-side-split li {cursor: pointer;width: 65px;height: 65px;color: #fff;text-align: center;display: flex;flex-direction: column;align-items: center;justify-content: center;}
|
||||
.aminui-side-split li i {font-size: 16px;}
|
||||
.aminui-side-split li p {margin-top:5px;}
|
||||
|
|
@ -28,12 +32,13 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
|
|||
.adminui-side-split-scroll::-webkit-scrollbar-track {background-color: rgba(255, 255, 255, 0);}
|
||||
.adminui-side-split-scroll::-webkit-scrollbar-track:hover {background-color: rgba(255, 255, 255, 0);}
|
||||
|
||||
.aminui-side {position: absolute;z-index: 5;top:0px;left:65px;bottom:0px;width:210px;background: #fff;box-shadow: 2px 0 8px 0 rgba(29,35,41,.05);border-right: 1px solid #e6e6e6;}
|
||||
.aminui-side {display: flex;flex-flow: column;width:210px;background: #fff;box-shadow: 2px 0 8px 0 rgba(29,35,41,.05);border-right: 1px solid #e6e6e6;}
|
||||
.adminui-side-top {border-bottom: 1px solid #ebeef5;height:50px;line-height: 50px;}
|
||||
.adminui-side-top h2 {padding:0 20px;font-size: 17px;color: #3c4a54;}
|
||||
.adminui-side-scroll {position: absolute;top:50px;left:0px;bottom:0px;right:0px;overflow: auto;overflow-x:hidden;}
|
||||
.adminui-side-scroll {overflow: auto;overflow-x:hidden;flex: 1;}
|
||||
|
||||
.aminui-body {position: absolute;z-index: 4;top:0px;left:275px;bottom:0px;right:0px;}
|
||||
/* 右侧内容 */
|
||||
.aminui-body {flex: 1;display: flex;flex-flow: column;}
|
||||
|
||||
.adminui-header {height: 50px;border-bottom: 1px solid #ebeef5;background: #fff;box-shadow: 0 1px 4px rgba(0,21,41,.08);display: flex;justify-content:space-between;}
|
||||
.adminui-header .left-panel {display: flex;align-items: center;padding-left:20px;}
|
||||
|
|
@ -67,4 +72,4 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
|
|||
.adminui-tags li.active {background: #09f;}
|
||||
.adminui-tags li.active a {color: #fff;}
|
||||
|
||||
.adminui-main {position: absolute;top:85px;left:0px;right:0px;bottom:0px;overflow: auto;background-color: #f6f8f9;}
|
||||
.adminui-main {overflow: auto;background-color: #f6f8f9;flex: 1;}
|
||||
|
|
|
|||
|
|
@ -13,5 +13,5 @@
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
iframe {border:0;position: absolute;top:0px;left:0px;right:0px;bottom:0px;width:100%;height:100%;}
|
||||
iframe {border:0;width:100%;height:100%;display: block;}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
|
||||
<el-col :xl="6" :lg="8" :md="8" :sm="12" :xs="24" v-for="item in list" :key="item.title">
|
||||
<el-card shadow="hover" :body-style="{ padding: '0px' }">
|
||||
<el-image :src="item.image" fit="cover"></el-image>
|
||||
<el-image :src="item.image" fit="cover" :preview-src-list="[item.image]"></el-image>
|
||||
<div class="title">
|
||||
<h2>{{item.title}}</h2>
|
||||
<p>
|
||||
|
|
|
|||
Loading…
Reference in New Issue