mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-17 17:22:42 -05:00
align with portal button style (#14187)
* align with portal button style * fix welcome page * image button * more fixes * use withProperties * add comment back * add border radius
This commit is contained in:
@@ -4,11 +4,9 @@
|
||||
*--------------------------------------------------------------------------------------------*/
|
||||
|
||||
import { Button as vsButton, IButtonOptions, IButtonStyles as vsIButtonStyles } from 'vs/base/browser/ui/button/button';
|
||||
import * as DOM from 'vs/base/browser/dom';
|
||||
import { Color } from 'vs/base/common/color';
|
||||
|
||||
export interface IButtonStyles extends vsIButtonStyles {
|
||||
buttonFocusOutline?: Color;
|
||||
}
|
||||
|
||||
export class Button extends vsButton {
|
||||
@@ -16,32 +14,6 @@ export class Button extends vsButton {
|
||||
|
||||
constructor(container: HTMLElement, options?: IButtonOptions) {
|
||||
super(container, options);
|
||||
|
||||
this._register(DOM.addDisposableListener(this.element, DOM.EventType.FOCUS, () => {
|
||||
this.element.style.outlineColor = this.buttonFocusOutline ? this.buttonFocusOutline.toString() : '';
|
||||
this.element.style.outlineWidth = '1px';
|
||||
}));
|
||||
|
||||
this._register(DOM.addDisposableListener(this.element, DOM.EventType.MOUSE_DOWN, e => {
|
||||
if (!DOM.hasClass(this.element, 'disabled') && e.button === 0) {
|
||||
this.element.classList.add('active');
|
||||
}
|
||||
}));
|
||||
|
||||
this._register(DOM.addDisposableListener(this.element, DOM.EventType.MOUSE_UP, e => {
|
||||
DOM.EventHelper.stop(e);
|
||||
this.element.classList.remove('active');
|
||||
}));
|
||||
|
||||
this._register(DOM.addDisposableListener(this.element, DOM.EventType.MOUSE_LEAVE, e => {
|
||||
DOM.EventHelper.stop(e);
|
||||
this.element.classList.remove('active');
|
||||
}));
|
||||
}
|
||||
|
||||
public style(styles: IButtonStyles): void {
|
||||
super.style(styles);
|
||||
this.buttonFocusOutline = styles.buttonFocusOutline;
|
||||
}
|
||||
|
||||
public set title(value: string) {
|
||||
|
||||
@@ -22,7 +22,7 @@ export interface CommandEventArgs<T extends Slick.SlickData> {
|
||||
|
||||
export class HeaderFilter<T extends Slick.SlickData> {
|
||||
|
||||
public onFilterApplied = new Slick.Event<{ grid: Slick.Grid<T>, column: IExtendedColumn<T>}>();
|
||||
public onFilterApplied = new Slick.Event<{ grid: Slick.Grid<T>, column: IExtendedColumn<T> }>();
|
||||
public onCommand = new Slick.Event<CommandEventArgs<T>>();
|
||||
|
||||
private grid!: Slick.Grid<T>;
|
||||
@@ -221,7 +221,7 @@ export class HeaderFilter<T extends Slick.SlickData> {
|
||||
this.handleApply(ev, this.columnDef);
|
||||
});
|
||||
|
||||
this.clearButton = new Button(this.$menu.get(0));
|
||||
this.clearButton = new Button(this.$menu.get(0), { secondary: true });
|
||||
this.clearButton.label = localize('headerFilter.clear', "Clear");
|
||||
this.clearButton.title = localize('headerFilter.clear', "Clear");
|
||||
this.clearButton.element.id = 'filter-clear-button';
|
||||
@@ -232,7 +232,7 @@ export class HeaderFilter<T extends Slick.SlickData> {
|
||||
this.handleApply(ev, this.columnDef);
|
||||
});
|
||||
|
||||
this.cancelButton = new Button(this.$menu.get(0));
|
||||
this.cancelButton = new Button(this.$menu.get(0), { secondary: true });
|
||||
this.cancelButton.label = localize('headerFilter.cancel', "Cancel");
|
||||
this.cancelButton.title = localize('headerFilter.cancel', "Cancel");
|
||||
this.cancelButton.element.id = 'filter-cancel-button';
|
||||
|
||||
Reference in New Issue
Block a user