Newer
Older
CloudBrainNew / src / assets / css / base.scss
wangxitong on 29 Apr 2021 5 KB 0429 submit
@import './variable.scss';
/* css复位样式 */
a {color: #424342;font-size: .1rem;}
body,h1,h2,h3,h4,h5,h6,div,p,dl,dt,dd,ol,ul,li,form,table,th,td,a,img,span,strong,var,em,input,textarea,select,option{margin: 0; padding: 0;}
ul,ol{list-style: none;}
img{border: 0;}
input,select,textarea{outline:0;}
textarea{resize:none;}
table{border-collapse: collapse; border-spacing: 0;}
th,strong,var,em{font-weight: normal; font-style: normal;}
em,i,u{ font-style: normal;}
body {
  font-size: .1rem;
  background-color: #FFFFFF;
  color: #424342;
  font-weight: normal;
  font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
}
html,body{
  width: 100%;
  height: 100%;
}
*, ::before, ::after {
  padding: 0;
  margin: 0;
  /*去掉chorm浏览器中默认点击的颜色*/
  -webkit-tap-highlight-color: transparent;
  -webkit-box-sizing: border-box;
}
.clearfix::before, .clearfix::after {
  content: '.';
  height: 0;
  line-height: 0;
  clear: both;
  display: block;
  visibility: hidden;
}

/* 公共class */
.flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  position: relative;
}
.flex-box {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  flex: 1;
}
.page-paddingBottom{
  padding-bottom: 50px;
}
.page-paddingTop{
  padding-top: 1.5rem !important;
}
.load-all{  /* 列表数据加载完成 */
  text-align: center;padding:20px 0 20px;color:#999;
}


/* 表单公共样式 */
input::-webkit-input-placeholder {color: #999;}
input:-moz-placeholder {color: #999; }
input::-moz-placeholder {color: #999;}
input:-ms-input-placeholder {color: #999;; }

/* 媒体查询 */
.panel-main{
  width: 100%;height: 100%; position:absolute;min-width: 1400px;
}
/* @media (min-width:32800px){
  .panel-main{ width: 150%;}
}
@media screen and (max-width: 5000px) {
  .panel-main{ width: 230%;}
}
@media (max-width:1920px) {
  .panel-main{ width: 250%;}
}
@media (max-width: 1400px) {
  .panel-main{ width: 250%;}
}
@media (max-width: 1080px) {
  .panel-main{ width: 350%;}
}
@media (max-width:800px) {
  .panel-main{ width: 500%;}
} */
.chart-container{
  width:35% !important;
}


/* 大模块公共样式 */
/*模块背景框*/
.Modular {
  width: 98%;
  height: 97%;
  background: url("../../assets/images/left_1_bg.png") no-repeat;
  background-size: 100% 100%;
  margin: 0 2%;
  overflow: hidden;
  position: relative;
}
.Modular_main{
  width: 100%;overflow: auto;position:absolute; top: .2rem; bottom: 0;
}
.Modular_main>div{
  width: 100%;
  height: auto;
}
.Modular_left{
  margin-left: .1rem;
}
.Modular_right{
  margin-right: .1rem;
}
/* 小模块背景 */
.module-corner {
  background: url("../images/moduleBg01.png") no-repeat left top;
  background-size: 100% 100%;
  position: relative;
}

/* 盒子 */
.row{
  width: 100%;
  overflow: hidden;
  margin: 0.07rem 0;
}
.row-full{
  width: 100%;
  overflow: hidden;
  margin: 0;
}
.row-flex{
  display:flex;
  justify-content:space-between;
}
.col-70{
  width: 70%;
  float: left;
}
.col-65{
  width: 65%;
  float: left;
}
.col-60{
  width: 60%;
  float: left;
}
.col-55{
  width: 55%;
  float: left;
}
.col-50{
  width: 50%;
  float: left;
}
.col-45{
  width: 45%;
  float: left;
}
.col-40{
  width: 40%;
  float: left;
}
.col-35{
  width: 35%;
  float: left;
}
.col-30{
  width: 30%;
  float: left;
}
.col-25{
  width: 25%;
  float: left;
}

.modular{
  width:100%;
  height:100%;
  position:relative;
  .modular-row-100{
    height:100%;
    width:100%;
    display: flex;
    justify-content: space-between;
  }
  .modular-row-25{
    height:25%;
    width:100%;
    display: flex;
    justify-content: space-between;
  }
  .modular-row-75{
    height:75%;
    width:100%;
    display: flex;
    justify-content: space-between;
  }
  .modular-row-30{
    height:33%;
    width:100%;
    display: flex;
    justify-content: space-between;
  }
  .modular-row-40{
    height:40%;
    width:100%;
    display: flex;
    justify-content: space-between;
  }
  .modular-row-60{
    height:66%;
    width:100%;
    display: flex;
    justify-content: space-between;
  }
  .modular-row-50{
    height:50%;
    width:100%;
    display: flex;
    justify-content: space-between;
  }
  .modular-col-50{
    width:50%;
    height:100%;
  }
  .modular-col-30{
    width:33%;
    height:100%;
  }
  .modular-col-60{
    width:66%;
    height:100%;
  }
  .modular-col-100{
    width:100%;
    height:100%;
  }
  .modular-col-40{
    width:40%;
    height:100%;
  }
  .modular-col-20{
    width:20%;
    height:100%;
  }
  .modular-col-80{
    width:80%;
    height:100%;
  }
  .modular-col-25{
    width:25%;
    height:100%;
  }
  .modular-padding-right{
    padding-right:0.05rem;
  }
  .modular-padding-left{
    padding-left:0.05rem;
  }
  .modular-padding-aside{
    padding-right:0.05rem;
    padding-left:0.05rem;
  }
}

::-webkit-scrollbar-thumb{
  background-color: rgba(255, 255, 255,0) !important;
}
::-webkit-scrollbar{
  background-color: rgba(255, 255, 255,0) !important;
}

.gradient-text {
  background: $gradientText;
  -webkit-background-clip: text;
  color: transparent;
}

// 滚动条强制在最上方
.__rail-is-horizontal{
  z-index:21 !important;
}

//排序轮播表字体样式
.dv-scroll-ranking-board .ranking-info{
  font-size:0.08rem !important;
}

.dv-scroll-ranking-board .ranking-info .rank{
  width: 0.24rem !important;
}
.dv-scroll-ranking-board .ranking-column .inside-column{
  height: 12px !important;
}


// element 替换
.el-radio-button__orig-radio:checked+.el-radio-button__inner{
  color:#ffffff;
}