mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Add transparent fill
This commit is contained in:
parent
865cc32b20
commit
0fc1a39397
2
@types/global/index.d.ts
vendored
2
@types/global/index.d.ts
vendored
@ -350,7 +350,7 @@ declare global {
|
||||
},
|
||||
customNavbar: boolean,
|
||||
customNavbarFill: boolean,
|
||||
allNavbarFill: boolean,
|
||||
customNavbarTransparent: boolean,
|
||||
customNavbarShadow: boolean,
|
||||
customNavbarCompact: boolean,
|
||||
customNavbarBlur: boolean,
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -28,9 +28,9 @@
|
||||
"compact-layout.min.js": "B20609A7CBBDB1845FA0156FB5BE6B1E1A1B8B069EA85F65D16241DD2C12D738",
|
||||
"custom-control-background.min.css": "1981FD2BF3B17ECF33F98D5DEDAF0D32ACBE9532A51FDB70822286991AB98EF3",
|
||||
"custom-control-background.min.js": "2A439B045A51D24F5115DD25995ED37E3D0371A074199FE6C727F2235F39C4D9",
|
||||
"custom-navbar.min.css": "C644D5D003B55D3E5C5DEE300525EB9DC3BDA497A42E61C8F095E1630E570522",
|
||||
"custom-navbar.min.css": "D17D935EBB799E5EB59758F9988ADEFF32289AD1D5FDB9C7E115BA716EF43448",
|
||||
"custom-navbar.min.html": "8A5332791C9693A571F7B885D6367616F519054CACEDA2DDA147735638EDEE15",
|
||||
"custom-navbar.min.js": "1B6D7276FD0CA115439977D178D17EA34CCC2FF34E408D2D34EB51772E636266",
|
||||
"custom-navbar.min.js": "E9D8BA6407E38BB9E15D6305B28186606DB3A6589916AD86419FF97A0938BA0A",
|
||||
"danmaku-converter.min.js": "FDAB4DB2E3C79730A39CDA7C5FD193693621FED206C6549E9B8F13778080CC12",
|
||||
"dark.min.css": "57255538FB3BB54F9C1482F6AF0EC0BE7D7B1302BA46310D597A0AFEA3C24B6A",
|
||||
"dark-important.min.css": "8453644F7FC8BB0E9DA401DC161815E2AC198E9B4D7A5A19C29934B672F277B1",
|
||||
@ -74,7 +74,7 @@
|
||||
"full-tweets-title.min.css": "13A0CF1C96F374CED3FA59A532E28B4B620D7A4C374385A363F32AD1A7656764",
|
||||
"full-tweets-title.min.js": "DD57BB732ABEF7739CA84AEFF97E86F8984FCC4A8A75B957213622350B2A7C37",
|
||||
"gui-settings.min.css": "2EB849BA331083A594A88615B03FD25B847DD5CF7D38DECDDE7D2DAABDEA370D",
|
||||
"gui-settings.min.html": "1158BEF643747B561910ED50CB1B704BC0ED5AF3ACAA4B30373E5DA13FD83234",
|
||||
"gui-settings.min.html": "E36C7965247978AC96EE66FB93223897EC48DD3B4FCE20C899532AE78E9F4802",
|
||||
"gui-settings.min.js": "029562CA0C0DEFCCBFF38C662C56C651C09847CDB78A99873E3ABA9936B428BA",
|
||||
"haruna-scale.min.js": "D046864416831B101582DD87E602AE21309FDE2DB64A8F24D57B6ADBE67E6D7B",
|
||||
"hide-bangumi-reviews.min.js": "7265C0CE994FDA926355A9A4F9B207E7E68E749D47332F3C537EF93E97927A23",
|
||||
|
||||
BIN
min/bundle.zip
BIN
min/bundle.zip
Binary file not shown.
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
@ -565,6 +565,7 @@ Resource.manifest = {
|
||||
customNavbar: '使用自定义顶栏',
|
||||
customNavbarSeasonLogo: '使用季节Logo',
|
||||
customNavbarFill: '主题色填充',
|
||||
customNavbarTransparent: '透明填充',
|
||||
customNavbarShadow: '投影',
|
||||
customNavbarCompact: '紧凑布局',
|
||||
customNavbarBlur: '背景模糊',
|
||||
|
||||
@ -133,6 +133,7 @@ export const settings = {
|
||||
},
|
||||
customNavbar: true,
|
||||
customNavbarFill: false,
|
||||
customNavbarTransparent: false,
|
||||
customNavbarShadow: true,
|
||||
customNavbarCompact: false,
|
||||
customNavbarBlur: true,
|
||||
|
||||
@ -200,14 +200,13 @@ const attributes = {
|
||||
},
|
||||
};
|
||||
const classHandler = (key, value, element) => {
|
||||
element.classList[value ? "add" : "remove"](key);
|
||||
element.classList.toggle(key, value)
|
||||
}
|
||||
const darkHandler = value => {
|
||||
document.querySelector(".custom-navbar").classList[value ? "add" : "remove"]("dark");
|
||||
document.querySelector(".custom-navbar-settings").classList[value ? "add" : "remove"]("dark");
|
||||
};
|
||||
addSettingsListener("allNavbarFill", value => classHandler("all-navbar-fill", value, document.body));
|
||||
classHandler("all-navbar-fill", settings.allNavbarFill, document.body);
|
||||
addSettingsListener("allNavbarFill", value => classHandler("all-navbar-fill", value, document.body), true)
|
||||
const supportedUrls = [
|
||||
"//www.bilibili.com",
|
||||
"//t.bilibili.com",
|
||||
@ -300,10 +299,9 @@ class Blank extends NavbarComponent {
|
||||
class Logo extends NavbarComponent {
|
||||
constructor () {
|
||||
super();
|
||||
this.getLogo()
|
||||
this.href = `https://www.bilibili.com/`;
|
||||
this.touch = false;
|
||||
addSettingsListener('customNavbarSeasonLogo', () => this.getLogo())
|
||||
addSettingsListener('customNavbarSeasonLogo', () => this.getLogo(), true)
|
||||
}
|
||||
async getLogo () {
|
||||
if (settings.customNavbarSeasonLogo) {
|
||||
@ -1694,11 +1692,9 @@ class Subscriptions extends NavbarComponent {
|
||||
userInfo = json.data;
|
||||
latestID = Activities.getLatestID()
|
||||
document.body.insertAdjacentHTML("beforeend", html);
|
||||
addSettingsListener("useDarkStyle", darkHandler);
|
||||
darkHandler(settings.useDarkStyle);
|
||||
addSettingsListener("useDarkStyle", darkHandler, true);
|
||||
["Fill", "Shadow", "Compact", "Blur"].forEach(item => {
|
||||
addSettingsListener("customNavbar" + item, value => classHandler(item.toLowerCase(), value, document.querySelector(".custom-navbar")));
|
||||
classHandler(item.toLowerCase(), settings["customNavbar" + item], document.querySelector(".custom-navbar"));
|
||||
addSettingsListener("customNavbar" + item, value => classHandler(item.toLowerCase(), value, document.querySelector(".custom-navbar")), true)
|
||||
});
|
||||
SpinQuery.condition(() => dq("#banner_link,.international-header .bili-banner"),
|
||||
banner => banner === null ? null : banner.style.backgroundImage,
|
||||
@ -1708,9 +1704,19 @@ class Subscriptions extends NavbarComponent {
|
||||
blurLayers.forEach(blurLayer => {
|
||||
blurLayer.style.backgroundImage = banner.style.backgroundImage;
|
||||
blurLayer.setAttribute("data-image", banner.style.backgroundImage);
|
||||
});
|
||||
});
|
||||
});
|
||||
})
|
||||
addSettingsListener('customNavbarTransparent', value => {
|
||||
if (!settings.hideBanner) {
|
||||
dq('.custom-navbar').classList.toggle('transparent', value)
|
||||
}
|
||||
}, true)
|
||||
addSettingsListener('hideBanner', value => {
|
||||
if (settings.customNavbarTransparent) {
|
||||
dq('.custom-navbar').classList.toggle('transparent', !value)
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
const components = [
|
||||
new Blank(1),
|
||||
|
||||
@ -147,6 +147,7 @@ li.nav-item[report-id="playpage_dynamic"] iframe,
|
||||
li.nav-item[report-id="playpage_dynamic"] .i-frame,
|
||||
.z-top-container > .header .search,
|
||||
.i_menu_login,
|
||||
.international-header .b-wrap,
|
||||
.bili-banner .taper-line,
|
||||
.international-header .mini-header {
|
||||
display: none !important;
|
||||
@ -201,16 +202,29 @@ li.nav-item[report-id="playpage_dynamic"] .i-frame,
|
||||
&.fill path {
|
||||
fill: var(--foreground-color-d);
|
||||
}
|
||||
&.shadow {
|
||||
&.shadow:not(.transparent) {
|
||||
box-shadow: #0002 0 1px 10px 1px;
|
||||
}
|
||||
&.dark.shadow {
|
||||
&.dark.shadow:not(.transparent) {
|
||||
box-shadow: #0004 0px 2px 10px 1px;
|
||||
}
|
||||
&.dark:not(.fill) {
|
||||
&.dark:not(.fill):not(.transparent) {
|
||||
--navbar-background: #222;
|
||||
--navbar-foreground: #eee;
|
||||
}
|
||||
&.transparent {
|
||||
--navbar-background: transparent;
|
||||
--navbar-foreground: #eee;
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: calc(2 * var(--navbar-height));
|
||||
background-image: linear-gradient(to bottom, #000a 0, #0004 65%, transparent 100%);
|
||||
}
|
||||
}
|
||||
.popup {
|
||||
color: black;
|
||||
background: white;
|
||||
@ -229,7 +243,7 @@ li.nav-item[report-id="playpage_dynamic"] .i-frame,
|
||||
height: var(--navbar-height);
|
||||
width: 100%;
|
||||
}
|
||||
&.fill.shadow {
|
||||
&.fill.shadow:not(.transparent) {
|
||||
box-shadow: var(--theme-color-30) 0px 2px 10px 1px;
|
||||
}
|
||||
& > ul {
|
||||
@ -265,6 +279,7 @@ li.nav-item[report-id="playpage_dynamic"] .i-frame,
|
||||
border-radius: 1.5px;
|
||||
display: none;
|
||||
}
|
||||
&.transparent li .active-bar,
|
||||
&.fill li .active-bar {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
@ -749,7 +764,7 @@ li.nav-item[report-id="playpage_dynamic"] .i-frame,
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
&.blur .blur-layer-container {
|
||||
&.blur:not(.transparent) .blur-layer-container {
|
||||
display: flex;
|
||||
}
|
||||
.blur-layer {
|
||||
|
||||
@ -76,6 +76,7 @@
|
||||
<checkbox indent="0" key="customNavbar" dependencies=""></checkbox>
|
||||
<checkbox indent="1" key="customNavbarSeasonLogo" dependencies="customNavbar"></checkbox>
|
||||
<checkbox indent="1" key="customNavbarFill" dependencies="customNavbar"></checkbox>
|
||||
<checkbox indent="1" key="customNavbarTransparent" 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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user