Merge pull request #451 from Araxeus/fix-blur-plugin

Blur plugin tweaks and integration with in-app-menu
This commit is contained in:
th-ch
2021-11-01 11:34:54 +01:00
committed by GitHub
3 changed files with 26 additions and 14 deletions

View File

@ -1,4 +1,4 @@
#nav-bar-background { #nav-bar-background, #header.ytmusic-item-section-renderer {
background: rgba(0, 0, 0, 0.3) !important; background: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(18px) !important; backdrop-filter: blur(18px) !important;
} }

View File

@ -1,6 +1,7 @@
const { remote, ipcRenderer } = require("electron"); const { remote, ipcRenderer } = require("electron");
const customTitlebar = require("custom-electron-titlebar"); const customTitlebar = require("custom-electron-titlebar");
function $(selector) { return document.querySelector(selector); }
module.exports = () => { module.exports = () => {
const bar = new customTitlebar.Titlebar({ const bar = new customTitlebar.Titlebar({
@ -13,4 +14,19 @@ module.exports = () => {
ipcRenderer.on("updateMenu", function (_event, showMenu) { ipcRenderer.on("updateMenu", function (_event, showMenu) {
bar.updateMenu(showMenu ? remote.Menu.getApplicationMenu() : null); bar.updateMenu(showMenu ? remote.Menu.getApplicationMenu() : null);
}); });
// Increases the right margin of Navbar background when the scrollbar is visible to avoid blocking it (z-index doesn't affect it)
document.addEventListener('apiLoaded', () => {
setNavbarMargin()
const playPageObserver = new MutationObserver(() => {
setNavbarMargin();
});
playPageObserver.observe($('ytmusic-app-layout'), { attributeFilter: ['player-page-open_', 'playerPageOpen_'] })
})
}; };
function setNavbarMargin() {
$('ytmusic-app-layout').playerPageOpen_ ?
$('#nav-bar-background').style.right = '0px' :
$('#nav-bar-background').style.right = '12px';
}

View File

@ -4,9 +4,10 @@
font-size: 14px !important; font-size: 14px !important;
} }
/* fixes scrollbar positioning relative to nav bar */ /* fixes nav-bar-background opacity bug and allows clicking scrollbar through it */
#nav-bar-background.ytmusic-app-layout { #nav-bar-background {
right: 15px !important; opacity: 1 !important;
pointer-events: none;
} }
/* remove window dragging for nav bar (conflict with titlebar drag) */ /* remove window dragging for nav bar (conflict with titlebar drag) */
@ -16,14 +17,9 @@ ytmusic-pivot-bar-item-renderer {
-webkit-app-region: unset !important; -webkit-app-region: unset !important;
} }
/* navbar background black */ /* move up item selection renderer by 13 px */
.center-content.ytmusic-nav-bar { ytmusic-item-section-renderer.stuck #header.ytmusic-item-section-renderer {
background: #030303; top: calc(var(--ytmusic-nav-bar-height) - 13px) !important;
}
/* move up item selectrion renderer by 15 px */
ytmusic-item-section-renderer[has-item-section-tabbed-header-renderer_] #header.ytmusic-item-section-renderer {
top: 75 !important;
} }
/* fix weird positioning in search screen*/ /* fix weird positioning in search screen*/
@ -32,8 +28,8 @@ ytmusic-header-renderer.ytmusic-search-page {
} }
/* Move navBar downwards */ /* Move navBar downwards */
ytmusic-app-layout > [slot="nav-bar"], ytmusic-nav-bar[slot="nav-bar"],
#nav-bar-background.ytmusic-app-layout { #nav-bar-background {
top: 17px !important; top: 17px !important;
} }