Bilibili 極簡模式

B站寬螢幕 (支援直式影片)
当前为 2025-05-12 提交的版本，查看最新版本。
换行
/* ==UserStyle==
@name         Bilibili 極簡模式
@version      5.0
@namespace    http://tampermonkey.net/
@description  B站寬螢幕 (支援直式影片)
@license      MIT
==/UserStyle== */
@-moz-document regexp("https://www.bilibili.com/video/.*"),regexp("https://www.bilibili.com/list/.*"){

/* 基礎播放器設定 */
#playerWrap {
  height: initial;
  margin-top: -0%;
}

/* 影片播放器核心容器 */
video,
#bilibili-player {
  width:  auto;
  height: auto;
  max-height: calc(100vh - 110px);
  object-fit: contain;
}

/* 影片比例控制系統 */
.scroll-sticky.left-container {
  width: 100%;
}

/* 新版右側欄位 - 動態高度適配 */
.right-container {
  right: 0;
  height: auto;
  max-height: none;
  z-index: 1000;
  opacity: 0;
  background: rgba(0, 0, 0, 0.85);
  transition: 0.0s ease;
}
@media (width >= 1917px) { /* 高於此寬度保留右區塊 */
  .right-container {
    position: absolute ;
  }

}
@media (width < 1917px) { /* 低於此寬度移除右區塊 */
  .right-container {
  position: absolute !important;
  clip-path: polygon(70% 0%, 100% 0%, 100% 20%, 70% 20%);
  }

}

/* 主標題欄隱藏效果 */
#biliMainHeader,
.mini-header.bili-header__bar{
  position: absolute !important;
  height: auto;
  top: 0;
  z-index: 1000;
  opacity: 0;
  background: rgba(0, 0, 0, 0.85);
  clip-path: polygon(0% 0, 100% 0%, 100% 100%, 0% 100%);
}

/* 懸停觸發展開效果 */
.right-container:hover,
#biliMainHeader:hover,
.mini-header.bili-header__bar:hover {
  opacity: 1;
  clip-path: none;
}

/* 全屏模式適配 */
.bilibili-player-video-web-fullscreen #bilibili-player {
  height: 100vh !important;
}
}
欢迎访问Greasy Fork镜像
