mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Add compact style for custom navbar
This commit is contained in:
parent
a3de8bb59c
commit
0c7d68538f
1
@types/global/index.d.ts
vendored
1
@types/global/index.d.ts
vendored
@ -226,6 +226,7 @@ declare global
|
||||
customNavbarFill: boolean,
|
||||
allNavbarFill: boolean,
|
||||
customNavbarShadow: boolean,
|
||||
customNavbarCompact: boolean,
|
||||
playerShadow: boolean,
|
||||
narrowDanmaku: boolean,
|
||||
favoritesRedirect: boolean,
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -102,6 +102,7 @@ const settings = {
|
||||
customNavbarFill: true,
|
||||
allNavbarFill: true,
|
||||
customNavbarShadow: true,
|
||||
customNavbarCompact: false,
|
||||
playerShadow: false,
|
||||
narrowDanmaku: true,
|
||||
favoritesRedirect: true,
|
||||
@ -1754,6 +1755,7 @@ Resource.manifest = {
|
||||
customNavbar: "使用自定义顶栏",
|
||||
customNavbarFill: "主题色填充",
|
||||
customNavbarShadow: "投影",
|
||||
customNavbarCompact: "紧凑布局",
|
||||
allNavbarFill: "填充其他顶栏",
|
||||
},
|
||||
},
|
||||
|
||||
@ -102,6 +102,7 @@ const settings = {
|
||||
customNavbarFill: true,
|
||||
allNavbarFill: true,
|
||||
customNavbarShadow: true,
|
||||
customNavbarCompact: false,
|
||||
playerShadow: false,
|
||||
narrowDanmaku: true,
|
||||
favoritesRedirect: true,
|
||||
@ -1754,6 +1755,7 @@ Resource.manifest = {
|
||||
customNavbar: "使用自定义顶栏",
|
||||
customNavbarFill: "主题色填充",
|
||||
customNavbarShadow: "投影",
|
||||
customNavbarCompact: "紧凑布局",
|
||||
allNavbarFill: "填充其他顶栏",
|
||||
},
|
||||
},
|
||||
|
||||
@ -546,6 +546,7 @@ Resource.manifest = {
|
||||
customNavbar: "使用自定义顶栏",
|
||||
customNavbarFill: "主题色填充",
|
||||
customNavbarShadow: "投影",
|
||||
customNavbarCompact: "紧凑布局",
|
||||
allNavbarFill: "填充其他顶栏",
|
||||
},
|
||||
},
|
||||
|
||||
@ -77,6 +77,7 @@ export const settings = {
|
||||
customNavbarFill: true,
|
||||
allNavbarFill: true,
|
||||
customNavbarShadow: true,
|
||||
customNavbarCompact: false,
|
||||
playerShadow: false,
|
||||
narrowDanmaku: true,
|
||||
favoritesRedirect: true,
|
||||
|
||||
2
min/custom-navbar.min.css
vendored
2
min/custom-navbar.min.css
vendored
File diff suppressed because one or more lines are too long
2
min/custom-navbar.min.js
vendored
2
min/custom-navbar.min.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
2
min/settings-tooltip.zh-CN.min.js
vendored
2
min/settings-tooltip.zh-CN.min.js
vendored
File diff suppressed because one or more lines are too long
@ -163,6 +163,10 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
/* transform-origin: top; */
|
||||
/* transition: all 0.15s cubic-bezier(0.18, 0.89, 0.38, 1.15) .2s; */
|
||||
}
|
||||
.custom-navbar.compact .popup
|
||||
{
|
||||
padding: 8px;
|
||||
}
|
||||
.custom-navbar.dark .popup
|
||||
{
|
||||
box-shadow: rgba(0,0,0,0.3) 0 4px 40px 20px;
|
||||
@ -205,6 +209,10 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
.custom-navbar.compact #custom-navbar-home-popup .category-item
|
||||
{
|
||||
padding: 6px;
|
||||
}
|
||||
#custom-navbar-home-popup .category-item:hover
|
||||
{
|
||||
background-color: #0001;
|
||||
@ -230,6 +238,10 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
{
|
||||
min-width: 150px;
|
||||
}
|
||||
.custom-navbar.compact #custom-navbar-home-popup .category-item.main
|
||||
{
|
||||
min-width: 110px;
|
||||
}
|
||||
#custom-navbar-home-popup .category-item .popup
|
||||
{
|
||||
z-index: 10002;
|
||||
@ -257,6 +269,10 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
font-size: 11pt;
|
||||
line-height: 16pt;
|
||||
}
|
||||
.custom-navbar.compact #custom-navbar-home-popup .category-item .popup a
|
||||
{
|
||||
padding: 6px;
|
||||
}
|
||||
#custom-navbar-home-popup .category-item .popup a:hover,
|
||||
#upload-actions a:hover,
|
||||
#message-list a:hover
|
||||
@ -545,6 +561,10 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.custom-navbar.compact .video-list li:not(.more) a
|
||||
{
|
||||
padding: 6px 8px;
|
||||
}
|
||||
.custom-navbar .video-list li:hover
|
||||
{
|
||||
background: rgba(0,0,0,0.1);
|
||||
@ -562,6 +582,10 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.custom-navbar.compact .video-list li.more a
|
||||
{
|
||||
padding: 6px 0;
|
||||
}
|
||||
.custom-navbar .video-list li.more:hover
|
||||
{
|
||||
border-color: var(--theme-color);
|
||||
@ -580,12 +604,23 @@ li.nav-item[report-id='playpage_dynamic'] .i-frame,
|
||||
{
|
||||
border: none !important;
|
||||
}
|
||||
.custom-navbar.compact .video-list.history .history-item .title,
|
||||
.custom-navbar.compact .video-list li:not(.more) a
|
||||
{
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
.custom-navbar .video-list.history li:not(.more) a
|
||||
{
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
padding: 6px 8px !important;
|
||||
}
|
||||
.custom-navbar.compact .video-list.history li:not(.more) a
|
||||
{
|
||||
padding: 6px !important;
|
||||
}
|
||||
.custom-navbar .video-list.history a .description
|
||||
{
|
||||
opacity: 0.6;
|
||||
|
||||
@ -826,10 +826,12 @@ class HistoryList extends VideoList
|
||||
document.body.insertAdjacentHTML("beforeend", html);
|
||||
addSettingsListener("useDarkStyle", darkHandler);
|
||||
darkHandler(settings.useDarkStyle);
|
||||
addSettingsListener("customNavbarFill", value => classHandler("fill", value, document.querySelector(".custom-navbar")));
|
||||
classHandler("fill", settings.customNavbarFill, document.querySelector(".custom-navbar"));
|
||||
addSettingsListener("customNavbarShadow", value => classHandler("shadow", value, document.querySelector(".custom-navbar")));
|
||||
classHandler("shadow", settings.customNavbarShadow, document.querySelector(".custom-navbar"));
|
||||
["Fill", "Shadow", "Compact"].forEach(item =>
|
||||
{
|
||||
addSettingsListener("customNavbar" + item, value => classHandler(item.toLowerCase(), value, document.querySelector(".custom-navbar")));
|
||||
classHandler(item.toLowerCase(), settings["customNavbar" + item], document.querySelector(".custom-navbar"));
|
||||
});
|
||||
|
||||
const components = [
|
||||
new Logo,
|
||||
new Category,
|
||||
|
||||
@ -58,6 +58,7 @@
|
||||
<checkbox indent="1" key="customNavbarFill" dependencies="customNavbar"></checkbox>
|
||||
<checkbox indent="1" key="allNavbarFill" dependencies="customNavbar"></checkbox>
|
||||
<checkbox indent="1" key="customNavbarShadow" dependencies="customNavbar"></checkbox>
|
||||
<checkbox indent="1" key="customNavbarCompact" dependencies="customNavbar"></checkbox>
|
||||
<checkbox indent="0" key="useDarkStyle" dependencies=""></checkbox>
|
||||
<checkbox indent="0" key="darkSchedule" dependencies=""></checkbox>
|
||||
<textbox indent="1" key="darkScheduleStart" dependencies="darkSchedule"></textbox>
|
||||
|
||||
@ -93,6 +93,7 @@ export const toolTips = new Map([
|
||||
["customNavbarFill", `是否使用主题色填充顶栏.`],
|
||||
["allNavbarFill", `是否使用主题色填充其他的顶栏, 包括直播/相簿/会员购等.`],
|
||||
["customNavbarShadow", `是否为顶栏添加一层阴影效果.`],
|
||||
["customNavbarCompact", `是否为顶栏使用更紧凑的布局.`],
|
||||
["playerShadow", `为播放器添加主题色投影.`],
|
||||
["narrowDanmaku", `在网页全屏时, 即使宽度过小也强制保留弹幕发送栏, 注意这可能导致右侧的功能按钮挤出边界.`],
|
||||
]);
|
||||
|
||||
@ -93,6 +93,7 @@ export const toolTips = new Map<keyof BilibiliEvolvedSettings, string>([
|
||||
["customNavbarFill", `是否使用主题色填充顶栏.`],
|
||||
["allNavbarFill", `是否使用主题色填充其他的顶栏, 包括直播/相簿/会员购等.`],
|
||||
["customNavbarShadow", `是否为顶栏添加一层阴影效果.`],
|
||||
["customNavbarCompact", `是否为顶栏使用更紧凑的布局.`],
|
||||
["playerShadow", `为播放器添加主题色投影.`],
|
||||
["narrowDanmaku", `在网页全屏时, 即使宽度过小也强制保留弹幕发送栏, 注意这可能导致右侧的功能按钮挤出边界.`],
|
||||
]);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user