ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-19 01:25:36 -05:00
Code Issues Packages Projects Releases Wiki Activity

apply css style at the right element (#14144)

Browse Source 
* apply css style at the right element

* make mergeCss protected
This commit is contained in:
Alan Ren
2021-02-03 10:27:12 -08:00
committed by GitHub
parent b390052c86
commit 52a642f351
26 changed files with 155 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/sql/workbench/browser/modelComponents/componentBase.ts
View File

@@ -86,17 +86,9 @@ export abstract class ComponentBase<TPropertyBag extends azdata.ComponentPropert
public refreshDataProvider(item: any): void {
}
public updateStyles(): void {
const element = (<HTMLElement>this._el.nativeElement);
for (const style in this.CSSStyles) {
element.style[style] = this.CSSStyles[style];
}
}
public setProperties(properties: { [key: string]: any; }): void {
properties = properties || {};
this.properties = properties;
this.updateStyles();
this.layout();
this.validate().catch(onUnexpectedError);
}
@@ -105,7 +97,6 @@ export abstract class ComponentBase<TPropertyBag extends azdata.ComponentPropert
public updateProperty(key: string, value: any): void {
if (key) {
this.properties[key] = value;
this.updateStyles();
this.layout();
this.validate().catch(onUnexpectedError);
}
@@ -209,12 +200,12 @@ export abstract class ComponentBase<TPropertyBag extends azdata.ComponentPropert
this.setPropertyFromUI<boolean>((props, value) => props.ariaHidden = value, newValue);
}
public get CSSStyles(): { [key: string]: string } {
return this.getPropertyOrDefault<{ [key: string]: string }>((props) => props.CSSStyles, {});
public get CSSStyles(): azdata.CssStyles {
return this.getPropertyOrDefault<azdata.CssStyles>((props) => props.CSSStyles, {});
}
public set CSSStyles(newValue: { [key: string]: string }) {
this.setPropertyFromUI<{ [key: string]: string }>((properties, CSSStyles) => { properties.CSSStyles = CSSStyles; }, newValue);
public set CSSStyles(newValue: azdata.CssStyles) {
this.setPropertyFromUI<azdata.CssStyles>((properties, CSSStyles) => { properties.CSSStyles = CSSStyles; }, newValue);
}
protected getWidth(): string {
@@ -274,6 +265,17 @@ export abstract class ComponentBase<TPropertyBag extends azdata.ComponentPropert
protected onkeydown(domNode: HTMLElement, listener: (e: StandardKeyboardEvent) => void): void {
this._register(addDisposableListener(domNode, EventType.KEY_DOWN, (e: KeyboardEvent) => listener(new StandardKeyboardEvent(e))));
}
protected mergeCss(...styles: azdata.CssStyles[]): azdata.CssStyles {
const x = styles.reduce((previous, current) => {
if (current) {
return Object.assign(previous, current);
}
return previous;
}, {});
return x;
}
}
export abstract class ContainerBase<T, TPropertyBag extends azdata.ComponentProperties = azdata.ComponentProperties> extends ComponentBase<TPropertyBag> {
@@ -389,17 +391,6 @@ export abstract class ContainerBase<T, TPropertyBag extends azdata.ComponentProp
return;
}
public mergeCss(...styles: azdata.CssStyles[]): azdata.CssStyles {
const x = styles.reduce((previous, current) => {
if (current) {
return Object.assign(previous, current);
}
return previous;
}, {});
return x;
}
protected onItemsUpdated(): void {
}