mirror of
https://github.com/th-ch/youtube-music.git
synced 2026-01-11 10:31:47 +00:00
Format custom menu plugin
This commit is contained in:
@ -1,8 +1,8 @@
|
|||||||
const { injectCSS } = require('../utils');
|
const { injectCSS } = require("../utils");
|
||||||
const { Menu } = require('electron');
|
const { Menu } = require("electron");
|
||||||
const path = require('path');
|
const path = require("path");
|
||||||
const electronLocalshortcut = require("electron-localshortcut");
|
const electronLocalshortcut = require("electron-localshortcut");
|
||||||
const config = require('../../config');
|
const config = require("../../config");
|
||||||
var { mainMenuTemplate } = require("../../menu");
|
var { mainMenuTemplate } = require("../../menu");
|
||||||
|
|
||||||
//override menu template for custom menu
|
//override menu template for custom menu
|
||||||
@ -14,21 +14,21 @@ mainMenuTemplate = function (winHook) {
|
|||||||
fixMenu(template);
|
fixMenu(template);
|
||||||
//return as normal
|
//return as normal
|
||||||
return template;
|
return template;
|
||||||
}
|
};
|
||||||
//win hook for fixing menu
|
//win hook for fixing menu
|
||||||
let win;
|
let win;
|
||||||
|
|
||||||
//check that menu doesn't get created twice
|
//check that menu doesn't get created twice
|
||||||
let done = false;
|
let done = false;
|
||||||
|
|
||||||
module.exports = winImport => {
|
module.exports = (winImport) => {
|
||||||
win = winImport;
|
win = winImport;
|
||||||
// css for custom scrollbar + disable drag area(was causing bugs)
|
// css for custom scrollbar + disable drag area(was causing bugs)
|
||||||
injectCSS(win.webContents, path.join(__dirname, 'style.css'));
|
injectCSS(win.webContents, path.join(__dirname, "style.css"));
|
||||||
win.on('ready-to-show', () => {
|
win.on("ready-to-show", () => {
|
||||||
// (apparently ready-to-show is called twice)
|
// (apparently ready-to-show is called twice)
|
||||||
if (done) {
|
if (done) {
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
done = true;
|
done = true;
|
||||||
let template = mainMenuTemplate(win);
|
let template = mainMenuTemplate(win);
|
||||||
@ -36,9 +36,9 @@ module.exports = winImport => {
|
|||||||
Menu.setApplicationMenu(menu);
|
Menu.setApplicationMenu(menu);
|
||||||
|
|
||||||
//register keyboard shortcut && hide menu if hideMenu is enabled
|
//register keyboard shortcut && hide menu if hideMenu is enabled
|
||||||
if (config.get('options.hideMenu')) {
|
if (config.get("options.hideMenu")) {
|
||||||
switchMenuVisibility();
|
switchMenuVisibility();
|
||||||
electronLocalshortcut.register(win, 'Esc', () => {
|
electronLocalshortcut.register(win, "Esc", () => {
|
||||||
switchMenuVisibility();
|
switchMenuVisibility();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -47,8 +47,8 @@ module.exports = winImport => {
|
|||||||
|
|
||||||
let visible = true;
|
let visible = true;
|
||||||
function switchMenuVisibility() {
|
function switchMenuVisibility() {
|
||||||
visible=!visible;
|
visible = !visible;
|
||||||
win.webContents.send('updateMenu',visible)
|
win.webContents.send("updateMenu", visible);
|
||||||
}
|
}
|
||||||
|
|
||||||
//go over each item in menu
|
//go over each item in menu
|
||||||
@ -60,7 +60,7 @@ function fixMenu(template) {
|
|||||||
fixMenu(item.submenu);
|
fixMenu(item.submenu);
|
||||||
}
|
}
|
||||||
//change onClick of checkbox+radio
|
//change onClick of checkbox+radio
|
||||||
else if (item.type === 'checkbox' || item.type === 'radio') {
|
else if (item.type === "checkbox" || item.type === "radio") {
|
||||||
let ogOnclick = item.click;
|
let ogOnclick = item.click;
|
||||||
item.click = (itemClicked) => {
|
item.click = (itemClicked) => {
|
||||||
ogOnclick(itemClicked);
|
ogOnclick(itemClicked);
|
||||||
@ -107,5 +107,5 @@ function checkCheckbox(item) {
|
|||||||
//check item
|
//check item
|
||||||
item.checked = !item.checked;
|
item.checked = !item.checked;
|
||||||
//update menu (closes it)
|
//update menu (closes it)
|
||||||
win.webContents.send('updateMenu', true);
|
win.webContents.send("updateMenu", true);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,15 +1,15 @@
|
|||||||
const customTitlebar = require('custom-electron-titlebar');
|
const customTitlebar = require("custom-electron-titlebar");
|
||||||
const {remote, ipcRenderer} = require('electron');
|
const { remote, ipcRenderer } = require("electron");
|
||||||
|
|
||||||
module.exports = () => {
|
module.exports = () => {
|
||||||
const myBar = new customTitlebar.Titlebar({
|
const myBar = new customTitlebar.Titlebar({
|
||||||
backgroundColor: customTitlebar.Color.fromHex('#050505'),
|
backgroundColor: customTitlebar.Color.fromHex("#050505"),
|
||||||
itemBackgroundColor: customTitlebar.Color.fromHex('#121212')
|
itemBackgroundColor: customTitlebar.Color.fromHex("#121212"),
|
||||||
});
|
});
|
||||||
myBar.updateTitle(' ');
|
myBar.updateTitle(" ");
|
||||||
document.title = 'Youtube Music';
|
document.title = "Youtube Music";
|
||||||
|
|
||||||
ipcRenderer.on('updateMenu', function (event, menu) {
|
ipcRenderer.on("updateMenu", function (event, menu) {
|
||||||
if (menu) {
|
if (menu) {
|
||||||
myBar.updateMenu(remote.Menu.getApplicationMenu());
|
myBar.updateMenu(remote.Menu.getApplicationMenu());
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
@ -1,21 +1,22 @@
|
|||||||
/* increase font size for menu and menuItems */
|
/* increase font size for menu and menuItems */
|
||||||
.titlebar, .menubar-menu-container .action-label{
|
.titlebar,
|
||||||
font-size: 14px !important;
|
.menubar-menu-container .action-label {
|
||||||
|
font-size: 14px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* allow submenu's to show correctly */
|
/* allow submenu's to show correctly */
|
||||||
.menubar-menu-container{
|
.menubar-menu-container {
|
||||||
overflow-y: visible !important;
|
overflow-y: visible !important;
|
||||||
}
|
}
|
||||||
/* fixes scrollbar positioning relative to nav bar */
|
/* fixes scrollbar positioning relative to nav bar */
|
||||||
#nav-bar-background.ytmusic-app-layout {
|
#nav-bar-background.ytmusic-app-layout {
|
||||||
right: 15px !important;
|
right: 15px !important;
|
||||||
}
|
}
|
||||||
/* remove window dragging for nav bar (conflict with titlebar drag) */
|
/* remove window dragging for nav bar (conflict with titlebar drag) */
|
||||||
ytmusic-nav-bar,
|
ytmusic-nav-bar,
|
||||||
.tab-titleiron-icon,
|
.tab-titleiron-icon,
|
||||||
ytmusic-pivot-bar-item-renderer {
|
ytmusic-pivot-bar-item-renderer {
|
||||||
-webkit-app-region : unset;
|
-webkit-app-region: unset;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Move navBar downwards and make it opaque */
|
/* Move navBar downwards and make it opaque */
|
||||||
@ -28,34 +29,35 @@ ytmusic-search-box.ytmusic-nav-bar {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.center-content.ytmusic-nav-bar {
|
.center-content.ytmusic-nav-bar {
|
||||||
background: #030303;
|
background: #030303;
|
||||||
}
|
}
|
||||||
yt-page-navigation-progress,
|
yt-page-navigation-progress,
|
||||||
#progress.yt-page-navigation-progress,
|
#progress.yt-page-navigation-progress,
|
||||||
ytmusic-item-section-renderer[has-item-section-tabbed-header-renderer_] #header.ytmusic-item-section-renderer,
|
ytmusic-item-section-renderer[has-item-section-tabbed-header-renderer_]
|
||||||
|
#header.ytmusic-item-section-renderer,
|
||||||
ytmusic-header-renderer.ytmusic-search-page {
|
ytmusic-header-renderer.ytmusic-search-page {
|
||||||
top: 90px !important;
|
top: 90px !important;
|
||||||
}
|
}
|
||||||
/* Custom scrollbar */
|
/* Custom scrollbar */
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
width: 12px;
|
width: 12px;
|
||||||
background-color: #030303;
|
background-color: #030303;
|
||||||
-webkit-border-radius: 100px;
|
-webkit-border-radius: 100px;
|
||||||
}
|
}
|
||||||
/* hover effect for both scrollbar area, and scrollbar 'thumb' */
|
/* hover effect for both scrollbar area, and scrollbar 'thumb' */
|
||||||
::-webkit-scrollbar:hover {
|
::-webkit-scrollbar:hover {
|
||||||
background-color: rgba(15, 15, 15, 0.699);
|
background-color: rgba(15, 15, 15, 0.699);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* The scrollbar 'thumb' ...that marque oval shape in a scrollbar */
|
/* The scrollbar 'thumb' ...that marque oval shape in a scrollbar */
|
||||||
::-webkit-scrollbar-thumb:vertical {
|
::-webkit-scrollbar-thumb:vertical {
|
||||||
background-clip: padding-box;
|
background-clip: padding-box;
|
||||||
border: 2px solid rgba(0, 0, 0, 0);
|
border: 2px solid rgba(0, 0, 0, 0);
|
||||||
|
|
||||||
background: rgb(49, 0, 0);
|
background: rgb(49, 0, 0);
|
||||||
-webkit-border-radius: 100px;
|
-webkit-border-radius: 100px;
|
||||||
}
|
}
|
||||||
::-webkit-scrollbar-thumb:vertical:active {
|
::-webkit-scrollbar-thumb:vertical:active {
|
||||||
background: rgb(56, 0, 0); /* Some darker color when you click it */
|
background: rgb(56, 0, 0); /* Some darker color when you click it */
|
||||||
-webkit-border-radius: 100px;
|
-webkit-border-radius: 100px;
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user