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

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

View File

@ -38,7 +38,9 @@ if (!gotTheLock) {
app.exit();
}
app.commandLine.appendSwitch('enable-features', 'SharedArrayBuffer'); // Required for downloader
// SharedArrayBuffer: Required for downloader (@ffmpeg/core-mt)
// OverlayScrollbar: Required for overlay scrollbars
app.commandLine.appendSwitch('enable-features', 'OverlayScrollbar,SharedArrayBuffer');
if (config.get('options.disableHardwareAcceleration')) {
if (is.dev()) {
console.log('Disabling hardware acceleration');

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);
@ -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 });
};

View File

@ -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);
}

View File

@ -1,21 +0,0 @@
// eslint-disable-next-line import/no-unresolved
import { Titlebar, Color } from 'custom-electron-titlebar';
const customTitlebarFunction = () => {
new Titlebar({
backgroundColor: Color.fromHex('#050505'),
minimizable: false,
maximizable: false,
menu: undefined,
});
const mainStyle = document.querySelector<HTMLElement>('#container')?.style;
if (mainStyle) {
mainStyle.width = '100%';
mainStyle.position = 'fixed';
mainStyle.border = 'unset';
}
};
module.exports = customTitlebarFunction;
export default customTitlebarFunction;

View File

@ -1,18 +1,8 @@
import path from 'node:path';
import is from 'electron-is';
import { isEnabled } from '../config/plugins';
const iconPath = path.join(__dirname, '..', 'assets', 'youtube-music-tray.png');
const customTitlebarPath = path.join(__dirname, 'prompt-custom-titlebar.js');
const promptOptions = !is.macOS() && isEnabled('in-app-menu') ? {
customStylesheet: 'dark',
// The following are used for custom titlebar
frame: false,
customScript: customTitlebarPath,
} : {
const promptOptions = {
customStylesheet: 'dark',
icon: iconPath,
};