.

app/main.js

@@ -1,3 +1,6 @@
+const yaml = require('js-yaml')
+const path = require('path')
+const fs = require('fs')
 const Config = require('electron-config')
 const electron = require('electron')
 const platform = require('os').platform()
@@ -95,11 +98,19 @@ start = () => {
         return
     }
 
+    let configPath = path.join(electron.app.getPath('userData'), 'config.yaml')
+    let configData
+    if (fs.existsSync(configPath)) {
+        configData = yaml.safeLoad(fs.readFileSync(configPath, 'utf8'))
+    } else {
+        configData = {}
+    }
+
     let options = {
         width: 800,
         height: 400,
         //icon: `${app.getAppPath()}/assets/img/icon.png`,
-        title: 'ELEMENTS Benchmark',
+        title: 'Term',
         minWidth: 300,
         minHeight: 100,
         'web-preferences': {'web-security': false},
@@ -113,6 +124,10 @@ start = () => {
         options.titleBarStyle = 'hidden'
     }
 
+    if ((configData.appearance || {}).useNativeFrame) {
+        options.frame = true
+    }
+
     app.commandLine.appendSwitch('disable-http-cache')
 
     app.window = new electron.BrowserWindow(options)

app/src/components/app.pug

@@ -1,4 +1,4 @@
-.titlebar
+.titlebar(*ngIf='!config.store.appearance.useNativeFrame')
     .title((dblclick)='hostApp.maximizeWindow()') Term
     button.btn-minimize((click)='hostApp.minimizeWindow()')
         i.fa.fa-window-minimize

app/src/components/app.ts

@@ -1,10 +1,12 @@
 import { Component, ElementRef, trigger, style, animate, transition, state } from '@angular/core'
+import { ToasterConfig } from 'angular2-toaster'
+
 import { ElectronService } from 'services/electron'
 import { HostAppService } from 'services/hostApp'
 import { HotkeysService } from 'services/hotkeys'
 import { LogService } from 'services/log'
 import { QuitterService } from 'services/quitter'
-import { ToasterConfig } from 'angular2-toaster'
+import { ConfigService } from 'services/config'
 import { Session, SessionsService } from 'services/sessions'
 
 import 'angular2-toaster/lib/toaster.css'
@@ -62,6 +64,7 @@ export class AppComponent {
         private sessions: SessionsService,
         public hostApp: HostAppService,
         public hotkeys: HotkeysService,
+        public config: ConfigService,
         log: LogService,
         electron: ElectronService,
         _quitter: QuitterService,

app/src/components/settingsPane.pug

@@ -1,8 +1,21 @@
+.restart-bar(*ngIf='restartRequested')
+    button.btn.btn-default.pull-right('(click)'='restartApp()') Restart
+    | Restart the app to apply changes
+
 ngb-tabset(type='tabs')
     ngb-tab
         template(ngbTabTitle)
             | General
         template(ngbTabContent)
+            .form-group
+                label.form-control
+                    input(
+                        type='checkbox',
+                        '[(ngModel)]'='config.store.appearance.useNativeFrame',
+                        '(ngModelChange)'='config.save(); requestRestart()',
+                    )
+                    | Use native window frame
+                    
             .form-group
                 label.control-label Font
                 input.form-control(
@@ -29,3 +42,5 @@ ngb-tabset(type='tabs')
                         th Toggle terminal window
                         td
                             hotkey-input('[(model)]'='globalHotkey')
+                                
+                                

app/src/components/settingsPane.ts

@@ -15,10 +15,19 @@ const childProcessPromise = nodeRequire('child-process-promise')
   styles: [require('./settingsPane.less')],
 })
 export class SettingsPaneComponent {
+    isWindows: boolean
+    isMac: boolean
+    isLinux: boolean
+    year: number
+    version: string
+    fonts: string[] = []
+    restartRequested: boolean
+    globalHotkey = ['Ctrl+Shift+G']
+
     constructor(
         public config: ConfigService,
+        private electron: ElectronService,
         hostApp: HostAppService,
-        electron: ElectronService,
     ) {
         this.isWindows = hostApp.platform == PLATFORM_WINDOWS
         this.isMac = hostApp.platform == PLATFORM_MAC
@@ -27,15 +36,6 @@ export class SettingsPaneComponent {
         this.year = new Date().getFullYear()
     }
 
-    isWindows: boolean
-    isMac: boolean
-    isLinux: boolean
-    year: number
-    version: string
-    fonts: string[] = []
-
-    globalHotkey = ['Ctrl+Shift+G']
-
     ngOnInit () {
         childProcessPromise.exec('fc-list :spacing=mono').then((result) => {
             this.fonts = result.stdout
@@ -58,4 +58,13 @@ export class SettingsPaneComponent {
     ngOnDestroy () {
         this.config.save()
     }
+
+    requestRestart () {
+        this.restartRequested = true
+    }
+
+    restartApp () {
+        this.electron.app.relaunch()
+        this.electron.app.exit()
+    }
 }

app/src/global.less

@@ -173,8 +173,8 @@ ngb-typeahead-window {
 }
 
 label.control-label {
-    background: rgba(0, 0, 0, .25);
+    background: rgba(0, 0, 0, .4);
-    color: #ccc;
+    color: #aaa;
     font-size: 10px;
     display: block;
     margin: 0;
@@ -183,13 +183,13 @@ label.control-label {
 
 .form-control {
     -webkit-user-select: initial;
-    background: rgba(0, 0, 0, .25);
+    background: rgba(0, 0, 0, .4);
     display: block;
     margin: 0 0 5px;
     width: 100%;
     border: none;
     height: 30px;
     line-height: 30px;
-    color: #eee;
+    color: #ccc;
     padding: 0 10px;
 }