tvolkmann/travopti
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

further improvements for search ui

Browse Source
This commit is contained in:
Timo Volkmann 2020-06-25 21:34:01 +02:00
parent f2c7aec2d3
commit 8161f62ce0
2 changed files with 33 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
frontend/src/app/components/search-input/search-input.component.html
View File

@ -25,16 +25,18 @@
<!-- Multi presets -->
<mat-step>
<ng-template matStepLabel>Which climate do you prefer?</ng-template>
<div *ngFor="let key of multiPresetsKeys" class="sub-group">
<span class="label">{{key|translate}}:</span><br>
<mat-radio-group [ngModel]="multiPresetSelection[key]" [value]="undefined">
<mat-radio-button
#btn
(click)="btn.checked = onMultiPresetSelect(preset)"
*ngFor="let preset of multiPresets.get(key)"
[value]="preset.preset_id"
>{{preset.tag_label|translate}}</mat-radio-button>
</mat-radio-group>
<div class="flexer">
<div *ngFor="let key of multiPresetsKeys" class="sub-group">
<span class="label">{{key|translate}}:</span><br>
<mat-radio-group [ngModel]="multiPresetSelection[key]" [value]="undefined">
<mat-radio-button
#btn
(click)="btn.checked = onMultiPresetSelect(preset)"
*ngFor="let preset of multiPresets.get(key)"
[value]="preset.preset_id"
>{{preset.tag_label|translate}}</mat-radio-button>
</mat-radio-group>
</div>
</div>
</mat-step>
<!-- Single presets -->
@ -81,7 +83,7 @@
<mat-icon>clear</mat-icon>
</button>
</mat-form-field>
<div class="horizontal space">
<div class="horizontal space center-desc">
<mat-slide-toggle [(ngModel)]="fullText"></mat-slide-toggle>
<span>Search in description </span>
</div>

23
frontend/src/app/components/search-input/search-input.component.scss
View File

@ -2,7 +2,7 @@
display: flex;
flex-direction: column;
> .search-btn {
>.search-btn {
margin-top: 1rem;
}
}
@ -66,7 +66,7 @@
align-items: center;
&.space {
> * {
>* {
margin: 0.5rem;
}
}
@ -75,6 +75,10 @@
justify-content: space-around;
}
&.center-desc {
justify-content: center;
}
}
@ -92,7 +96,7 @@
margin-left: -0.5rem;
margin-right: -0.5rem;
> * {
>* {
flex-grow: 1;
margin: 0 0.5rem;
}
@ -101,3 +105,16 @@
.small-bottom-margin {
margin-bottom: 0.4rem !important;
}
.flexer {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
margin-right: -1rem;
> .sub-group {
flex-grow: 1;
margin-right: 1rem;
}
}