let themes specify macos titlebar buttons offset - fixes #3507

app/lib/window.ts

@@ -88,7 +88,7 @@ export class Window {
             bwOptions.frame = true
         } else {
             if (process.platform === 'darwin') {
-                bwOptions.titleBarStyle = 'hiddenInset'
+                bwOptions.titleBarStyle = 'hidden'
             }
         }
 

terminus-core/src/api/theme.ts

@@ -10,4 +10,7 @@ export abstract class Theme {
     css: string
 
     terminalBackground: string
+
+    macOSWindowButtonsInsetX?: number
+    macOSWindowButtonsInsetY?: number
 }

terminus-core/src/services/hostApp.service.ts

@@ -299,6 +299,10 @@ export class HostAppService {
         }
     }
 
+    setTrafficLightInset (x: number, y: number): void {
+        this.getWindow().setTrafficLightPosition({ x, y })
+    }
+
     relaunch (): void {
         if (this.isPortable) {
             this.electron.app.relaunch({ execPath: process.env.PORTABLE_EXECUTABLE_FILE })

terminus-core/src/services/themes.service.ts

@@ -1,6 +1,7 @@
 import { Inject, Injectable } from '@angular/core'
 import { ConfigService } from '../services/config.service'
 import { Theme } from '../api/theme'
+import { HostAppService, Platform } from './hostApp.service'
 
 @Injectable({ providedIn: 'root' })
 export class ThemesService {
@@ -9,6 +10,7 @@ export class ThemesService {
     /** @hidden */
     private constructor (
         private config: ConfigService,
+        private hostApp: HostAppService,
         @Inject(Theme) private themes: Theme[],
     ) {
         this.applyCurrentTheme()
@@ -33,6 +35,12 @@ export class ThemesService {
         }
         this.styleElement.textContent = theme.css
         document.querySelector('style#custom-css')!.innerHTML = this.config.store.appearance.css
+        if (this.hostApp.platform === Platform.macOS) {
+            this.hostApp.setTrafficLightInset(
+                theme.macOSWindowButtonsInsetX ?? 14,
+                theme.macOSWindowButtonsInsetY ?? 22,
+            )
+        }
     }
 
     private applyCurrentTheme (): void {

terminus-core/src/theme.compact.scss

@@ -16,6 +16,10 @@ app-root {
                 height: 14px;
             }
         }
+
+        .inset {
+            width: 70 !important;
+        }
     }
 
     terminaltab .content {

terminus-core/src/theme.ts

@@ -15,6 +15,8 @@ export class StandardCompactTheme extends Theme {
     name = 'Compact'
     css = require('./theme.compact.scss')
     terminalBackground = '#222a33'
+    macOSWindowButtonsInsetX = 8
+    macOSWindowButtonsInsetY = 12
 }
 
 /** @hidden */