diff --git a/src/modules/rules/video/groups/playerLayout.scss b/src/modules/rules/video/groups/playerLayout.scss index 7f6c7c7..d2f6c22 100644 --- a/src/modules/rules/video/groups/playerLayout.scss +++ b/src/modules/rules/video/groups/playerLayout.scss @@ -30,7 +30,6 @@ html[webscreen-scrollable] { .webscreen-fix :is(.left-container, .playlist-container--left) { position: static !important; padding-top: 100vh; - min-width: 56vw !important; } .webscreen-fix :is(.left-container, .playlist-container--left) .video-info-container { height: fit-content; @@ -107,7 +106,6 @@ html[fullscreen-scrollable] { .webscreen-fix :is(.left-container, .playlist-container--left) { position: static !important; padding-top: 100vh; - min-width: 56vw !important; } .webscreen-fix :is(.left-container, .playlist-container--left) .video-info-container { height: fit-content; @@ -200,48 +198,74 @@ html[video-page-exchange-player-position] { // 普通播放 视频宽度调节 html[normalscreen-width] { - /* - 需避免右侧视频预览 inline player 影响 - data-screen变化慢, 播放模式判断一律用:not(), 使用html元素的player-is-wide加快wide模式判断 - */ - - // 左列宽度 - &:not([player-is-wide]) - :is(.left-container, .playlist-container--left):has( - .bpx-player-container:not([data-screen='wide'], [data-screen='web'], [data-screen='full']) + $normal-width: min(calc(100vw - 400px), var(--normalscreen-width)); + + // normal 调节评论宽度、播放器宽度,data-screen未赋值时按normal处理 + &:not([player-is-wide]):has( + #bilibili-player [data-screen='normal'], + #bilibili-player .bpx-player-container:not([data-screen]) ) { - flex-basis: min(calc(100vw - 400px), var(--normalscreen-width)) !important; - } - - // 播放器长宽 - &:not([player-is-wide]) - :is(.left-container, .playlist-container--left):has( - .bpx-player-container:not( - [data-screen='wide'], - [data-screen='web'], - [data-screen='full'], - [data-screen='mini'] - ) - ) - :is(.bpx-player-video-area, video) { - width: 100% !important; - height: unset !important; - aspect-ratio: 16 / 9 !important; - } - - // 播放器外层 - &:not([player-is-wide]) - :is(.left-container, .playlist-container--left):has( - .bpx-player-container:not( - [data-screen='wide'], - [data-screen='web'], - [data-screen='full'], - [data-screen='mini'] - ) - ) - :is(.bpx-player-primary-area, .bpx-player-container, .bpx-docker-major, #bilibili-player, #playerWrap) { - width: min(calc(100vw - 400px), var(--normalscreen-width)) !important; - height: unset !important; - min-height: calc(min(calc(100vw - 400px), var(--normalscreen-width)) * 9 / 16) !important; + #playerWrap { + height: fit-content !important; + + // placeholder + #bilibili-player-placeholder-top { + width: $normal-width !important; + aspect-ratio: 16 / 9 !important; + } + + // player + #bilibili-player { + width: $normal-width !important; + height: fit-content; + .bpx-player-video-area { + width: $normal-width !important; + aspect-ratio: 16 / 9 !important; + } + } + } + + // comment + .left-container, + .playlist-container--left { + width: min(calc(100vw - 400px), var(--normalscreen-width)) !important; + } } + + // web + full 全屏滚动时调节评论宽度 + &:has(#bilibili-player :is([data-screen='web'], [data-screen='full'])) { + .left-container, + .playlist-container--left { + width: min(calc(100vw - 400px), var(--normalscreen-width)) !important; + } + } + + // mini 仅normal mini模式下调节宽度 + &:not([player-is-wide]):has(#bilibili-player [data-screen='mini']) { + .left-container, + .playlist-container--left { + width: min(calc(100vw - 400px), var(--normalscreen-width)) !important; + } + + // 高度填充 + #playerWrap { + width: $normal-width !important; + height: fit-content !important; + #bilibili-player-placeholder { + position: static; + width: $normal-width !important; + height: fit-content !important; + #bilibili-player-placeholder-top { + width: $normal-width !important; + aspect-ratio: 16 / 9 !important; + } + } + #bilibili-player { + width: $normal-width !important; + height: fit-content !important; + } + } + } + + // wide 不调节任何宽度 } diff --git a/vite.config.ts b/vite.config.ts index a3b2b16..59078ea 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -19,7 +19,7 @@ export default defineConfig({ userscript: { name: 'bilibili 页面净化大师', namespace: 'http://tampermonkey.net/', - version: '4.0.5', + version: '4.0.6', description: '净化 B站/哔哩哔哩 页面,支持「精简功能、播放器净化、过滤视频、过滤评论、全站黑白名单」,提供 300+ 功能,定制自己的 B 站', author: 'festoney8',