Update form layout defaults to match design (#1878)

This commit is contained in:
Matt Irvine
2018-07-10 13:45:36 -07:00
committed by GitHub
parent d51a7a9eb7
commit 0b1e9c7c66
2 changed files with 10 additions and 9 deletions

View File

@@ -45,7 +45,7 @@ class FormItem {
template: ` template: `
<div #container *ngIf="items" class="form-table" [style.padding]="getFormPadding()" [style.width]="getFormWidth()" [style.height]="getFormHeight()"> <div #container *ngIf="items" class="form-table" [style.padding]="getFormPadding()" [style.width]="getFormWidth()" [style.height]="getFormHeight()">
<ng-container *ngFor="let item of items"> <ng-container *ngFor="let item of items">
<div class="form-row" *ngIf="isGroupLabel(item)"> <div class="form-row" *ngIf="isGroupLabel(item)" [style.font-size]="getItemTitleFontSize(item)">
<div class="form-item-row form-group-label"> <div class="form-item-row form-group-label">
<model-component-wrapper [descriptor]="item.descriptor" [modelStore]="modelStore"> <model-component-wrapper [descriptor]="item.descriptor" [modelStore]="modelStore">
</model-component-wrapper> </model-component-wrapper>
@@ -179,8 +179,12 @@ export default class FormContainer extends ContainerBase<FormItemLayout> impleme
} }
private getItemTitleFontSize(item: FormItem): string { private getItemTitleFontSize(item: FormItem): string {
let defaultFontSize = '14px';
if (this.isInGroup(item)) {
defaultFontSize = '12px';
}
let itemConfig = item.config; let itemConfig = item.config;
return itemConfig && itemConfig.titleFontSize ? this.convertSize(itemConfig.titleFontSize, '11px') : '11px'; return itemConfig && itemConfig.titleFontSize ? this.convertSize(itemConfig.titleFontSize, defaultFontSize) : defaultFontSize;
} }
private getActionComponents(item: FormItem): FormItem[] { private getActionComponents(item: FormItem): FormItem[] {

View File

@@ -18,7 +18,7 @@
} }
.form-vertical-container { .form-vertical-container {
padding-bottom: 15px; padding-bottom: 5px;
width: 100%; width: 100%;
} }
@@ -57,11 +57,8 @@
display: table-cell; display: table-cell;
} }
.form-group-item .form-item-row,
.form-group-item.form-cell {
padding-left: 30px;
}
.form-group-label { .form-group-label {
padding-top: 3px;
padding-bottom: 0px; padding-bottom: 0px;
font-weight: bold;
} }