@import 'style'; @import 'base'; $height: 64px; .el-header { padding: 0; height: $height !important; } .header { background: #fff; color: #333; height: 64px !important; font-size-adjust: 20px; line-height: 64px; font-weight: bolder; padding: 0 24px; border-bottom:1px solid #fff; font-size: 20px; padding-left: 180px; img{ position: absolute; left: 10px; top: 12px; } .logout { color: #FA0A2F; font-size: 14px; float: right; font-weight: normal; } } .main { position: relative; height: calc(100vh - 65px); background: #F4F4F4; padding-top: 1px; } .left-aside { height: 100%; overflow-y: auto; overflow-x: hidden; background: #fff; .left-menue { border: none; &>.is-active { // background-color: rgba(255, 81, 81, .2) !important; position: relative; border-left: 8px solid #FF5151; transition: all .3s linear; .iconfont { // color: #ffffff; } &>.el-submenu__title { // color: #ffffff !important; } .is-active { // background-color: rgba(255, 81, 81, .2) !important; // border-left: 8px solid #FF5151; transition: all .3s linear; position: relative; font-weight: bold; .iconfont { // color: #ffffff; } } } .is-opened { background-color: #FFE6E6 !important; border: none !important; ul{ background-color: #FFE6E6 !important; } &>.el-submenu__title { border-left: 2px solid #FF5151 } } .el-menu-item-group__title { padding: 0; } .child { padding-left: 60px !important; } .el-menu-item, .el-submenu__title { height: 48px; line-height: 48px; font-size: 13px; } // .el-menu-item{ // height: 44px; // line-height: 44px; // } } .iconfont { margin-right: 5px; } } .el-main { // border: 1px solid red; padding: 20px 20px; position: relative; // overflow:hidden; section>p { color: #666666; font-size: 14px; font-weight: 400; span { color: #cccccc; } } .content { background: #fff; // padding: 20px !important; height: 100vh; margin: 0 !important; height: calc(100vh - 100px); box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.12); // overflow:scroll; &>h1 { font-size: 24px; color: #222; } .el-form-item{ margin-bottom:20px!important; } .breadcrumb{ padding:20px; } } .title_top { .add_btn { width: 90px; height: 32px; background: $mainColor; border: 1px solid rgba(237, 237, 237, 1); border-radius: 4px; float: right; text-align: center; line-height: 32px; color: #FFF; } } .table { background: #fff; // border: 1px solid #EDEDED; // min-height: calc(100vh - 430px); // height:calc(100vh - 350px); } .edit_btn { color: #25486A; } .info_btn { background: #ECF0F5; color: #1F2328; border-color: #ECF0F5; } // 分页 .el-pagination { // position: absolute; // left: 0; // bottom: 15px; text-align: right; width: 100%; margin-top: 20px; } } .el-dialog { .el-select { display: block; } } .main_btn { background: $mainColor; border-color: $mainColor; width: 120px; font-size: 14px; } .cancel_btn { width: 170px; font-size: 14px; color: #6A737B; } // 表头 thead { tr th { background-color: #F2F2F2 !important; padding: 8px 0 !important; } } tbody { tr td { padding: 4px 0 !important; } } .edit { color: rgb(0, 128, 0); } .del { color: #F01010; } .logout:hover { cursor: pointer; } .upload_btn { position: relative; input { position: absolute; width: 100%; left: 0; opacity: 0; } } // 内容区域滚动 .el-form.over_y { max-height: calc( 100vh - 290px); padding: 0 10px; overflow-y: auto; &::-webkit-scrollbar { /*滚动条整体样式*/ width: 4px; /*高宽分别对应横竖滚动条的尺寸*/ height: 4px; } &::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 5px; -webkit-box-shadow: inset005pxrgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2); } &::-webkit-scrollbar-track { /*滚动条里面轨道*/ -webkit-box-shadow: inset005pxrgba(0, 0, 0, 0.2); border-radius: 0; background: rgba(0, 0, 0, 0.1); } } // 弹框 .el-dialog__footer { text-align: center; } .w-e-text { min-height: 500px !important; } // 停用启用样式 .open { color: #409eff; } .close { color: red; } .el-table__fixed-right::before, .el-table__fixed::before { background: none; } .filter-form { .el-input, .el-select { width: 100%; } } .clear{ clear: both; height: 0px; } .el-button--primary{ background-color: #FA0A2F !important; border-color: #FA0A2F !important; &:hover{ background-color: #FA0A2F; border-color: #FA0A2F; } } .el-button--primary.is-plain { color: #FA0A2F !important; background: #fff !important; border-color: #FA0A2F !important; &:hover{ color: #FA0A2F; background-color: #fff; border-color: #FA0A2F; } }