UI: fixed timeseries chart widget threshold settings styles

This commit is contained in:
rusikv 2024-04-03 13:15:05 +03:00
parent b276d5e3da
commit cc990d4ff3
2 changed files with 9 additions and 9 deletions

View File

@ -98,10 +98,10 @@
<input matInput type="number" formControlName="lineWidth" min="0" step="1" placeholder="{{ 'widget-config.set' | translate }}"/> <input matInput type="number" formControlName="lineWidth" min="0" step="1" placeholder="{{ 'widget-config.set' | translate }}"/>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="tb-form-row space-between column-xs"> <div class="tb-form-row column-xs">
<div translate>widgets.time-series-chart.threshold.start-symbol</div> <div translate>widgets.time-series-chart.threshold.start-symbol</div>
<div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px"> <div class="tb-flex row flex-end">
<mat-form-field class="flex" appearance="outline" subscriptSizing="dynamic"> <mat-form-field class="medium-width" fxFlex.lt-md appearance="outline" subscriptSizing="dynamic">
<mat-select formControlName="startSymbol"> <mat-select formControlName="startSymbol">
<mat-option *ngFor="let shape of echartsShapes" [value]="shape"> <mat-option *ngFor="let shape of echartsShapes" [value]="shape">
{{ echartsShapeTranslations.get(shape) | translate }} {{ echartsShapeTranslations.get(shape) | translate }}
@ -109,16 +109,16 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<div class="tb-small-label" translate>widgets.time-series-chart.threshold.symbol-size</div> <div class="tb-small-label" translate>widgets.time-series-chart.threshold.symbol-size</div>
<mat-form-field appearance="outline" class="number flex" subscriptSizing="dynamic"> <mat-form-field appearance="outline" class="number fixed-width" subscriptSizing="dynamic">
<input matInput formControlName="startSymbolSize" <input matInput formControlName="startSymbolSize"
type="number" min="0" step="1" placeholder="{{ 'widget-config.set' | translate }}"> type="number" min="0" step="1" placeholder="{{ 'widget-config.set' | translate }}">
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
<div class="tb-form-row space-between column-xs"> <div class="tb-form-row column-xs">
<div translate>widgets.time-series-chart.threshold.end-symbol</div> <div translate>widgets.time-series-chart.threshold.end-symbol</div>
<div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px"> <div class="tb-flex row flex-end">
<mat-form-field class="flex" appearance="outline" subscriptSizing="dynamic"> <mat-form-field class="medium-width" fxFlex.lt-md appearance="outline" subscriptSizing="dynamic">
<mat-select formControlName="endSymbol"> <mat-select formControlName="endSymbol">
<mat-option *ngFor="let shape of echartsShapes" [value]="shape"> <mat-option *ngFor="let shape of echartsShapes" [value]="shape">
{{ echartsShapeTranslations.get(shape) | translate }} {{ echartsShapeTranslations.get(shape) | translate }}
@ -126,7 +126,7 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<div class="tb-small-label" translate>widgets.time-series-chart.threshold.symbol-size</div> <div class="tb-small-label" translate>widgets.time-series-chart.threshold.symbol-size</div>
<mat-form-field appearance="outline" class="number flex" subscriptSizing="dynamic"> <mat-form-field appearance="outline" class="number fixed-width" subscriptSizing="dynamic">
<input matInput formControlName="endSymbolSize" <input matInput formControlName="endSymbolSize"
type="number" min="0" step="1" placeholder="{{ 'widget-config.set' | translate }}"> type="number" min="0" step="1" placeholder="{{ 'widget-config.set' | translate }}">
</mat-form-field> </mat-form-field>

View File

@ -16,7 +16,7 @@
@import '../../../../../../../../../scss/constants'; @import '../../../../../../../../../scss/constants';
.tb-threshold-settings-panel { .tb-threshold-settings-panel {
width: 530px; width: 540px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 16px; gap: 16px;