Wider Bilibili

哔哩哔哩宽屏体验

< Feedback on Wider Bilibili

Review: Good - script works

§
Posted: 2024.04.23.

作者真是个天才
这交互舒服太多
能否改进一下进度条,压缩一下高度、提高透明度,减少对内容的遮蔽?

§
Posted: 2024.04.23.

进一步地,能否把进度条加宽,现在这个很细长的进度条需要鼠标精确定位,加粗的话点击就方便许多
即,进度条大区域整体压缩,包括高能条部分,而在压缩的前提下看是否还有加宽进度条的空间

posthumzAuthor
§
Posted: 2024.04.23.
Edited: 2024.04.23.

暂时没有把这些选项做到脚本里面的想法,但是你可以用Stylus插件添加自定义样式达成

里面的有注释的数值你可以自己调整看看

/* ==UserStyle==
@name           Bilibili 自定义样式
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         posthumz
==/UserStyle== */

@-moz-document domain("www.bilibili.com") {
    html {
        /* 导航栏高度 */
        --navbar-height: 50px !important;
    }

    /* 进度条高度 */
    .bpx-player-control-wrap {
        height: 54px !important;
    }

    .bpx-player-control-top {
        bottom: 100% !important;
    }

    .bpx-player-control-bottom {
        margin-top: 10px !important;
    }

    .bpx-player-progress {
        /* 进度条宽度 */
        height: 6px !important;
        transform: translateY(100%);
        top: 1px;
    }

    .bpx-player-pbp>svg {
        /* 高能区透明度 */
        opacity: 50%;
        transform-origin: bottom;
        /* 高能区高度比例 */
        transform: scaleY(75%);
    }
}
§
Posted: 2024.04.23.

暂时没有把这些选项做到脚本里面的想法,但是你可以用Stylus插件添加自定义样式达成

里面的有注释的数值你可以自己调整看看

/* ==UserStyle==
@name           Bilibili 自定义样式
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         posthumz
==/UserStyle== */

@-moz-document domain("www.bilibili.com") {
    html {
        /* 导航栏高度 */
        --navbar-height: 50px !important;
    }

    /* 进度条高度 */
    .bpx-player-control-wrap {
        height: 54px !important;
    }

    .bpx-player-control-top {
        bottom: 100% !important;
    }

    .bpx-player-control-bottom {
        margin-top: 10px !important;
    }

    .bpx-player-progress {
        /* 进度条宽度 */
        height: 6px !important;
        transform: translateY(100%);
        top: 1px;
    }

    .bpx-player-pbp>svg {
        /* 高能区透明度 */
        opacity: 50%;
        transform-origin: bottom;
        /* 高能区高度比例 */
        transform: scaleY(75%);
    }
}

谢谢。
这代码是你写的吗,如果是的话,更感谢了

posthumzAuthor
§
Posted: 2024.04.23.

谢谢。这代码是你写的吗,如果是的话,更感谢了

是的,也感谢你的支持

Post reply

Sign in to post a reply.