web/app/project/settings-dialog/settings-dialog.component.html
<fci-master-detail-card>
<!-- Master Content -->
<div fci-master>
<div class="fci-master-section-header">Project settings</div>
<div class="fci-master-section-label" *ngFor="let section of masterSections()" [class.fci-master-section-selected]="selectedSection === section"
(click)="selectSection(section)">
{{MASTER_SECTION_LABELS_MAP.get(section)}}
</div>
</div>
<!-- Detail Content -->
<div fci-detail class="fci-detail-container">
<ng-container [ngSwitch]="selectedSection">
<form *ngSwitchCase="MasterSection.GENERAL" [formGroup]="generalForm" class="fci-general-form">
<h3>General
<i>(not editable yet)</i>
</h3>
<mat-form-field>
<input matInput placeholder="Project name" formControlName="name">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Lane to run" formControlName="lane">
</mat-form-field>
<div class="fci-button-container">
<button mat-button (click)="closeDialog()" type="button">Close</button>
<button mat-raised-button color="primary" type="submit" [disabled]="!generalForm.valid">Done</button>
</div>
</form>
</ng-container>
</div>
</fci-master-detail-card>