From 1e85acb99e11ff3fa5b7f06c5964dc91c673c32e Mon Sep 17 00:00:00 2001 From: Eugene Pankov Date: Fri, 15 Apr 2022 12:27:48 +0200 Subject: [PATCH] fixed tab header animations, allow disabling animations globally #6147 --- tabby-core/src/components/appRoot.component.pug | 2 +- tabby-core/src/components/appRoot.component.ts | 12 ++++++------ tabby-core/src/configDefaults.yaml | 2 ++ .../src/components/hotkeyInputModal.component.pug | 6 +++++- .../src/components/hotkeyInputModal.component.ts | 3 ++- .../src/components/settingsTab.component.pug | 6 ++++++ tabby-ssh/src/components/sshTab.component.pug | 1 + .../src/components/baseTerminalTab.component.pug | 1 + 8 files changed, 24 insertions(+), 9 deletions(-) diff --git a/tabby-core/src/components/appRoot.component.pug b/tabby-core/src/components/appRoot.component.pug index b4869c96..d512d123 100644 --- a/tabby-core/src/components/appRoot.component.pug +++ b/tabby-core/src/components/appRoot.component.pug @@ -26,7 +26,7 @@ title-bar( [tab]='tab', [active]='tab == app.activeTab', @animateTab, - [@.disabled]='hasVerticalTabs()', + [@.disabled]='hasVerticalTabs() || !config.store.accessibility.animations', (click)='app.selectTab(tab)', [class.fully-draggable]='hostApp.platform != Platform.macOS', [class.drag-region]='hostApp.platform == Platform.macOS && !(app.tabDragActive$|async)', diff --git a/tabby-core/src/components/appRoot.component.ts b/tabby-core/src/components/appRoot.component.ts index 6fae8426..5cbccf13 100644 --- a/tabby-core/src/components/appRoot.component.ts +++ b/tabby-core/src/components/appRoot.component.ts @@ -25,8 +25,8 @@ import { AppService, FileTransfer, HostWindowService, PlatformService, ToolbarBu animations: [ trigger('animateTab', [ state('in', style({ - 'flex-basis': '200px', - width: '200px', + 'flex-basis': 'auto', + width: 'auto', })), transition(':enter', [ style({ @@ -34,14 +34,14 @@ import { AppService, FileTransfer, HostWindowService, PlatformService, ToolbarBu width: '1px', }), animate('250ms ease-in-out', style({ - 'flex-basis': '200px', - width: '200px', + 'flex-basis': 'auto', + width: 'auto', })), ]), transition(':leave', [ style({ - 'flex-basis': '200px', - width: '200px', + 'flex-basis': 'auto', + width: 'auto', }), animate('250ms ease-in-out', style({ 'flex-basis': '1px', diff --git a/tabby-core/src/configDefaults.yaml b/tabby-core/src/configDefaults.yaml index c0f032d7..823506e5 100644 --- a/tabby-core/src/configDefaults.yaml +++ b/tabby-core/src/configDefaults.yaml @@ -1,3 +1,5 @@ +accessibility: + animations: true appearance: dock: off dockScreen: current diff --git a/tabby-settings/src/components/hotkeyInputModal.component.pug b/tabby-settings/src/components/hotkeyInputModal.component.pug index da7c74f1..880484ea 100644 --- a/tabby-settings/src/components/hotkeyInputModal.component.pug +++ b/tabby-settings/src/components/hotkeyInputModal.component.pug @@ -3,7 +3,11 @@ .modal-body .input - .stroke(*ngFor='let stroke of value', [@animateKey]='true') {{stroke}} + .stroke( + *ngFor='let stroke of value', + [@animateKey]='true', + [@.disabled]='!config.store.accessibility.animations' + ) {{stroke}} .timeout div([style.width]='timeoutProgress + "%"') diff --git a/tabby-settings/src/components/hotkeyInputModal.component.ts b/tabby-settings/src/components/hotkeyInputModal.component.ts index a9b83a5c..492ace1b 100644 --- a/tabby-settings/src/components/hotkeyInputModal.component.ts +++ b/tabby-settings/src/components/hotkeyInputModal.component.ts @@ -1,7 +1,7 @@ import { Component, Input } from '@angular/core' import { trigger, transition, style, animate } from '@angular/animations' import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap' -import { HotkeysService, BaseComponent, Keystroke } from 'tabby-core' +import { HotkeysService, BaseComponent, Keystroke, ConfigService } from 'tabby-core' const INPUT_TIMEOUT = 1000 @@ -45,6 +45,7 @@ export class HotkeyInputModalComponent extends BaseComponent { constructor ( private modalInstance: NgbActiveModal, public hotkeys: HotkeysService, + public config: ConfigService, ) { super() this.hotkeys.clearCurrentKeystrokes() diff --git a/tabby-settings/src/components/settingsTab.component.pug b/tabby-settings/src/components/settingsTab.component.pug index 8740242e..b7e61e1d 100644 --- a/tabby-settings/src/components/settingsTab.component.pug +++ b/tabby-settings/src/components/settingsTab.component.pug @@ -105,6 +105,12 @@ i.fas.fa-bug span(translate) Open DevTools + h3(translate) Accessibility + .form-line + .header + .title(translate) Enable animations + toggle([(ngModel)]='config.store.accessibility.animations', (ngModelChange)='saveConfiguration()') + ng-container(*ngFor='let provider of settingsProviders') li(*ngIf='provider.prioritized', [ngbNavItem]='provider.id') a.d-flex.align-items-center(ngbNavLink) diff --git a/tabby-ssh/src/components/sshTab.component.pug b/tabby-ssh/src/components/sshTab.component.pug index 60af07ba..c626b019 100644 --- a/tabby-ssh/src/components/sshTab.component.pug +++ b/tabby-ssh/src/components/sshTab.component.pug @@ -36,6 +36,7 @@ terminal-toolbar([tab]='this') sftp-panel.bg-dark( @panelSlide, + [@.disabled]='!config.store.accessibility.animations' [(path)]='sftpPath', *ngIf='sftpPanelVisible', (click)='$event.stopPropagation()', diff --git a/tabby-terminal/src/components/baseTerminalTab.component.pug b/tabby-terminal/src/components/baseTerminalTab.component.pug index 84232b44..a4fd1e19 100644 --- a/tabby-terminal/src/components/baseTerminalTab.component.pug +++ b/tabby-terminal/src/components/baseTerminalTab.component.pug @@ -3,6 +3,7 @@ search-panel( *ngIf='showSearchPanel && hasFocus', @toolbarSlide, + [@.disabled]='!config.store.accessibility.animations' [frontend]='frontend', (close)='showSearchPanel = false; frontend?.cancelSearch()' )