.

app/src/api/defaultTabProvider.ts

@@ -0,0 +1,3 @@
+export abstract class DefaultTabProvider {
+    abstract open (): void
+}

app/src/api/index.ts

@@ -3,6 +3,7 @@ export { TabRecoveryProvider } from './tabRecovery'
 export { ToolbarButtonProvider, IToolbarButton } from './toolbarButtonProvider'
 export { ConfigProvider } from './configProvider'
 export { HotkeyProvider, IHotkeyDescription } from './hotkeyProvider'
+export { DefaultTabProvider } from './defaultTabProvider'
 
 export { AppService } from 'services/app'
 export { ConfigService } from 'services/config'

app/src/components/appRoot.pug

@@ -40,9 +40,6 @@ title-bar(*ngIf='!config.full().appearance.useNativeFrame && config.store.appear
             [class.scrollable]='tab.scrollable',
         )
 
-    // TODO
-    //hotkey-hint
-
 toaster-container([toasterconfig]="toasterconfig")
 ng-template(ngbModalContainer)
 

app/src/components/appRoot.ts

@@ -101,8 +101,6 @@ export class AppRootComponent {
         this.hotkeys.globalHotkey.subscribe(() => {
             this.onGlobalHotkey()
         })
-
-        this.app.restoreTabs()
     }
 
     onGlobalHotkey () {
@@ -132,19 +130,11 @@ export class AppRootComponent {
 
     getRightToolbarButtons (): IToolbarButton[] { return this.getToolbarButtons(true) }
 
-    ngOnInit () {
-        /*
-        this.sessions.recoverAll().then((recoveredSessions) => {
-            if (recoveredSessions.length > 0) {
-                recoveredSessions.forEach((session) => {
-                    this.addTerminalTab(session)
-                })
-            } else {
-                // this.newTab()
-                this.showSettings();
+    async ngOnInit () {
+        await this.app.restoreTabs()
+        if (this.app.tabs.length == 0) {
+            this.app.openDefaultTab()
         }
-        })
-        */
     }
 
     private getToolbarButtons (aboveZero: boolean): IToolbarButton[] {

app/src/overrides.scss

@@ -0,0 +1,3 @@
+.form-group label {
+    margin-bottom: 2px;
+}

app/src/services/app.ts

@@ -2,6 +2,7 @@ import { Inject, Injectable } from '@angular/core'
 import { Logger, LogService } from 'services/log'
 import { Tab } from 'api/tab'
 import { TabRecoveryProvider } from 'api/tabRecovery'
+import { DefaultTabProvider } from 'api/defaultTabProvider'
 
 
 @Injectable()
@@ -13,6 +14,7 @@ export class AppService {
 
     constructor (
         @Inject(TabRecoveryProvider) private tabRecoveryProviders: TabRecoveryProvider[],
+        private defaultTabProvider: DefaultTabProvider,
         log: LogService,
     ) {
         this.logger = log.create('app')
@@ -24,6 +26,10 @@ export class AppService {
         this.saveTabs()
     }
 
+    openDefaultTab (): void {
+
+    }
+
     selectTab (tab) {
         if (this.tabs.includes(this.activeTab)) {
             this.lastTabIndex = this.tabs.indexOf(this.activeTab)

app/src/settings/components/hotkeyHint.less

@@ -1,7 +0,0 @@
-:host {
-    display: block;
-
-    .line {
-        padding: 3px 10px;
-    }
-}

app/src/settings/components/hotkeyHint.pug

@@ -1,4 +0,0 @@
-.body(*ngIf='partialHotkeyMatches?.length > 0')
-    .line(*ngFor='let match of partialHotkeyMatches; trackBy: trackByFn', @animateLine)
-        hotkey-display([model]='match.strokes')
-        span {{ hotkeys.getHotkeyDescription(match.id).name }}

app/src/settings/components/hotkeyHint.ts

@@ -1,70 +0,0 @@
-import { Component, Input, trigger, style, animate, transition, state } from '@angular/core'
-import { HotkeysService, PartialHotkeyMatch } from 'services/hotkeys'
-
-
-@Component({
-  selector: 'hotkey-hint',
-  template: require('./hotkeyHint.pug'),
-  styles: [require('./hotkeyHint.less')],
-  //changeDetection: ChangeDetectionStrategy.OnPush,
-  animations: [
-      trigger('animateLine', [
-          state('in', style({
-              'transform': 'translateX(0)',
-              'opacity': '1',
-          })),
-          transition(':enter', [
-              style({
-                  'transform': 'translateX(25px)',
-                  'opacity': '0',
-              }),
-              animate('250ms ease-out')
-          ]),
-          transition(':leave', [
-              style({'height': '*'}),
-              animate('250ms ease-in', style({
-                  'transform': 'translateX(25px)',
-                  'opacity': '0',
-                  'height': '0',
-              }))
-          ])
-      ])
-  ]
-})
-export class HotkeyHintComponent {
-    @Input() partialHotkeyMatches: PartialHotkeyMatch[]
-    private keyTimeoutInterval: number = null
-
-    constructor (
-        public hotkeys: HotkeysService,
-    ) {
-        this.hotkeys.key.subscribe(() => {
-            //console.log('Keystrokes', this.hotkeys.getCurrentKeystrokes())
-            let partialMatches = this.hotkeys.getCurrentPartiallyMatchedHotkeys()
-            if (partialMatches.length > 0) {
-                //console.log('Partial matches:', partialMatches)
-                this.setMatches(partialMatches)
-
-                if (this.keyTimeoutInterval == null) {
-                    this.keyTimeoutInterval = window.setInterval(() => {
-                        if (this.hotkeys.getCurrentPartiallyMatchedHotkeys().length == 0) {
-                            clearInterval(this.keyTimeoutInterval)
-                            this.keyTimeoutInterval = null
-                            this.setMatches(null)
-                        }
-                    }, 500)
-                }
-            } else {
-                this.setMatches(null)
-            }
-        })
-    }
-
-    setMatches (matches: PartialHotkeyMatch[]) {
-        this.partialHotkeyMatches = matches
-    }
-
-    trackByFn (_, item) {
-        return item && item.id
-    }
-}

app/src/settings/index.ts

@@ -5,7 +5,6 @@ import { NgbModule } from '@ng-bootstrap/ng-bootstrap'
 
 import { HotkeyInputComponent } from './components/hotkeyInput'
 import { HotkeyDisplayComponent } from './components/hotkeyDisplay'
-import { HotkeyHintComponent } from './components/hotkeyHint'
 import { HotkeyInputModalComponent } from './components/hotkeyInputModal'
 import { MultiHotkeyInputComponent } from './components/multiHotkeyInput'
 import { SettingsPaneComponent } from './components/settingsPane'
@@ -33,7 +32,6 @@ import { RecoveryProvider } from './recoveryProvider'
     ],
     declarations: [
         HotkeyDisplayComponent,
-        HotkeyHintComponent,
         HotkeyInputComponent,
         HotkeyInputModalComponent,
         MultiHotkeyInputComponent,

app/src/terminal/components/settings.pug

@@ -5,7 +5,7 @@
             .appearance-preview(
                 [style.font-family]='config.full().terminal.font',
                 [style.font-size]='config.full().terminal.fontSize + "px"',
-                [style.background-color]='config.full().terminal.colorScheme.background',
+                [style.background-color]='(config.full().terminal.background == "theme") ? null : config.full().terminal.colorScheme.background',
                 [style.color]='config.full().terminal.colorScheme.foreground',
             )
                 div 
@@ -74,6 +74,26 @@
             )
                 option(*ngFor='let scheme of colorSchemes', [ngValue]='scheme') {{scheme.name}}
 
+        .form-group
+            label Terminal background
+            div(
+                '[(ngModel)]'='config.store.terminal.background',
+                (ngModelChange)='config.save()',
+                ngbRadioGroup
+            )
+                label.btn.btn-secondary
+                    input(
+                        type='radio',
+                        [value]='"theme"'
+                    )
+                    | From the app theme
+                label.btn.btn-secondary
+                    input(
+                        type='radio',
+                        [value]='"colorScheme"'
+                    )
+                    | From the terminal colors
+
         .form-group
             label Terminal bell
             br

app/src/terminal/components/terminalTab.ts

@@ -169,9 +169,14 @@ export class TerminalTabComponent extends BaseTabComponent<TerminalTab> {
         if (config.terminal.colorScheme.foreground) {
             preferenceManager.set('foreground-color', config.terminal.colorScheme.foreground)
         }
+        if (config.terminal.background == 'colorScheme') {
             if (config.terminal.colorScheme.background) {
-            preferenceManager.set('background-color', config.terminal.colorScheme.background)
                 this.backgroundColor = config.terminal.colorScheme.background
+                preferenceManager.set('background-color', config.terminal.colorScheme.background)
+            }
+        } else {
+            this.backgroundColor = null
+            preferenceManager.set('background-color', 'transparent')
         }
         if (config.terminal.colorScheme.colors) {
             preferenceManager.set('color-palette-overrides', config.terminal.colorScheme.colors)

app/src/terminal/config.ts

@@ -8,6 +8,7 @@ export class TerminalConfigProvider extends ConfigProvider {
             fontSize: 14,
             bell: 'off',
             bracketedPaste: true,
+            background: 'theme',
             colorScheme: {
                 foreground: null,
                 background: null,

app/src/theme.scss

@@ -85,7 +85,7 @@ title-bar {
 }
 
 
-app-root .content {
+app-root > .content {
     background: $body-bg2;
 
     .tabs {