仪表盘风格样式定义

目前bi系统支持12种仪表盘风格,用户可以定制自己的仪表盘风格,仪表盘风格配置位置如下图:

自定义仪表盘风格:

  1. 在仪表盘里增加新的风格代码,代码在PageProp.vue:
  2. 在前端项目中添加新的样式文件,文件路径:src/style/ 目录下,文件内容如下:
/**
风格1 bigscreen3
**/
.bg-bigscreen3 {
    background-color: #111111;
}
.hd-bigscreen3 {
    margin: 0 auto;
    height: 48px;
    max-width: 1920px;
    position: relative;
}
.hd-bigscreen3 h3 {
    margin:0;
    padding:0;
    line-height:42px;
    text-align:center;
    font-size:24px;
    color:#fffeff;
    background: url(../assets/bigscreen/header-3.png)  center center / 100% 100% no-repeat;
}
.ybpheader-r-bigscreen3 {
    position: absolute;
    top: 15px;
    right: 10px;
    color: #fffeff;
}
.comp-bigscreen3 {
    background: url(../assets/bigscreen/panel-l-t.png) center no-repeat;
    background-size: 100% 100%;
    border-radius: 6px;
}
.title-bigscreen3 {
    color: #d5dae8;
    font-size: 13px;
    padding: 5px 8px 3px 8px;
}
.ctx-bigscreen3 {
    padding:5px;
}

@media (max-width: 512px) {
    .hd-bigscreen3 {

    }
    .hd-bigscreen3 .ybpheader-r-bigscreen3 {
        display: none;
    }
    .mobile-bigscreen3 {
        position: fixed;
        background-color: #111111;
    }
    .mobile-bigscreen3-haspms {
        height: 64px;
    }
    .mobile-bigscreen3-haspms .gp-bigscreen3 {
        top:35px;
    }
    .mobile-bigscreen3-nopms {
        height: 44px;
    }

}

results matching ""

    No results matching ""