smueller/youtube-music
1
0
Fork 0
mirror of https://github.com/th-ch/youtube-music.git synced 2026-01-11 18:41:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(in-app-menu): overlay-scrollbar

Browse Source
This commit is contained in:
JellyBrick
2023-10-03 10:45:01 +09:00
parent 5a7774e7b1
commit 2cb05c9d86
5 changed files with 13 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
plugins/in-app-menu/front.ts
View File

@ -18,7 +18,7 @@ export default () => {
const titleBar = document.createElement('title-bar');
const navBar = document.querySelector<HTMLDivElement>('#nav-bar-background');
const logo = ElementFromFile(path.join(__dirname, '../../assets/youtube-music.svg'));
const logo = ElementFromFile(path.join(__dirname, '..' , '..' , 'assets', 'youtube-music.svg'));
logo.classList.add('title-bar-icon');
titleBar.appendChild(logo);
@ -47,7 +47,7 @@ export default () => {
menu.items.forEach((menuItem) => {
const menu = document.createElement('menu-button');
createPanel(titleBar, menu, menuItem.submenu?.items ?? []);
menu.append(menuItem.label);
titleBar.appendChild(menu);
});
@ -69,6 +69,11 @@ export default () => {
// 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', () => {
setupSearchOpenObserver();
const htmlHeadStyle = $('head > div > style');
if (htmlHeadStyle) {
// HACK: This is a hack to remove the scrollbar width
htmlHeadStyle.innerHTML = htmlHeadStyle.innerHTML.replace('html::-webkit-scrollbar {width: var(--ytmusic-scrollbar-width);', 'html::-webkit-scrollbar {');
}
}, { once: true, passive: true });
};

23
plugins/in-app-menu/titlebar.css
View File

@ -19,7 +19,7 @@ title-bar {
justify-content: flex-start;
align-items: center;
gap: 4px;
color: #f1f1f1;
font-size: 14px;
padding: 4px 12px;
@ -109,7 +109,7 @@ menu-separator {
height: 1px;
margin: 4px 0;
background-color: rgba(255, 255, 255, 0.2);
background-color: rgba(255, 255, 255, 0.2);
}
/* classes */
@ -136,22 +136,3 @@ ytmusic-app[is-bauhaus-sidenav-enabled] #guide-spacer.ytmusic-app,
ytmusic-app[is-bauhaus-sidenav-enabled] #mini-guide-spacer.ytmusic-app {
margin-top: calc(var(--ytmusic-nav-bar-height) + var(--menu-bar-height, 36px)) !important;
}
html::-webkit-scrollbar {
width: 12px !important;
}
html::-webkit-scrollbar-thumb {
border: solid 2px var(--titlebar-background-color, #030303) !important;
border-radius: 100px !important;
}
html::-webkit-scrollbar-track {
background: var(--titlebar-background-color, #030303) !important;
}
html::-webkit-scrollbar-track-piece:start {
background: transparent;
margin-top: var(--menu-bar-height, 36px);
}