apply css style at the right element (#14144)

* 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

View File

@@ -9,7 +9,7 @@ import {
ElementRef, OnDestroy, AfterViewInit
} from '@angular/core';
import { FormLayout, FormItemLayout } from 'azdata';
import { FormLayout, FormItemLayout, CssStyles } from 'azdata';
import { ContainerBase } from 'sql/workbench/browser/modelComponents/componentBase';
import { IComponentDescriptor, IComponent, IModelStore } from 'sql/platform/dashboard/browser/interfaces';
@@ -36,7 +36,7 @@ class FormItem {
@Component({
template: `
<div #container *ngIf="items" class="form-table" [style.padding]="getFormPadding()" [style.width]="getFormWidth()" [style.height]="getFormHeight()" role="presentation">
<div #container [ngStyle]="CSSStyles" *ngIf="items" class="form-table" role="presentation">
<ng-container *ngFor="let item of items">
<div class="form-row" *ngIf="isGroupLabel(item)" [style.font-size]="getItemTitleFontSize(item)">
<div class="form-item-row form-group-label">
@@ -223,4 +223,12 @@ export default class FormContainer extends ContainerBase<FormItemLayout> impleme
public isVertical(item: FormItem): boolean {
return item && item.config && !item.config.horizontal;
}
public get CSSStyles(): CssStyles {
return this.mergeCss(super.CSSStyles, {
'padding': this.getFormPadding(),
'width': this.getFormWidth(),
'height': this.getFormHeight()
});
}
}