titlebar & close btn
This commit is contained in:
punkfairie
parent
5dd978e491
commit
e34000e84e
3 changed files with 76 additions and 53 deletions
12
index.html
12
index.html
|
|
@ -4,9 +4,17 @@
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>ED Safari v0.0.1</title>
|
<title>ED Safari v0.0.1</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body data-bs-theme="dark">
|
||||||
|
<div id="titlebar" class="draggable container-fluid mt-2">
|
||||||
|
<div class="row justify-content-end">
|
||||||
|
<div class="col-auto">
|
||||||
|
<button type="button" class="btn-close" onclick="closeApp()"></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- CURRENT LOCATION -->
|
<!-- CURRENT LOCATION -->
|
||||||
<div class="container-fluid">
|
<div class="container-fluid draggable">
|
||||||
<div class="row separator align-items-center">
|
<div class="row separator align-items-center">
|
||||||
<div class="col"><hr class="separator"></div>
|
<div class="col"><hr class="separator"></div>
|
||||||
<div class="col-auto">Current Location</div>
|
<div class="col-auto">Current Location</div>
|
||||||
|
|
|
||||||
|
|
@ -177,3 +177,16 @@ div b.active.landable {
|
||||||
.form-control:focus {
|
.form-control:focus {
|
||||||
border-color: var(--main);
|
border-color: var(--main);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.draggable {
|
||||||
|
-webkit-app-region: drag;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#titlebar .btn-close {
|
||||||
|
-webkit-app-region: no-drag;
|
||||||
|
filter: drop-shadow(0 0px 3px var(--grey-text)) var(--bs-btn-close-white-filter);
|
||||||
|
width: 0.4em;
|
||||||
|
height: 0.4em;
|
||||||
|
}
|
||||||
104
src/main.js
104
src/main.js
|
|
@ -14,6 +14,8 @@ const createWindow = () => {
|
||||||
mainWindow = new BrowserWindow({
|
mainWindow = new BrowserWindow({
|
||||||
width: 1000,
|
width: 1000,
|
||||||
height: 800,
|
height: 800,
|
||||||
|
backgroundColor: 'black',
|
||||||
|
frame: false,
|
||||||
webPreferences: {
|
webPreferences: {
|
||||||
preload: path.join(__dirname, 'preload.js'),
|
preload: path.join(__dirname, 'preload.js'),
|
||||||
nodeIntegration: true,
|
nodeIntegration: true,
|
||||||
|
|
@ -60,60 +62,60 @@ app.on('activate', () => {
|
||||||
// In this file you can include the rest of your app's specific main process
|
// In this file you can include the rest of your app's specific main process
|
||||||
// code. You can also put them in separate files and import them here.
|
// code. You can also put them in separate files and import them here.
|
||||||
|
|
||||||
const openSettings = async () => {
|
// const openSettings = async () => {
|
||||||
settingsWindow = new BrowserWindow({
|
// settingsWindow = new BrowserWindow({
|
||||||
width: 800,
|
// width: 800,
|
||||||
height: 600,
|
// height: 600,
|
||||||
parent: mainWindow,
|
// parent: mainWindow,
|
||||||
modal: true,
|
// modal: true,
|
||||||
show: false,
|
// show: false,
|
||||||
webPreferences: {
|
// webPreferences: {
|
||||||
nodeIntegration: true,
|
// nodeIntegration: true,
|
||||||
contextIsolation: false,
|
// contextIsolation: false,
|
||||||
additionalArguments: [`EDS-ENV=${app.isPackaged}`],
|
// additionalArguments: [`EDS-ENV=${app.isPackaged}`],
|
||||||
},
|
// },
|
||||||
});
|
// });
|
||||||
|
|
||||||
if (SETTINGS_WINDOW_VITE_DEV_SERVER_URL) {
|
// if (SETTINGS_WINDOW_VITE_DEV_SERVER_URL) {
|
||||||
settingsWindow.loadURL(`${SETTINGS_WINDOW_VITE_DEV_SERVER_URL}/settings.html`);
|
// settingsWindow.loadURL(`${SETTINGS_WINDOW_VITE_DEV_SERVER_URL}/settings.html`);
|
||||||
} else {
|
// } else {
|
||||||
settingsWindow.loadFile(path.join(__dirname, `../renderer/${SETTINGS_WINDOW_VITE_NAME}/settings.html`));
|
// settingsWindow.loadFile(path.join(__dirname, `../renderer/${SETTINGS_WINDOW_VITE_NAME}/settings.html`));
|
||||||
}
|
// }
|
||||||
|
|
||||||
// Open the DevTools.
|
// // Open the DevTools.
|
||||||
if (!app.isPackaged) {
|
// if (!app.isPackaged) {
|
||||||
settingsWindow.webContents.openDevTools();
|
// settingsWindow.webContents.openDevTools();
|
||||||
}
|
// }
|
||||||
|
|
||||||
settingsWindow.show();
|
// settingsWindow.show();
|
||||||
|
|
||||||
// Make sure window is destroyed on close, or else it won't open again.
|
// // Make sure window is destroyed on close, or else it won't open again.
|
||||||
settingsWindow.on('closed', () => {
|
// settingsWindow.on('closed', () => {
|
||||||
settingsWindow = undefined;
|
// settingsWindow = undefined;
|
||||||
});
|
// });
|
||||||
}
|
// }
|
||||||
|
|
||||||
const menuTemplate = [
|
// const menuTemplate = [
|
||||||
{
|
// {
|
||||||
label: 'File',
|
// label: 'File',
|
||||||
submenu: [
|
// submenu: [
|
||||||
{ label: 'Settings', click: async () => { openSettings(); } },
|
// { label: 'Settings', click: async () => { openSettings(); } },
|
||||||
{ role: 'quit' }
|
// { role: 'quit' }
|
||||||
]
|
// ]
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
role: 'help',
|
// role: 'help',
|
||||||
submenu: [
|
// submenu: [
|
||||||
{
|
// {
|
||||||
label: 'Github',
|
// label: 'Github',
|
||||||
click: async () => {
|
// click: async () => {
|
||||||
const { shell } = require('electron');
|
// const { shell } = require('electron');
|
||||||
await shell.openExternal('https://github.com/punkfairie/ed-safari');
|
// await shell.openExternal('https://github.com/punkfairie/ed-safari');
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
]
|
// ]
|
||||||
}
|
// }
|
||||||
]
|
// ]
|
||||||
|
|
||||||
const menu = Menu.buildFromTemplate(menuTemplate)
|
// const menu = Menu.buildFromTemplate(menuTemplate)
|
||||||
Menu.setApplicationMenu(menu)
|
// Menu.setApplicationMenu(menu)
|
||||||
Loading…
Reference in a new issue