window now maximizable by double click onto toolbar

contextAPI.js

@@ -28,7 +28,8 @@ contextBridge.exposeInMainWorld("api", {
 	appVersion : async () => await ipcRenderer.invoke("Ation::appVersion"),
 	fonts      : async () => await ipcRenderer.invoke("FontManager::fonts"),
 	resize     : size => ipcRenderer.invoke("WindowManager::resize", size),
-	fullscreen : fullscreen => ipcRenderer.invoke("WindowManager::presentFullscreen", fullscreen)
+	fullscreen : fullscreen => ipcRenderer.invoke("WindowManager::presentFullscreen", fullscreen),
+	maximize   : () => ipcRenderer.send("WindowManager::toggleMaximize")
 });
 
 contextBridge.exposeInMainWorld("appSettings", {

src/WindowManager.js

@@ -18,6 +18,7 @@ class WindowManager {
 
 		ipcMain.on("WindowManager::openFileDialog", () => this.app.openFile());
 		ipcMain.on("WindowManager::openFile", (_, path) => this.app.openFile(path));
+		ipcMain.on("WindowManager::toggleMaximize", () => this.mainWindow?.isMaximized() ? this.mainWindow?.unmaximize() : this.mainWindow?.maximize());
 		ipcMain.handle("WindowManager::resize", (_, height) => this.windows.settings.setSize(800, height + (process.platform === "win32" ? 50 : 0), true));
 		ipcMain.handle("WindowManager::presentFullscreen", (_, fullscreen) => this.windows.main.setFullScreen(fullscreen));
 	}

src/ui/src/assets/css/_window.scss

@@ -11,6 +11,10 @@
 		grid-column: 1 / span 2;
 	}
 
+	&.edit {
+		//grid-template-columns: 10% auto;
+	}
+
 	main {
 		background: color(mainBackground);
 		overflow-y: auto;

src/ui/src/components/Ation.js

@@ -64,7 +64,7 @@ const Ation = () => {
 				<NoFile openFile={openFile} />
 			: (
 				<SlideContext.Provider value={{slide, setSlide, mode, setMode, basePath, slideCount : deck.length}}>
-					<section className={`window${mode === Mode.PRESENT ? " fullscreen" : ""}`}>
+					<section className={`window${mode === Mode.PRESENT ? " fullscreen" : (mode === Mode.EDIT ? " edit" : "")}`}>
 						<Toolbar openFile={openFile} setShowTips={setShowTips} version={version} toggleEdit={toggleEdit} />
 						<SlidesList deck={deck} meta={meta} font={font} />
 						<main className={`main ${mode === Mode.EDIT ? "edit" : ""}`} style={{

src/ui/src/components/Toolbar.js

@@ -16,8 +16,12 @@ const Toolbar = ({openFile, setShowTips, version, toggleEdit}) => {
 		document.documentElement.requestFullscreen();
 	};
 
+	const toggleMaximize = () => {
+		window.api.maximize();
+	};
+
 	return (
-		<nav className="toolbar">
+		<nav className="toolbar" onDoubleClick={toggleMaximize}>
 			<button onClick={openFile} title="Open file [⌘+O]"><Folder2Open /></button>	
 			<button onClick={present} title="Start presentation [F5]"><Cast /></button>	
 			<Logo />