FIX 移动端全局媒体查询覆盖样式

This commit is contained in:
sc 2021-07-28 16:08:17 +08:00
parent 6ed75b914c
commit 98321aabd4
4 changed files with 48 additions and 15 deletions

38
src/style/media.less Normal file
View File

@ -0,0 +1,38 @@
@media (max-width: 992px){
// 移动端样式覆盖
.el-form-item {display: block;}
.el-form-item__label {display: block;text-align: left;padding: 0 0 10px;}
.el-dialog {width: 90%!important;}
.el-drawer.rtl {width: 90%!important;}
.el-form-item__content {margin-left: 0px!important;}
.adminui-main {
.el-container {display: block;height:auto;}
.el-aside {width: 100%!important;border: 0}
}
.scTable {
.el-table,
.el-table__body-wrapper {display: block!important;height:auto!important;}
.scTable-page {padding: 0 5px!important;}
.el-pagination__total,
.el-pagination__jump,
.scTable-do {display: none!important;}
}
.headerPublic {
height: auto!important;display: block;
.left-panel {overflow: auto;}
.left-panel::-webkit-scrollbar{display: none;}
.right-panel {display: block;border-top: 1px solid #ebeef5;margin-top: 15px;}
.right-panel .right-panel-search {display: block;}
.right-panel .right-panel-search >* {width: 100%;margin: 0;margin-top: 15px;}
}
.adminui-main > .el-container >*:first-child:not(.el-aside):not(.el-header) {border: 0;margin-top: 0;}
.adminui-main > .el-container >*:first-child:not(.el-aside):not(.el-header) + .el-aside {margin-top: 0;}
.adminui-main > .el-container > .el-aside {border-bottom: 1px solid #ebeef5!important;}
.adminui-main > .el-container > .el-container {border-top: 1px solid #ebeef5;border-bottom: 1px solid #ebeef5;margin-top: 15px;}
.adminui-main > .el-container > .el-header {.headerPublic;border-bottom: 1px solid #ebeef5;}
.adminui-main > .el-container > .el-main {border-top: 1px solid #ebeef5;border-bottom: 1px solid #ebeef5;margin-top: 15px;}
.adminui-main > .el-container > .el-main + .el-aside {border-left: 0!important;border-top: 1px solid #ebeef5;margin-top: 15px;}
.adminui-main > .el-container > .el-container > .el-header {.headerPublic}
}

View File

@ -14,11 +14,3 @@
.static-table {border-collapse: collapse;width: 100%;font-size: 14px;margin-bottom: 45px;line-height: 1.5em;}
.static-table th {text-align: left;white-space: nowrap;color: #909399;font-weight: 400;border-bottom: 1px solid #dcdfe6;padding: 15px;max-width: 250px;}
.static-table td {border-bottom: 1px solid #dcdfe6;padding: 15px;max-width: 250px;color: #606266;}
@media (max-width: 992px){
.el-form-item {display: block;}
.el-form-item__label {display: block;text-align: left;padding: 0 0 10px;}
.el-dialog {width: 90%!important;}
.el-drawer.rtl {width: 90%!important;}
.el-form-item__content {margin-left: 0px!important;}
}

View File

@ -4,4 +4,5 @@
@import 'app.less';
@import 'fix.less';
@import 'pages.less';
@import 'media.less';
@import '~@/assets/font/scicon/iconfont.css';

View File

@ -17,13 +17,15 @@
<el-button v-if="selection.length>0">推送至队列</el-button>
</div>
<div class="right-panel">
<el-radio-group v-model="group">
<el-radio-button label="0">所有</el-radio-button>
<el-radio-button label="1">未完成 (2)</el-radio-button>
<el-radio-button label="2">弃坑 (1)</el-radio-button>
<el-radio-button label="3">其他</el-radio-button>
</el-radio-group>
<scFilterBar :options="options" @change="change"></scFilterBar>
<div class="right-panel-search">
<el-radio-group v-model="group">
<el-radio-button label="0">所有</el-radio-button>
<el-radio-button label="1">未完成 (2)</el-radio-button>
<el-radio-button label="2">弃坑 (1)</el-radio-button>
<el-radio-button label="3">其他</el-radio-button>
</el-radio-group>
<scFilterBar :options="options" @change="change"></scFilterBar>
</div>
</div>
</el-header>
<el-main class="nopadding">