【bug修复】RTMP推流视频直播点播平台EasyDSS浏览器访问界面出现黑底问题修复

大家知道TSINGSEE青犀视频全线产品都是可以直接网页访问的，并且视频直播也是可网页插件直播。正常情况下，研发人员在编译代码时会设置界面的自动适配，在偶尔情况下，界面适配会出现冲突。

前些天我们就发现在调整浏览器时，EasyDSS在浏览器视图高度过小，以致出现底部黑色空间。

为了排查该问题，我们先从浏览器开始入手。打开浏览器控制台发现内容部分会随着浏览器高度变化，但是左侧隐藏按钮没有随着浏览器高度变化，导致左侧高度撑开，右侧下出现空间。

并且在检查时，我们发现内容最小高度给的也过小，导致适配出现问题。

解决方案：找到项目下assets/style/element-custom.scss 文件把最小高度调整到min-height:300px;（如下图）当高度过小就会出现滚动条，避免出现样式错乱。

.my-content-main {
    position: relative;
    .my-content-scrollbar {
        min-height: 300px;
        height: calc(100vh   - 400px); 
        overflow: auto;
    }
    .my-content-scrollbar_flex {
        height: calc(100vh   - 311px); 
        min-height: 300px;
        overflow: auto;
        padding: 0 10px;
    }
    padding: 10px;
    background-color: #FFFFFF;
    .video-icons {
        .video {
            padding: 0 10px;
        }
    }
    .video-list {
        padding: 0 10px;
    }
    
}

预览：

在研发此类平台的时候，我们经常会碰到类似的适配问题，大多数解决方法我们都通过博文的方式记录下来了，因此如果大家对浏览器的适配有疑问，可以翻阅一下我们以前的博客，同时也欢迎大家来向我们咨询了解视频相关的解决方案。