fixed #9894 - incorrect background color for profiles with custom color schemes

This commit is contained in:
Eugene 2024-08-23 09:42:23 +02:00
parent ccb59c3eae
commit 3740166ace
No known key found for this signature in database
GPG key ID: 5896FCBBDD1CF4F4
3 changed files with 35 additions and 19 deletions

View file

@ -13,6 +13,7 @@ import { ResizeEvent, BaseTerminalProfile } from './interfaces'
import { TerminalDecorator } from './decorator'
import { SearchPanelComponent } from '../components/searchPanel.component'
import { MultifocusService } from '../services/multifocus.service'
import { getTerminalBackgroundColor } from '../helpers'
const INACTIVE_TAB_UNLOAD_DELAY = 1000 * 30
@ -575,14 +576,7 @@ export class BaseTerminalTabComponent<P extends BaseTerminalProfile> extends Bas
configure (): void {
this.frontend?.configure(this.profile)
if (!this.themes.findCurrentTheme().followsColorScheme && this.config.store.terminal.background === 'colorScheme') {
const scheme = this.profile.terminalColorScheme ?? this.config.store.terminal.colorScheme
if (scheme.background) {
this.backgroundColor = scheme.background
}
} else {
this.backgroundColor = null
}
this.backgroundColor = getTerminalBackgroundColor(this.config, this.themes, this.profile.terminalColorScheme)
}
zoomIn (): void {

View file

@ -1,3 +1,4 @@
import deepEqual from 'deep-equal'
import { BehaviorSubject, filter, firstValueFrom, takeUntil } from 'rxjs'
import { Injector } from '@angular/core'
import { ConfigService, getCSSFontFamily, getWindows10Build, HostAppService, HotkeysService, Platform, PlatformService, ThemesService } from 'tabby-core'
@ -11,9 +12,9 @@ import { Unicode11Addon } from '@xterm/addon-unicode11'
import { SerializeAddon } from '@xterm/addon-serialize'
import { ImageAddon } from '@xterm/addon-image'
import { CanvasAddon } from '@xterm/addon-canvas'
import './xterm.css'
import deepEqual from 'deep-equal'
import { BaseTerminalProfile, TerminalColorScheme } from '../api/interfaces'
import { getTerminalBackgroundColor } from '../helpers'
import './xterm.css'
const COLOR_NAMES = [
'black', 'red', 'green', 'yellow', 'blue', 'magenta', 'cyan', 'white',
@ -361,21 +362,21 @@ export class XTermFrontend extends Frontend {
}
private configureColors (scheme: TerminalColorScheme|undefined): void {
const config = this.configService.store
const appColorScheme = this.themes._getActiveColorScheme() as TerminalColorScheme
scheme = scheme ?? this.themes._getActiveColorScheme()
scheme = scheme ?? appColorScheme
const theme: ITheme = {
foreground: scheme!.foreground,
selectionBackground: scheme!.selection ?? '#88888888',
selectionForeground: scheme!.selectionForeground ?? undefined,
background: !this.themes.findCurrentTheme().followsColorScheme && config.terminal.background === 'colorScheme' ? scheme!.background : '#00000000',
cursor: scheme!.cursor,
cursorAccent: scheme!.cursorAccent,
foreground: scheme.foreground,
selectionBackground: scheme.selection ?? '#88888888',
selectionForeground: scheme.selectionForeground ?? undefined,
background: getTerminalBackgroundColor(this.configService, this.themes, scheme) ?? '#00000000',
cursor: scheme.cursor,
cursorAccent: scheme.cursorAccent,
}
for (let i = 0; i < COLOR_NAMES.length; i++) {
theme[COLOR_NAMES[i]] = scheme!.colors[i]
theme[COLOR_NAMES[i]] = scheme.colors[i]
}
if (!deepEqual(this.configuredTheme, theme)) {

View file

@ -0,0 +1,21 @@
import { TerminalColorScheme } from './api/interfaces'
import { ConfigService, ThemesService } from 'tabby-core'
export function getTerminalBackgroundColor (
config: ConfigService,
themes: ThemesService,
scheme?: TerminalColorScheme,
): string|null {
const appTheme = themes.findCurrentTheme()
const appColorScheme = themes._getActiveColorScheme() as TerminalColorScheme
// Use non transparent background when:
// - legacy theme and user choses colorScheme based BG
// - or new theme but profile-specific scheme is used
const shouldUseCSBackground =
!appTheme.followsColorScheme && config.store.terminal.background === 'colorScheme'
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
|| appTheme.followsColorScheme && scheme?.name !== appColorScheme.name
return shouldUseCSBackground && scheme ? scheme.background : null
}