You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
423 lines
6.4 KiB
423 lines
6.4 KiB
//main-container全局样式
|
|
|
|
.page-full-height{
|
|
height: calc(100vh);
|
|
}
|
|
|
|
.page-height-95{
|
|
height: calc(95vh);
|
|
}
|
|
.page-height-85{
|
|
height: calc(85vh);
|
|
}
|
|
|
|
.page-height-75{
|
|
height: calc(75vh);
|
|
}
|
|
.page-height-65{
|
|
height: calc(65vh);
|
|
}
|
|
|
|
.page-height-55{
|
|
height: calc(55vh);
|
|
}
|
|
.page-height-45{
|
|
height: calc(45vh);
|
|
}
|
|
|
|
.page-height-35{
|
|
height: calc(35vh);
|
|
}
|
|
.page-height-25{
|
|
height: calc(25vh);
|
|
}
|
|
.page-height-15{
|
|
|
|
height: calc(15vh);
|
|
|
|
}
|
|
.page-height-90{
|
|
height: calc(90vh);
|
|
}
|
|
.page-height-80{
|
|
height: calc(80vh);
|
|
}
|
|
|
|
.page-height-70{
|
|
height: calc(70vh);
|
|
}
|
|
.page-height-60{
|
|
height: calc(60vh);
|
|
}
|
|
|
|
.page-height-50{
|
|
height: calc(50vh);
|
|
}
|
|
.page-height-40{
|
|
height: calc(40vh);
|
|
}
|
|
|
|
.page-height-30{
|
|
height: calc(30vh);
|
|
}
|
|
.page-height-20{
|
|
height: calc(20vh);
|
|
}
|
|
.page-height-10{
|
|
|
|
height: calc(10vh);
|
|
|
|
}
|
|
.page-height-5{
|
|
|
|
height: calc(5vh);
|
|
|
|
}
|
|
.page-container {
|
|
overflow: auto;
|
|
.page-tips{
|
|
position:absolute;
|
|
font-size: 16px;
|
|
bottom: 0px;
|
|
color: red;
|
|
padding-left: 10px;
|
|
flex: 0 0 auto;
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
overflow-x: hidden;
|
|
}
|
|
.page-header{
|
|
overflow: auto;
|
|
}
|
|
.page-main{
|
|
overflow: auto;
|
|
}
|
|
.page-bottom{
|
|
overflow: auto;
|
|
}
|
|
}
|
|
.overflow-auto{
|
|
overflow: auto;
|
|
}
|
|
.overflow-x-auto{
|
|
overflow-x: auto;
|
|
}
|
|
.overflow-y-auto{
|
|
overflow-y: auto;
|
|
}
|
|
.overflow-hidden{
|
|
overflow: hidden;
|
|
}
|
|
.border{
|
|
border: 1px solid #e8e8e8;
|
|
}
|
|
.padding-20{
|
|
padding:40px;
|
|
}
|
|
.padding{
|
|
padding:10px;
|
|
}
|
|
.padding-top{
|
|
padding-top: 10px;
|
|
}
|
|
.padding-bottom{
|
|
padding-bottom: 10px;
|
|
}
|
|
.padding-left{
|
|
padding-left: 10px;
|
|
}
|
|
.border-top{
|
|
border-top: 1px solid #e8e8e8;
|
|
}
|
|
.border-bottom{
|
|
border-bottom: 1px solid #e8e8e8;
|
|
}
|
|
.padding-right{
|
|
padding-right: 10px;
|
|
}
|
|
.input-width{
|
|
width:270px;
|
|
}
|
|
|
|
/**
|
|
更多按钮
|
|
**/
|
|
.more-filter {
|
|
margin: 20px 0px;
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
font{
|
|
text-align: center;
|
|
float: left;
|
|
height: 28px;
|
|
line-height: 28px;
|
|
margin-right: 10px;
|
|
margin-top: 2px;
|
|
}
|
|
.el-row {
|
|
padding-top: 10px;
|
|
}
|
|
}
|
|
/**
|
|
修改弹出框关闭按钮，放大，原来的太小
|
|
**/
|
|
.el-dialog__headerbtn {
|
|
top: 8px !important;
|
|
background-size: cover;
|
|
}
|
|
.el-dialog__headerbtn i {
|
|
font-size: 32px;
|
|
}
|
|
|
|
|
|
.more-label-font {
|
|
|
|
height: 32px;
|
|
line-height: 32px;
|
|
text-align: left;
|
|
float: left;
|
|
min-width: 100px;
|
|
}
|
|
|
|
.tips{
|
|
position:absolute;
|
|
font-size: 14px;
|
|
bottom: -10px;
|
|
color: red;
|
|
padding-left: 10px;
|
|
flex: 0 0 auto;
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: flex-start;
|
|
align-items: bottom;
|
|
overflow-x: hidden;
|
|
}
|
|
.center{
|
|
text-align: center;
|
|
align-items: center;
|
|
}
|
|
.page-center{
|
|
margin:0 auto;
|
|
max-width: 95vw;
|
|
}
|
|
//富文本必须放在全局，否则不起作用
|
|
.rich-context{
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
overflow: hidden;
|
|
}
|
|
.rich-context img{
|
|
max-width: 100%;
|
|
object-fit: scale-down;
|
|
}
|
|
|
|
.el-table .current-row > td {
|
|
background: #a9d6f0 !important;
|
|
}
|
|
|
|
/**
|
|
模拟鼠标经过描点样式
|
|
*/
|
|
.vlink:hover{
|
|
text-decoration:none;
|
|
color: blue;
|
|
cursor: pointer;
|
|
}
|
|
|
|
/*1.显示滚动条：当内容超出容器的时候，可以拖动：*/
|
|
.el-drawer__body {
|
|
overflow: auto;
|
|
/* overflow-x: auto; */
|
|
}
|
|
|
|
.tool-bar{
|
|
visibility: hidden;
|
|
float: right;
|
|
}
|
|
|
|
table tr:hover{
|
|
.tool-bar{
|
|
visibility: visible;
|
|
.u-btn{
|
|
float: right;
|
|
}
|
|
}
|
|
}
|
|
table tr.hover-row{
|
|
.tool-bar{
|
|
visibility: visible;
|
|
.u-btn{
|
|
float: right;
|
|
}
|
|
}
|
|
}
|
|
.cell-bar{
|
|
display: none;
|
|
float: right;
|
|
}
|
|
|
|
.el-table__row td:hover{
|
|
cursor: pointer;
|
|
.cell-bar{
|
|
display: inline;
|
|
.u-btn{
|
|
float: right;
|
|
}
|
|
}
|
|
.cell-text{
|
|
display:none;
|
|
}
|
|
}
|
|
/**
|
|
*解决表格固定列无法滚动问题
|
|
*/
|
|
.el-table {
|
|
.el-table__fixed {
|
|
height:auto !important;
|
|
bottom:17px !important;
|
|
}
|
|
}
|
|
|
|
.icon {
|
|
color: #fff;
|
|
height: 20px;
|
|
width: 20px;
|
|
border-radius: 15px;
|
|
text-align: center;
|
|
line-height: 20px;
|
|
font-size: 14px;
|
|
display: inline-block;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
/**
|
|
*解决项目、产品视图顶部左边图标不居中的问题
|
|
*/
|
|
.el-menu-item .top-icon > [class^=el-icon-] {
|
|
margin-right: 0px !important;
|
|
}
|
|
|
|
.label-font-color{
|
|
color: #C0C4CC;
|
|
}
|
|
|
|
.title-font-size{
|
|
font-size:28px;
|
|
}
|
|
|
|
.big-icon {
|
|
color: #fff;
|
|
height: 36px;
|
|
width: 36px;
|
|
border-radius: 36px;
|
|
text-align: center;
|
|
line-height: 36px;
|
|
font-size: 18px;
|
|
display: inline-block;
|
|
}
|
|
.icon {
|
|
border-radius: 20px;
|
|
color: #fff;
|
|
display: inline-block;
|
|
font-size: 14px;
|
|
height: 20px;
|
|
line-height: 20px;
|
|
margin-right: 5px;
|
|
text-align: center;
|
|
width: 20px;
|
|
}
|
|
|
|
/*此处根据不同屏幕分配率显示不同的样式*/
|
|
/*手机端*/
|
|
@media only screen and (min-width: 0px) and (max-width: 768px) {
|
|
.page-center{
|
|
margin:0 auto;
|
|
max-width: 95vw;
|
|
}
|
|
}
|
|
/*ipad*/
|
|
@media only screen and (min-width: 768px) and (max-width: 992px) {
|
|
.page-center{
|
|
margin:0 auto;
|
|
max-width: 95vw;
|
|
}
|
|
}
|
|
/*ipadpro*/
|
|
@media only screen and (min-width: 992px) and (max-width: 1200px) {
|
|
.page-center{
|
|
margin:0 auto;
|
|
max-width: 95vw;
|
|
}
|
|
}
|
|
/*笔记本*/
|
|
@media only screen and (min-width: 1200px) and (max-width: 1920px) {
|
|
.page-center{
|
|
margin:0 auto;
|
|
max-width: 90vw;
|
|
}
|
|
}
|
|
/*台式电脑*/
|
|
@media only screen and (min-width: 1920px) {
|
|
.page-center{
|
|
margin:0 auto;
|
|
max-width:80vw;
|
|
}
|
|
}
|
|
.el-dialog {
|
|
max-height: 96%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin: 0 !important;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
.el-dialog .el-dialog__body {
|
|
flex: 1;
|
|
overflow: auto;
|
|
}
|
|
|
|
|
|
:root{
|
|
--footer-height: 50px;
|
|
}
|
|
|
|
.footer{
|
|
text-align: right;
|
|
position: fixed;
|
|
bottom: 0;
|
|
margin-top:10px;
|
|
width: 100%;
|
|
right: 50px;
|
|
line-height: var(--footer-height);
|
|
color: #fff;
|
|
}
|
|
.avatar-container {
|
|
height: 50px;
|
|
display: flex;
|
|
align-items: center;
|
|
.avatar-wrapper {
|
|
cursor: pointer;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
.user-avatar {
|
|
height: 34px;
|
|
width: 34px;
|
|
border-radius: 50%;
|
|
margin-right: 12px;
|
|
}
|
|
.username{
|
|
color: #7D7D7D;
|
|
font-size: 18px;
|
|
margin-right: 2px;
|
|
}
|
|
.el-icon-caret-bottom {
|
|
font-size: 22px;
|
|
}
|
|
}
|
|
}
|