mirror of
https://github.com/Eugeny/tabby.git
synced 2025-08-07 01:41:56 +00:00
Compare commits
5 Commits
Author | SHA1 | Date | |
---|---|---|---|
![]() |
2a8b7c3e79 | ||
![]() |
9a6e684f9e | ||
![]() |
1ebf29a977 | ||
![]() |
0cd856b51f | ||
![]() |
307b4ea266 |
@@ -37,14 +37,12 @@ title-bar(
|
||||
|
||||
.btn-group.background
|
||||
.d-flex(
|
||||
*ngFor='let button of leftToolbarButtons',
|
||||
ngbDropdown
|
||||
*ngFor='let button of leftToolbarButtons'
|
||||
)
|
||||
button.btn.btn-secondary.btn-tab-bar(
|
||||
[title]='button.label',
|
||||
(click)='button.run && button.run()',
|
||||
[fastHtmlBind]='button.icon',
|
||||
ngbDropdownToggle,
|
||||
[fastHtmlBind]='button.icon'
|
||||
)
|
||||
|
||||
.d-flex(
|
||||
@@ -67,14 +65,12 @@ title-bar(
|
||||
|
||||
.btn-group.background
|
||||
.d-flex(
|
||||
*ngFor='let button of rightToolbarButtons',
|
||||
ngbDropdown
|
||||
*ngFor='let button of rightToolbarButtons'
|
||||
)
|
||||
button.btn.btn-secondary.btn-tab-bar(
|
||||
[title]='button.label',
|
||||
(click)='button.run && button.run()',
|
||||
[fastHtmlBind]='button.icon',
|
||||
ngbDropdownToggle,
|
||||
[fastHtmlBind]='button.icon'
|
||||
)
|
||||
|
||||
button.btn.btn-secondary.btn-tab-bar.btn-update(
|
||||
|
@@ -24,3 +24,7 @@
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
::ng-deep .no-animations split-tab > .child {
|
||||
transition: none;
|
||||
}
|
||||
|
@@ -26,9 +26,9 @@ export class ThemesService {
|
||||
this.applyThemeVariables()
|
||||
config.changed$.subscribe(() => {
|
||||
this.applyCurrentTheme()
|
||||
this.applyThemeVariables()
|
||||
})
|
||||
})
|
||||
config.changed$.subscribe(() => this.applyThemeVariables())
|
||||
}
|
||||
|
||||
private applyThemeVariables () {
|
||||
@@ -62,6 +62,7 @@ export class ThemesService {
|
||||
// const backgroundMore =more(theme.background, 0.25).string()
|
||||
const accentIndex = 4
|
||||
const vars: Record<string, string> = {}
|
||||
const contrastPairs: string[][] = []
|
||||
|
||||
if (this.findCurrentTheme().followsColorScheme) {
|
||||
vars['--bs-body-bg'] = background.string()
|
||||
@@ -82,6 +83,8 @@ export class ThemesService {
|
||||
// vars['--bs-purple'] = theme.colors[13]
|
||||
// vars['--bs-cyan'] = theme.colors[14]
|
||||
|
||||
contrastPairs.push(['--bs-body-bg', '--bs-body-color'])
|
||||
|
||||
vars['--theme-fg-more-2'] = more(theme.foreground, 0.5).string()
|
||||
vars['--theme-fg-more'] = more(theme.foreground, 0.25).string()
|
||||
vars['--theme-fg'] = theme.foreground
|
||||
@@ -94,6 +97,12 @@ export class ThemesService {
|
||||
vars['--theme-bg-more'] = backgroundMore
|
||||
vars['--theme-bg-more-2'] = more(backgroundMore, 0.25).string()
|
||||
|
||||
contrastPairs.push(['--theme-bg', '--theme-fg'])
|
||||
contrastPairs.push(['--theme-bg-less', '--theme-fg-less'])
|
||||
contrastPairs.push(['--theme-bg-less-2', '--theme-fg-less-2'])
|
||||
contrastPairs.push(['--theme-bg-more', '--theme-fg-more'])
|
||||
contrastPairs.push(['--theme-bg-more-2', '--theme-fg-more-2'])
|
||||
|
||||
const themeColors = {
|
||||
primary: theme.colors[accentIndex],
|
||||
secondary: theme.colors[8],
|
||||
@@ -117,6 +126,9 @@ export class ThemesService {
|
||||
vars[`--theme-${key}`] = color
|
||||
vars[`--theme-${key}-less`] = less(color, 0.25).string()
|
||||
vars[`--theme-${key}-less-2`] = less(color, 0.75).string()
|
||||
vars[`--theme-${key}-fg`] = more(color, 1).string()
|
||||
|
||||
contrastPairs.push([`--theme-${key}`, `--theme-${key}-fg`])
|
||||
}
|
||||
|
||||
const switchBackground = less(theme.colors[accentIndex], 0.25).string()
|
||||
@@ -125,9 +137,29 @@ export class ThemesService {
|
||||
|
||||
vars['--spaciness'] = this.config.store.appearance.spaciness
|
||||
|
||||
for (const [bg, fg] of contrastPairs) {
|
||||
const colorBg = Color(vars[bg]).hsl()
|
||||
const colorFg = Color(vars[fg]).hsl()
|
||||
const bgContrast = colorBg.contrast(colorFg)
|
||||
const isLightBG = colorBg.luminosity() > colorFg.luminosity()
|
||||
if (bgContrast < this.config.store.terminal.minimumContrastRatio) {
|
||||
const targetLuminosityDarkFG = (colorBg.luminosity() + 0.05) / this.config.store.terminal.minimumContrastRatio - 0.05
|
||||
const targetLuminosityLightFG = (colorBg.luminosity() + 0.05) * this.config.store.terminal.minimumContrastRatio - 0.05
|
||||
|
||||
let candidateLuminosities = isLightBG ? [targetLuminosityDarkFG, targetLuminosityLightFG] : [targetLuminosityLightFG, targetLuminosityDarkFG]
|
||||
candidateLuminosities = candidateLuminosities.map(x => Math.max(0, Math.min(1, x)))
|
||||
const targetLuminosity = candidateLuminosities.reduce((a, b) => Math.abs(b - colorBg.luminosity()) < Math.abs(a - colorBg.luminosity()) ? a : b, colorFg.color[2] / 100)
|
||||
|
||||
colorFg.color[2] = targetLuminosity * 100
|
||||
vars[fg] = colorFg
|
||||
}
|
||||
}
|
||||
|
||||
for (const [key, value] of Object.entries(vars)) {
|
||||
document.documentElement.style.setProperty(key, value)
|
||||
}
|
||||
|
||||
document.body.classList.toggle('no-animations', !this.config.store.accessibility.animations)
|
||||
}
|
||||
|
||||
findTheme (name: string): Theme|null {
|
||||
|
@@ -195,14 +195,14 @@ tab-body {
|
||||
--bs-btn-focus-shadow-rgb: 130, 138, 145;
|
||||
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
|
||||
--bs-btn-color: var(--theme-#{$color}-more-2);
|
||||
--bs-btn-hover-color: var(--theme-#{$color}-more-2);
|
||||
--bs-btn-active-color: var(--theme-#{$color}-more-2);
|
||||
--bs-btn-disabled-color: var(--theme-#{$color}-more-2);
|
||||
--bs-btn-color: var(--theme-#{$color}-fg);
|
||||
--bs-btn-hover-color: var(--theme-#{$color}-fg);
|
||||
--bs-btn-active-color: var(--theme-#{$color}-fg);
|
||||
--bs-btn-disabled-color: var(--theme-#{$color}-fg);
|
||||
}
|
||||
|
||||
.alert-#{$color} {
|
||||
--bs-alert-bg: var(--theme-#{$color}-more-2);
|
||||
--bs-alert-bg: var(--theme-#{$color}-fg);
|
||||
--bs-alert-border-color: var(--theme-#{$color}-more);
|
||||
--bs-alert-color: var(--theme-#{$color});
|
||||
}
|
||||
|
@@ -24,7 +24,7 @@
|
||||
"electron-promise-ipc": "^2.2.4",
|
||||
"ps-node": "^0.1.6",
|
||||
"tmp-promise": "^3.0.2",
|
||||
"hasbin": "^1.2.3",
|
||||
"which": "^3.0.0",
|
||||
"winston": "^3.3.3"
|
||||
}
|
||||
}
|
||||
|
@@ -1,6 +1,6 @@
|
||||
import * as path from 'path'
|
||||
import * as fs from 'fs/promises'
|
||||
import hasbin from 'hasbin'
|
||||
import * as which from 'which'
|
||||
import { Injectable } from '@angular/core'
|
||||
import { HostAppService, Platform, ConfigService } from 'tabby-core'
|
||||
import { ElectronService } from '../services/electron.service'
|
||||
@@ -73,7 +73,7 @@ export class WindowsStockShellsProvider extends WindowsBaseShellProvider {
|
||||
|
||||
private async getPowerShellPath () {
|
||||
for (const name of ['pwsh.exe', 'powershell.exe']) {
|
||||
if (await new Promise(resolve => hasbin(name, resolve))) {
|
||||
if (await which(name, { nothrow: true })) {
|
||||
return name
|
||||
}
|
||||
}
|
||||
|
@@ -21,11 +21,6 @@ async@^3.2.3:
|
||||
resolved "https://registry.yarnpkg.com/async/-/async-3.2.3.tgz#ac53dafd3f4720ee9e8a160628f18ea91df196c9"
|
||||
integrity sha512-spZRyzKL5l5BZQrr/6m/SqFdBN0q3OCI0f9rjfBzCMBIP4p75P620rR3gTmaksNOhmzgdxcaxdNfMy6anrbM0g==
|
||||
|
||||
async@~1.5:
|
||||
version "1.5.2"
|
||||
resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
|
||||
integrity sha512-nSVgobk4rv61R9PUSDtYt7mPVB2olxNR5RWJcAsH676/ef11bUZwvu7+RGYrYauVdDPcO519v68wRhXQtxsV9w==
|
||||
|
||||
balanced-match@^1.0.0:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
|
||||
@@ -209,13 +204,6 @@ has@^1.0.3:
|
||||
dependencies:
|
||||
function-bind "^1.1.1"
|
||||
|
||||
hasbin@^1.2.3:
|
||||
version "1.2.3"
|
||||
resolved "https://registry.yarnpkg.com/hasbin/-/hasbin-1.2.3.tgz#78c5926893c80215c2b568ae1fd3fcab7a2696b0"
|
||||
integrity sha512-CCd8e/w2w28G8DyZvKgiHnQJ/5XXDz6qiUHnthvtag/6T5acUeN5lqq+HMoBqcmgWueWDhiCplrw0Kb1zDACRg==
|
||||
dependencies:
|
||||
async "~1.5"
|
||||
|
||||
inflight@^1.0.4:
|
||||
version "1.0.6"
|
||||
resolved "https://registry.yarnpkg.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9"
|
||||
@@ -296,6 +284,11 @@ is-symbol@^1.0.2, is-symbol@^1.0.3:
|
||||
dependencies:
|
||||
has-symbols "^1.0.2"
|
||||
|
||||
isexe@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10"
|
||||
integrity sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==
|
||||
|
||||
kuler@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/kuler/-/kuler-2.0.0.tgz#e2c570a3800388fb44407e851531c1d670b061b3"
|
||||
@@ -515,6 +508,13 @@ which-boxed-primitive@^1.0.2:
|
||||
is-string "^1.0.5"
|
||||
is-symbol "^1.0.3"
|
||||
|
||||
which@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/which/-/which-3.0.0.tgz#a9efd016db59728758a390d23f1687b6e8f59f8e"
|
||||
integrity sha512-nla//68K9NU6yRiwDY/Q8aU6siKlSs64aEC7+IV56QoAuyQT2ovsJcgGYGyqMOmI/CGN1BOR6mM5EN0FBO+zyQ==
|
||||
dependencies:
|
||||
isexe "^2.0.0"
|
||||
|
||||
winston-transport@^4.5.0:
|
||||
version "4.5.0"
|
||||
resolved "https://registry.yarnpkg.com/winston-transport/-/winston-transport-4.5.0.tgz#6e7b0dd04d393171ed5e4e4905db265f7ab384fa"
|
||||
|
@@ -114,6 +114,18 @@
|
||||
.title(translate) Enable animations
|
||||
toggle([(ngModel)]='config.store.accessibility.animations', (ngModelChange)='saveConfiguration()')
|
||||
|
||||
.form-line
|
||||
.header
|
||||
.title(translate) Minimum contrast ratio
|
||||
input.form-control(
|
||||
type='number',
|
||||
min='1',
|
||||
max='21',
|
||||
step='0.5',
|
||||
[(ngModel)]='config.store.terminal.minimumContrastRatio',
|
||||
(ngModelChange)='config.save()'
|
||||
)
|
||||
|
||||
ng-container(*ngFor='let provider of settingsProviders')
|
||||
li(*ngIf='provider.prioritized', [ngbNavItem]='provider.id')
|
||||
a.d-flex.align-items-center(ngbNavLink)
|
||||
|
Reference in New Issue
Block a user