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

Merge branch 'tv/ui-improvements' into 'develop'

Browse Source 
ui improvements

See merge request tjohn/cc-data!35
This commit is contained in:
Timo Volkmann 2020-06-25 22:48:30 +02:00
commit 91e84f5cf1
2 changed files with 42 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

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

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

@ -47,7 +47,8 @@
} }
>.content { >.content {
margin: 0 2.5rem; // margin: 0 2.5rem;
margin-top: 0.5rem;
.text-input { .text-input {
min-width: 14rem; min-width: 14rem;
@ -74,6 +75,10 @@
justify-content: space-around; justify-content: space-around;
} }
&.center-desc {
justify-content: center;
}
} }
@ -86,15 +91,30 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-evenly; justify-content: space-between;
align-items: center; align-items: center;
margin-left: -0.5rem;
margin-right: -0.5rem;
>* { >* {
width: 45%; flex-grow: 1;
min-width: 15rem; margin: 0 0.5rem;
} }
} }
.small-bottom-margin { .small-bottom-margin {
margin-bottom: 0.4rem !important; 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;
}
}