smueller/youtube-music
1
0
Fork 0
mirror of https://github.com/th-ch/youtube-music.git synced 2026-01-16 20:52:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
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
parent e2bbc6abbc 12c31725fe
commit 5256ffcf77
3 changed files with 26 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
plugins/blur-nav-bar/style.css
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;
backdrop-filter: blur(18px) !important;
}

16
plugins/in-app-menu/front.js
View File

@ -1,6 +1,7 @@
const { remote, ipcRenderer } = require("electron");
const customTitlebar = require("custom-electron-titlebar");
function $(selector) { return document.querySelector(selector); }
module.exports = () => {
const bar = new customTitlebar.Titlebar({
@ -13,4 +14,19 @@ module.exports = () => {
ipcRenderer.on("updateMenu", function (_event, showMenu) {
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';
}

22
plugins/in-app-menu/style.css
View File

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