fix: ui break when press tab key in keymap short name control (#816)
This commit is contained in:
committed by
László Monda
parent
404ccc7b2b
commit
2cbfc6a11e
@@ -1,5 +1,8 @@
|
||||
<div class="pull-right">
|
||||
<div class="alert alert-warning alert-dismissible" role="alert" [@slideInOut]="slideInOut">
|
||||
<div *ngIf="text"
|
||||
[@slideInOut]
|
||||
class="alert alert-warning alert-dismissible"
|
||||
role="alert">
|
||||
<button type="button"
|
||||
class="close"
|
||||
aria-label="Close"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
|
||||
import { animate, state, style, transition, trigger } from '@angular/animations';
|
||||
import { animate, style, transition, trigger } from '@angular/animations';
|
||||
|
||||
import { Notification } from 'uhk-common';
|
||||
|
||||
@@ -9,16 +9,17 @@ import { Notification } from 'uhk-common';
|
||||
styleUrls: ['./undoable-notifier.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
animations: [
|
||||
trigger('slideInOut', [
|
||||
state('in', style({
|
||||
transform: 'translate3d(0, 0, 0)'
|
||||
})),
|
||||
state('out', style({
|
||||
transform: 'translate3d(200%, 0, 0)'
|
||||
})),
|
||||
transition('in => out', animate('400ms ease-in-out')),
|
||||
transition('out => in', animate('400ms ease-in-out'))
|
||||
])
|
||||
trigger(
|
||||
'slideInOut', [
|
||||
transition(':enter', [
|
||||
style({transform: 'translateX(100%)'}),
|
||||
animate('400ms ease-in-out', style({transform: 'translateX(0)'}))
|
||||
]),
|
||||
transition(':leave', [
|
||||
style({transform: 'translateX(0)'}),
|
||||
animate('400ms ease-in-out', style({transform: 'translateX(100%)'}))
|
||||
])
|
||||
])
|
||||
]
|
||||
})
|
||||
export class UndoableNotifierComponent implements OnChanges {
|
||||
@@ -28,16 +29,14 @@ export class UndoableNotifierComponent implements OnChanges {
|
||||
@Output() close = new EventEmitter();
|
||||
@Output() undo = new EventEmitter();
|
||||
|
||||
get slideInOut() {
|
||||
return this.notification ? 'in' : 'out';
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
if (changes['notification']) {
|
||||
const not: Notification = changes['notification'].currentValue;
|
||||
if (not) {
|
||||
this.text = not.message;
|
||||
this.undoable = !!not.extra;
|
||||
} else {
|
||||
this.text = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user