CNCEC_SUBQHSE_WUHUAN/SGGL/FineUIPro.Web/res/css/indextower.css

.y_wrap{
    height: 100%;
    width: 100%;
    display: grid;
    padding: 0.1875rem;
    grid-template-columns: 1.2fr 2fr;
    gap: 0.1875rem;
    background-color: #f5f3f3;
}
.y_l_site{
    height: 100%;
    display: grid;
    grid-template-rows: 1.3fr 2fr 1.2fr;
    gap: 0.1875rem;
}

.y_r_site{
        height: 100%;
    display: grid;
    grid-template-rows: 2fr 1fr 2fr;
    gap: 0.1875rem;
}
.y_r_site_sub{
        display: grid;
    grid-template-columns: 1.2fr 2fr;
    gap: 0.1875rem;
}
.y_r_site_sub1{
            display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.1875rem;
}
.y_r_site_sub1>div,
.y_r_site_sub>div,
.y_r_site>div:nth-child(2),
.y_l_site>div{ 
    background-color: #ffffff;
}

.y_box{
    position: relative;
}
.y_box>.tit{ 
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding: 0 0.25rem;
    height: 0.5rem;
}
.y_box>.tit>p{
    line-height: 1;
    font-size: 0.2rem;
    margin-left: 0.1875rem;
}

.y_c_icon{
    height: 0.2rem;
    width: 0.2rem;
    border:0.0375rem solid #5b97f9;
    border-radius: 50%;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.y_c_icon>span{
    height: 0.125rem;
    width: 0.125rem;
    border-radius: 50%;
     border:0.0375rem solid #5b97f9;
}

.y_box_main{
    width: 100%;
    height: calc(100% - 0.5rem);
}

/* 设备报警 */
#sbbj{
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    justify-items: center;
}

#sbbj>div{
    min-width: 1.8rem;
    max-width: 90%;
    height: 0.725rem;
    padding-left: 1rem;
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 0.875rem  0.725rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
#sbbj>div:nth-child(1){
        background-image: url("../images/tower/twoerpolic.bb339ff.png");
}
    #sbbj > div:nth-child(2) {
        background-image: url("../images/tower/twoerpolice2.261a289.png");
    }
#sbbj>div>div:nth-child(1){
    font-size: 0.2rem;
}
#sbbj>div>div:nth-child(2){
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
#sbbj>div>div:nth-child(2)>span{
    font-size: 0.2rem;
}

/* 设备信息 */
#sbxx{
    padding: 0.1875rem;
}
#sbxx>.y_row{
    padding: 0.125rem 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 1px solid #ddd;
}
#sbxx>.y_row>.y_span{
    flex: 1;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
#sbxx>.y_row>.y_span>div{
    width: 50%;
}
#sbxx>.y_row>.y_span>.y_span_lab{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
#sbxx>.y_row>.y_span>.y_span_val{
    text-align: right;
    padding: 0 0.125rem;
}
#sbxx>.y_row>.y_span>.y_span_lab>span:nth-child(1){
    display: inline-block;
    height: 0.2rem;
    width: 0.075rem;
    border-radius: 0.0375rem; 
    background-color: #5b97f9;
}
#sbxx>.y_row>.y_span>.y_span_lab>span:nth-child(2){
    font-size: 0.2rem;
    margin-left: 0.125rem;
}


/* 吊重\风速... */
#zt{
    padding: 0.125rem;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-row: 1fr 1fr;
    grid-row-gap: 0.1875rem;
    grid-column-gap: 0.125rem;
}
#zt>div{
    border: 1px solid #d3e3fe;
    background-color: #eff5ff;
    border-radius: 0.1rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0 0.1875rem;
    align-items: center;
}
    #zt > div > span:nth-child(1) {
        height: 0.475rem;
        width: 0.475rem;
        background-image: url("../images/tower/work1.e93d23f.png");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 0.475rem 0.475rem;
    }
    #zt > div:nth-child(2) > span:nth-child(1) {
        background-image: url("../images/tower/2.png");
    }
    #zt > div:nth-child(3) > span:nth-child(1) {
        background-image: url("../images/tower/3.png");
    }
    #zt > div:nth-child(4) > span:nth-child(1) {
        background-image: url("../images/tower/4.png");
    }
    #zt > div:nth-child(5) > span:nth-child(1) {
        background-image: url("../images/tower/5.png");
    }
    #zt > div:nth-child(6) > span:nth-child(1) {
        background-image: url("../images/tower/6.png");
    }
#zt>div>span:nth-child(2){
    width: 40%;
    color: #649bf8;
    font-size: .2rem;
    font-weight: 700;
    text-align: center;
}
#zt>div>span:nth-child(3){
        color: #404040;
    font-size: 0.2rem;
}

/* 塔吊状态 */
#tdzt{
    padding: 0.1875rem;
}
    #tdzt > div {
        width: 100%;
        height: calc(100% - 0.5rem);
        background-image: url(../images/tower/tjimg.97b7389.png);
        background-position: center;
        background-repeat: no-repeat;
    }

#tdzt>p{
    height: 0.5rem;
    line-height: .5rem;
    font-size: 0.225rem;
    text-align: center;
}
/* 视频 */
#sp{
     position: relative; /* 设置相对定位 */
    width: 100%;       /* 宽度占满父容器 */
    height: 100%;  
}
    #sp live-player {
        position: absolute; /* 绝对定位 */
        top: 0;
        left: 0;
        width: 100%; /* 宽度100% */
        height: 100%; /* 高度100% */
        background-color: #000000;
        object-fit: cover; /* 保持原始比例并覆盖整个区域 */
    }




.c_5b97f9{
    color: #5b97f9;
    font-weight: 700;
    font-size: 0.25rem !important;
}
.c_ff5353{
    color: #ff5353;
        font-weight: 700;
    font-size: 0.25rem !important;
}