mirror of https://github.com/Fabio286/antares.git
perf(Windows): title bar improvements
This commit is contained in:
parent
23acf00def
commit
5fa8bf38e4
|
@ -1,4 +1,4 @@
|
||||||
import { app, BrowserWindow, /* session, */ nativeImage, Menu } from 'electron';
|
import { app, BrowserWindow, /* session, */ nativeImage, Menu, ipcMain } from 'electron';
|
||||||
import * as path from 'path';
|
import * as path from 'path';
|
||||||
import * as Store from 'electron-store';
|
import * as Store from 'electron-store';
|
||||||
import * as windowStateKeeper from 'electron-window-state';
|
import * as windowStateKeeper from 'electron-window-state';
|
||||||
|
@ -7,9 +7,13 @@ import * as remoteMain from '@electron/remote/main';
|
||||||
import ipcHandlers from './ipc-handlers';
|
import ipcHandlers from './ipc-handlers';
|
||||||
|
|
||||||
Store.initRenderer();
|
Store.initRenderer();
|
||||||
|
const persistentStore = new Store({ name: 'settings' });
|
||||||
|
|
||||||
|
const appTheme = persistentStore.get('application_theme');
|
||||||
const isDevelopment = process.env.NODE_ENV !== 'production';
|
const isDevelopment = process.env.NODE_ENV !== 'production';
|
||||||
const isMacOS = process.platform === 'darwin';
|
const isMacOS = process.platform === 'darwin';
|
||||||
|
const isLinux = process.platform === 'linux';
|
||||||
|
const isWindows = process.platform === 'win32';
|
||||||
const gotTheLock = app.requestSingleInstanceLock();
|
const gotTheLock = app.requestSingleInstanceLock();
|
||||||
|
|
||||||
process.env.ELECTRON_DISABLE_SECURITY_WARNINGS = 'true';
|
process.env.ELECTRON_DISABLE_SECURITY_WARNINGS = 'true';
|
||||||
|
@ -28,15 +32,21 @@ async function createMainWindow () {
|
||||||
minWidth: 900,
|
minWidth: 900,
|
||||||
minHeight: 550,
|
minHeight: 550,
|
||||||
title: 'Antares SQL',
|
title: 'Antares SQL',
|
||||||
autoHideMenuBar: true,
|
|
||||||
icon: nativeImage.createFromDataURL(icon.default),
|
icon: nativeImage.createFromDataURL(icon.default),
|
||||||
webPreferences: {
|
webPreferences: {
|
||||||
nodeIntegration: true,
|
nodeIntegration: true,
|
||||||
contextIsolation: false,
|
contextIsolation: false,
|
||||||
spellcheck: false
|
spellcheck: false
|
||||||
},
|
},
|
||||||
frame: false,
|
autoHideMenuBar: true,
|
||||||
titleBarStyle: isMacOS ? 'hidden' : 'default',
|
titleBarStyle: isLinux ? 'default' :'hidden',
|
||||||
|
titleBarOverlay: isWindows
|
||||||
|
? {
|
||||||
|
color: appTheme === 'dark' ? '#3f3f3f' : '#fff',
|
||||||
|
symbolColor: appTheme === 'dark' ? '#fff' : '#000',
|
||||||
|
height: 30
|
||||||
|
}
|
||||||
|
: false,
|
||||||
trafficLightPosition: isMacOS ? { x: 10, y: 8 } : undefined,
|
trafficLightPosition: isMacOS ? { x: 10, y: 8 } : undefined,
|
||||||
backgroundColor: '#1d1d1d'
|
backgroundColor: '#1d1d1d'
|
||||||
});
|
});
|
||||||
|
@ -73,6 +83,14 @@ else {
|
||||||
// Initialize ipcHandlers
|
// Initialize ipcHandlers
|
||||||
ipcHandlers();
|
ipcHandlers();
|
||||||
|
|
||||||
|
ipcMain.on('refresh-theme-settings', () => {
|
||||||
|
const appTheme = persistentStore.get('application_theme');
|
||||||
|
mainWindow.setTitleBarOverlay({
|
||||||
|
color: appTheme === 'dark' ? '#3f3f3f' : '#fff',
|
||||||
|
symbolColor: appTheme === 'dark' ? '#fff' : '#000'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
// quit application when all windows are closed
|
// quit application when all windows are closed
|
||||||
app.on('window-all-closed', () => {
|
app.on('window-all-closed', () => {
|
||||||
// on macOS it is common for applications to stay open until the user explicitly quits
|
// on macOS it is common for applications to stay open until the user explicitly quits
|
||||||
|
|
|
@ -26,15 +26,16 @@
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-24px mdi-refresh" />
|
<i class="mdi mdi-24px mdi-refresh" />
|
||||||
</div>
|
</div>
|
||||||
|
<div v-if="isWindows" style="width: 140px;" />
|
||||||
<div
|
<div
|
||||||
v-if="!isMacOS"
|
v-if="isLinux"
|
||||||
class="titlebar-element"
|
class="titlebar-element"
|
||||||
@click="minimizeApp"
|
@click="minimizeApp"
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-24px mdi-minus" />
|
<i class="mdi mdi-24px mdi-minus" />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-if="!isMacOS"
|
v-if="isLinux"
|
||||||
class="titlebar-element"
|
class="titlebar-element"
|
||||||
@click="toggleFullScreen"
|
@click="toggleFullScreen"
|
||||||
>
|
>
|
||||||
|
@ -42,7 +43,7 @@
|
||||||
<i v-else class="mdi mdi-24px mdi-fullscreen" />
|
<i v-else class="mdi mdi-24px mdi-fullscreen" />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-if="!isMacOS"
|
v-if="isLinux"
|
||||||
class="titlebar-element close-button"
|
class="titlebar-element close-button"
|
||||||
@click="closeApp"
|
@click="closeApp"
|
||||||
>
|
>
|
||||||
|
@ -80,7 +81,9 @@ export default {
|
||||||
w: getCurrentWindow(),
|
w: getCurrentWindow(),
|
||||||
isMaximized: getCurrentWindow().isMaximized(),
|
isMaximized: getCurrentWindow().isMaximized(),
|
||||||
isDevelopment: process.env.NODE_ENV === 'development',
|
isDevelopment: process.env.NODE_ENV === 'development',
|
||||||
isMacOS: process.platform === 'darwin'
|
isMacOS: process.platform === 'darwin',
|
||||||
|
isWindows: process.platform === 'win32',
|
||||||
|
isLinux: process.platform === 'linux'
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -171,7 +174,7 @@ export default {
|
||||||
height: $titlebar-height;
|
height: $titlebar-height;
|
||||||
line-height: 0;
|
line-height: 0;
|
||||||
padding: 0 0.7rem;
|
padding: 0 0.7rem;
|
||||||
opacity: 0.7;
|
opacity: 0.9;
|
||||||
transition: opacity 0.2s;
|
transition: opacity 0.2s;
|
||||||
-webkit-app-region: no-drag;
|
-webkit-app-region: no-drag;
|
||||||
|
|
||||||
|
|
|
@ -361,7 +361,7 @@
|
||||||
.titlebar-element {
|
.titlebar-element {
|
||||||
&:hover {
|
&:hover {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
background: rgba($color: #fff, $alpha: 0.2);
|
background: rgba($color: #fff, $alpha: 0.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.close-button:hover {
|
&.close-button:hover {
|
||||||
|
|
|
@ -132,7 +132,7 @@
|
||||||
.titlebar-element {
|
.titlebar-element {
|
||||||
&:hover {
|
&:hover {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
background: rgba($color: rgb(172, 172, 172), $alpha: 0.2);
|
background: rgba($color: rgb(172, 172, 172), $alpha: 0.3);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.close-button:hover {
|
&.close-button:hover {
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import { defineStore, acceptHMRUpdate } from 'pinia';
|
import { defineStore, acceptHMRUpdate } from 'pinia';
|
||||||
|
import { ipcRenderer } from 'electron';
|
||||||
import i18n from '@/i18n';
|
import i18n from '@/i18n';
|
||||||
import Store from 'electron-store';
|
import Store from 'electron-store';
|
||||||
const persistentStore = new Store({ name: 'settings' });
|
const persistentStore = new Store({ name: 'settings' });
|
||||||
|
@ -54,6 +55,7 @@ export const useSettingsStore = defineStore('settings', {
|
||||||
changeApplicationTheme (theme) {
|
changeApplicationTheme (theme) {
|
||||||
this.applicationTheme = theme;
|
this.applicationTheme = theme;
|
||||||
persistentStore.set('application_theme', this.applicationTheme);
|
persistentStore.set('application_theme', this.applicationTheme);
|
||||||
|
ipcRenderer.send('refresh-theme-settings');
|
||||||
},
|
},
|
||||||
changeEditorTheme (theme) {
|
changeEditorTheme (theme) {
|
||||||
this.editorTheme = theme;
|
this.editorTheme = theme;
|
||||||
|
|
Loading…
Reference in New Issue