* {
|
scrollbar-color: #2cb7fc rgba(51, 238, 255, 0.2);
|
scrollbar-width: thin;
|
}
|
|
|
.home_wrap2 {
|
width: 100%;
|
height: 100%;
|
background-color: #0c1333;
|
background-image: url("../img/databoard/bg_home2.png");
|
background-size: 100% 100%;
|
overflow: hidden;
|
}
|
|
|
|
.container {
|
width: 100%;
|
height: calc(100% - 3.5vw);
|
padding: 1vw 1.56vw;
|
box-sizing: border-box;
|
}
|
|
|
.nav-bar_wrap {
|
|
height: 3.5vw;
|
background-image: url(../img/databoard/bg_navbar2.png);
|
|
}
|
|
.panel-title {
|
position: absolute;
|
left: -0.3vw;
|
top: 0px;
|
display: inline-block;
|
width: 10.21vw;
|
height: 2.2vw;
|
line-height: 1.8vw;
|
font-size: 0.9vw;
|
color: #ffffff;
|
font-weight: bold;
|
padding-left: 1.4vw;
|
box-sizing: border-box;
|
background-image: url("../img/databoard/bg_panel_title.png");
|
background-size: 100% 100%;
|
}
|
|
|
.left-container {
|
display: inline-block;
|
vertical-align: top;
|
width: 29.38vw;
|
height: 100%;
|
}
|
|
.left-container .base-info-panel {
|
position: relative;
|
width: 100%;
|
height: 13.5vw;
|
background-image: url("../img/databoard/bg_panel_1_2.png");
|
background-size: 100% 100%;
|
margin-bottom: 1vw;
|
padding: 2.5vw 1.3vw 2.29vw;
|
box-sizing: border-box;
|
}
|
|
.left-container .base-info-panel .panel-content {
|
width: 100%;
|
height: 100%;
|
}
|
|
.panel-box1-item{
|
width: 100%;
|
height: 2.1vw;
|
line-height: 2.1vw;
|
font-size: 0.9vw;
|
color: #fff;
|
margin-bottom: 0.5vw;
|
background: url("../img/databoard/bg_panel_1_item.png") no-repeat;
|
}
|
|
|
.panel-box1-title{
|
background: url("../img/databoard/bg_panel_1_title.png") no-repeat;
|
padding: 0 15px;
|
font-weight: bold;
|
}
|
|
.panel-box1-title a{
|
color: #fff;
|
}
|
|
.panel-box1-title a span{
|
margin-left: 15px;
|
font-family: '宋体';
|
position: relative;
|
top: 2px;
|
}
|
|
|
.panel-box1-item p{
|
height: 2.1vw;
|
overflow: hidden;
|
}
|
|
.panel-box1-item p i{
|
display: block;
|
float: left;
|
width: 2.1vw;
|
height: 2.1vw;
|
}
|
|
.panel-box1-item p i img{
|
width: 100%;
|
height: 100%;
|
}
|
|
|
.left-container .base-info-panel .panel-content >div {
|
display: inline-block;
|
vertical-align: top;
|
}
|
|
.left-container .base-info-panel .panel-content .inventory {
|
width: 7.45vw;
|
height: 100%;
|
background-image: url("../img/databoard/bg_item_green.png");
|
background-size: 100% 100%;
|
padding: 0.5vw 2.7vw 0 0;
|
box-sizing: border-box;
|
}
|
|
.left-container .base-info-panel .panel-content .entrepot {
|
width: 7.45vw;
|
height: 100%;
|
background-image: url("../img/databoard/bg_item_blue.png");
|
background-size: 100% 100%;
|
position: relative;
|
left: -0.8vw;
|
padding: 0.5vw 1.25vw 0 0;
|
box-sizing: border-box;
|
}
|
|
.left-container .base-info-panel .panel-content .real-time {
|
width: calc(100% - 7.45vw - 7.45vw);
|
height: 100%;
|
}
|
|
.left-container .base-info-panel .panel-content .panel-content-text {
|
text-align: right;
|
font-size: 0.73vw;
|
line-height: 1.5vw;
|
color: #ffffff;
|
}
|
|
.left-container .base-info-panel .panel-content .panel-content-count {
|
text-align: right;
|
font-size: 2vw;
|
line-height: 2.5vw;
|
color: #2fc7ff;
|
}
|
|
|
.left-container .base-info-panel .panel-content .real-time .panel-content-text {
|
font-size: 0.9vw;
|
line-height: 2vw;
|
}
|
|
|
.left-container .base-info-panel .panel-content .real-time .panel-content-count {
|
text-align: right;
|
font-size: 2vw;
|
line-height: 2.5vw;
|
color: #2fc7ff;
|
}
|
|
|
|
.left-container .inventory-info-panel {
|
position: relative;
|
width: 100%;
|
height: 17vw;
|
background-image: url("../img/databoard/bg_panel_2.png");
|
background-size: 100% 100%;
|
margin-bottom: 1vw;
|
padding: 2.45vw 1.88vw 2vw;
|
box-sizing: border-box;
|
}
|
|
.left-container .inventory-info-panel .panel-content {
|
width: 100%;
|
height: 100%;
|
}
|
|
.left-container .inventory-info-panel .panel-content .panel-content-head {
|
width: 100%;
|
height: 1.61vw;
|
line-height: 1.61vw;
|
background-image: url("../img/databoard/bg_table_head2.png");
|
background-size: 100% 100%;
|
display: flex;
|
font-size: 0.73vw;
|
color: #91ceff;
|
padding-left: 1vw;
|
padding-right: 6px;
|
box-sizing: border-box;
|
}
|
|
.left-container .inventory-info-panel .panel-content .panel-content-head .head-item {
|
flex: 1;
|
}
|
|
.left-container .inventory-info-panel .panel-content .panel-content-body {
|
width: 100%;
|
height: calc(100% - 1.6vw);
|
padding-left: 1vw;
|
box-sizing: border-box;
|
overflow: hidden;
|
overflow-y: auto;
|
}
|
|
.left-container .inventory-info-panel .panel-content .panel-content-body::-webkit-scrollbar {
|
width: 6px;
|
background-color:rgba(51,238,255,0.2);
|
}
|
|
.left-container .inventory-info-panel .panel-content .panel-content-body::-webkit-scrollbar-thumb {
|
-webkit-box-shadow: inset 0 0 6px rgba(2,160,251,0.3);
|
background-color: rgba(2, 158, 249, 0.5);
|
border-radius: 3px;
|
}
|
|
.left-container .inventory-info-panel .panel-content .panel-content-body .panel-content-body-tr {
|
width: 100%;
|
height: 1.8vw;
|
line-height: 1.8vw;
|
display: flex;
|
}
|
|
.left-container .inventory-info-panel .panel-content .panel-content-body .panel-content-body-tr .body-item {
|
flex: 1;
|
font-size: 0.7vw;
|
color: #ffffff;
|
}
|
|
|
|
|
.left-container .all-inventory-panel {
|
position: relative;
|
width: 100%;
|
height: calc(100% - 17vw - 13.5vw - 2vw);
|
background-image: url("../img/databoard/bg_panel_3.png");
|
background-size: 100% 100%;
|
margin-bottom: 1vw;
|
}
|
|
.left-container .all-inventory-panel .panel-content {
|
width: 100%;
|
height: 100%;
|
padding: 3.1vw 2vw 1.5vw;
|
box-sizing: border-box;
|
}
|
|
.left-container .all-inventory-panel .panel-content .chart-box {
|
display: inline-block;
|
vertical-align: top;
|
width: calc(100% - 5.26vw);
|
height: 100%;
|
}
|
|
.left-container .all-inventory-panel .panel-content .details-box {
|
display: inline-block;
|
vertical-align: top;
|
width: 5.26vw;
|
height: 100%;
|
position: relative;
|
}
|
|
.left-container .all-inventory-panel .panel-content .details-box .details-panel {
|
position: absolute;
|
left: 0;
|
top: 2.5vw;
|
right: 0;
|
bottom: 0;
|
margin: auto;
|
width: 5.26vw;
|
height: 6.56vw;
|
background-color: rgba(10, 67, 188, 0.21);
|
}
|
|
.left-container .all-inventory-panel .panel-content .details-box .details-panel .details-panel-title {
|
font-size: 0.73vw;
|
line-height: 1.5vw;
|
color: #39c9ff;
|
padding-left: 0.5vw;
|
}
|
|
.left-container .all-inventory-panel .panel-content .details-box .details-panel .details-panel-text {
|
font-size: 0.83vw;
|
line-height: 2vw;
|
color: #ffffff;
|
text-align: center;
|
padding-top: 0.6vw;
|
}
|
|
.left-container .all-inventory-panel .panel-content .details-box .details-panel .details-panel-num {
|
font-size: 1.15vw;
|
color: #39c9ff;
|
text-align: center;
|
line-height: 1.3vw;
|
font-weight: 600;
|
}
|
|
.left-container .all-inventory-panel .panel-content .details-box .details-unit {
|
font-size: 0.83vw;
|
color: #ffffff;
|
position: absolute;
|
top: 0;
|
right: 0;
|
}
|
|
|
|
.right-container {
|
display: inline-block;
|
vertical-align: top;
|
width: calc(100% - 29.38vw - 1vw);
|
height: 100%;
|
margin-left: 1vw;
|
float: right;
|
}
|
|
|
.right-top{
|
width: 100%;
|
height: 31.5vw;
|
background: url(../img/databoard/right-top-bg.png) no-repeat;
|
margin-bottom: 1vw;
|
background-size: 100% 100%;
|
position: relative;
|
}
|
|
|
.right-top .panel-content{
|
position: relative;
|
width: 100%;
|
height: 100%;
|
display: flex;
|
}
|
|
.right-videoWrap{
|
padding: 2.6vw 1vw 1vw 1.5vw;
|
overflow: hidden;
|
flex: 1;
|
|
}
|
.right-video{
|
width: 100%;
|
}
|
.right-video li{
|
width: 49%;
|
height: 13.5vw;
|
margin: 1vw 2% 0 0;
|
float: left;
|
position: relative;
|
}
|
.right-video li:first-child,
|
.right-video li:nth-child(2){
|
margin-top: 0;
|
}
|
|
.right-video li:nth-child(2n){
|
margin-right: 0;
|
}
|
|
.right-video li h4{
|
position: absolute;
|
height: 1.5vw;
|
line-height: 1.5vw;
|
width:8.5vw;
|
display: block;
|
background: url(../img/databoard/bg-jiankong-tit.png) no-repeat;
|
background-size:100% 100% ;
|
text-indent: 1vw;
|
color: #fff;
|
font-size: 0.8vw;
|
}
|
.video-box,
|
.video-pic{
|
width: 100%;
|
height: 100%;
|
}
|
|
|
.right-topGroup{
|
width: 12.5vw;
|
height: 100%;
|
box-sizing: border-box;
|
padding: 0.5vw 2vw;
|
}
|
|
.right-topItem{
|
width: 100%;
|
height: 5.3vw;
|
background: url(../img/databoard/bg-right-topItem.png) no-repeat;
|
background-size: 100% 100%;
|
margin-top: 3.8vw;
|
}
|
|
.right-topItem h4{
|
height: 1.8vw;
|
color: #fff;
|
line-height: 1.8vw;
|
overflow: hidden;
|
}
|
|
|
.right-topItem h4 i{
|
float: left;
|
width: 1.8vw;
|
height: 1.8vm;
|
display: block;
|
margin-right: 5px;
|
}
|
|
.right-topItem h4 i img{
|
width: 100%;
|
height: 100%;
|
}
|
|
|
.right-topItem p{
|
text-align: center;
|
color: #02a5f4;
|
font-size: 1.6vw;
|
font-weight: bold;
|
line-height: 3.5vw;
|
height: 3.5vw;
|
overflow: hidden;
|
margin: 0;
|
padding: 0;
|
}
|
|
|
.right-bottom {
|
position: relative;
|
width: 100%;
|
height: calc(100% - 31.5vw - 1vw);
|
background: url("../img/databoard/right-bottom-bg.png") no-repeat;
|
background-size: 100% 100%;
|
box-sizing: border-box;
|
padding: 2.6vw 1.88vw 1.5vw;
|
}
|
|
.right-bottom .panel-content {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
|
}
|
|
|
|
.right-bottom .panel-content-head {
|
width: 100%;
|
height: 1.61vw;
|
line-height: 1.61vw;
|
background-image: url("../img/databoard/bg_table_head3.png");
|
background-size: 100% 100%;
|
display: flex;
|
font-size: 0.73vw;
|
color: #91ceff;
|
padding-left: 1vw;
|
padding-right: 6px;
|
box-sizing: border-box;
|
}
|
|
.right-bottom .panel-content-head .head-item {
|
flex: 1;
|
}
|
|
.right-bottom .panel-content-body {
|
width: 100%;
|
height: calc(100% - 1.6vw);
|
padding-left: 1vw;
|
box-sizing: border-box;
|
overflow: hidden;
|
overflow-y: auto;
|
}
|
|
.right-bottom .panel-content-body::-webkit-scrollbar {
|
width: 6px;
|
background-color:rgba(51,238,255,0.2);
|
}
|
|
.right-bottom .panel-content-body::-webkit-scrollbar-thumb {
|
-webkit-box-shadow: inset 0 0 6px rgba(2,160,251,0.3);
|
background-color: rgba(2, 158, 249, 0.5);
|
border-radius: 3px;
|
}
|
|
.right-bottom .panel-content-body .panel-content-body-tr {
|
width: 100%;
|
height: 1.8vw;
|
line-height: 1.8vw;
|
display: flex;
|
}
|
|
.right-bottom .panel-content-body .panel-content-body-tr .body-item {
|
flex: 1;
|
font-size: 0.7vw;
|
color: #ffffff;
|
}
|
