Use native window controls

electron/main.ts

@@ -1,5 +1,4 @@
 import { app, BrowserWindow, Menu, dialog, ipcMain } from "electron";
-import isDev from "electron-is-dev";
 import { readFile, writeFile } from "node:fs/promises";
 import path from "node:path";
 import { fileURLToPath } from "node:url";
@@ -13,7 +12,12 @@ async function createWindow() {
     minWidth: 980,
     minHeight: 680,
     title: "EnvHelper",
-    frame: false,
+    titleBarStyle: "hidden",
+    titleBarOverlay: {
+      color: "#eef1ed",
+      symbolColor: "#17241d",
+      height: 34
+    },
     autoHideMenuBar: true,
     backgroundColor: "#f6f7f4",
     webPreferences: {
@@ -25,7 +29,7 @@ async function createWindow() {
 
   Menu.setApplicationMenu(null);
 
-  if (isDev) {
+  if (!app.isPackaged) {
     await win.loadURL("http://127.0.0.1:5173");
   } else {
     await win.loadFile(path.join(__dirname, "../dist/index.html"));
@@ -49,27 +53,6 @@ ipcMain.handle("envhelper:open-file", async () => {
   };
 });
 
-ipcMain.handle("envhelper:window-minimize", (event) => {
-  BrowserWindow.fromWebContents(event.sender)?.minimize();
-});
-
-ipcMain.handle("envhelper:window-toggle-maximize", (event) => {
-  const win = BrowserWindow.fromWebContents(event.sender);
-  if (!win) {
-    return;
-  }
-
-  if (win.isMaximized()) {
-    win.unmaximize();
-  } else {
-    win.maximize();
-  }
-});
-
-ipcMain.handle("envhelper:window-close", (event) => {
-  BrowserWindow.fromWebContents(event.sender)?.close();
-});
-
 ipcMain.handle("envhelper:save-file", async (_event, content: string) => {
   const result = await dialog.showSaveDialog({
     defaultPath: ".env",

electron/preload.ts

@@ -2,8 +2,5 @@ import { contextBridge, ipcRenderer } from "electron";
 
 contextBridge.exposeInMainWorld("envHelper", {
   openFile: () => ipcRenderer.invoke("envhelper:open-file"),
-  saveFile: (content: string) => ipcRenderer.invoke("envhelper:save-file", content),
+  saveFile: (content: string) => ipcRenderer.invoke("envhelper:save-file", content)
-  minimizeWindow: () => ipcRenderer.invoke("envhelper:window-minimize"),
-  toggleMaximizeWindow: () => ipcRenderer.invoke("envhelper:window-toggle-maximize"),
-  closeWindow: () => ipcRenderer.invoke("envhelper:window-close")
 });

package.json

@@ -17,7 +17,6 @@
     "lint": "tsc --noEmit"
   },
   "dependencies": {
-    "electron-is-dev": "^3.0.1",
     "lucide-react": "^0.468.0",
     "react": "^19.1.1",
     "react-dom": "^19.1.1"

src/App.tsx

@@ -4,8 +4,6 @@ import {
   FileDown,
   FileInput,
   Languages,
-  Maximize2,
-  Minus,
   Plus,
   RefreshCcw,
   Settings,
@@ -335,17 +333,6 @@ export default function App() {
           <div className="titlebarMark">EH</div>
           <span>EnvHelper</span>
         </div>
-        <div className="windowControls">
-          <button onClick={() => window.envHelper?.minimizeWindow()} title="Minimize" type="button">
-            <Minus size={15} />
-          </button>
-          <button onClick={() => window.envHelper?.toggleMaximizeWindow()} title="Maximize" type="button">
-            <Maximize2 size={14} />
-          </button>
-          <button className="closeButton" onClick={() => window.envHelper?.closeWindow()} title="Close" type="button">
-            <X size={15} />
-          </button>
-        </div>
       </section>
 
       <header className="toolbar">

src/styles.css

@@ -155,6 +155,7 @@ textarea:focus {
   display: flex;
   justify-content: space-between;
   overflow: hidden;
+  padding-right: 138px;
 }
 
 .titlebarBrand {
@@ -180,33 +181,6 @@ textarea:focus {
   width: 24px;
 }
 
-.windowControls {
-  -webkit-app-region: no-drag;
-  align-items: stretch;
-  display: flex;
-  height: 100%;
-}
-
-.windowControls button {
-  background: transparent;
-  border-radius: 0;
-  color: var(--muted);
-  min-height: 0;
-  min-width: 44px;
-  padding: 0;
-}
-
-.windowControls button:hover {
-  background: var(--surface-subtle);
-  color: var(--text);
-  transform: none;
-}
-
-.windowControls .closeButton:hover {
-  background: #c93d32;
-  color: #fff;
-}
-
 .toolbar {
   align-items: center;
   background: var(--surface);

src/vite-env.d.ts

@@ -9,8 +9,5 @@ interface Window {
   envHelper?: {
     openFile: () => Promise<EnvHelperFileResult | null>;
     saveFile: (content: string) => Promise<string | null>;
-    minimizeWindow: () => Promise<void>;
-    toggleMaximizeWindow: () => Promise<void>;
-    closeWindow: () => Promise<void>;
   };
 }