tykayn/funky-framadate-front
1
1
Fork 1
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front.git synced 2023-08-25 13:53:14 +02:00
Code Issues Projects Releases Wiki Activity

unify labels

Browse Source
This commit is contained in:
Tykayn 2022-03-01 12:02:18 +01:00 committed by tykayn
parent 26b0babf92
commit c3433440d7
4 changed files with 62 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/app/features/administration/form/steps/step-four/step-four.component.html
View File

@ -17,9 +17,7 @@
<section class="time-slice-list-of-a-day"> <section class="time-slice-list-of-a-day">
<div *ngFor="let timeSlice of dayChoice.timeSlices; index as id" class="time-choice"> <div *ngFor="let timeSlice of dayChoice.timeSlices; index as id" class="time-choice">
<label class="pull-left" for="dateChoices_{{ id }}"> <label for="dateChoices_{{ id }}"> {{ 'hours.element' | translate }} {{ id + 1 }} </label>
{{ 'hours.element' | translate }} {{ id + 1 }}
</label>
<input class="input" type="text" id="dateChoices_{{ id }}" [(ngModel)]="timeSlice.literal" /> <input class="input" type="text" id="dateChoices_{{ id }}" [(ngModel)]="timeSlice.literal" />
<button <button
@ -36,7 +34,6 @@
class="has-text-primary has-no-border is-large-button has-text-left has-background-transparent has-background-plus has-background-icon-left is-filtered-icon-primary" class="has-text-primary has-no-border is-large-button has-text-left has-background-transparent has-background-plus has-background-icon-left is-filtered-icon-primary"
(click)="addChoiceForDay(dayChoice)" (click)="addChoiceForDay(dayChoice)"
> >
<!-- <img class="icon is-filtered-icon-primary" aria-hidden="true" src="assets/icons/plus-circle.svg" />-->
{{ 'hours.add' | translate }} {{ 'hours.add' | translate }}
</button> </button>
</div> </div>
@ -110,24 +107,20 @@
</div> </div>
</div> </div>
</section> </section>
<div *ngFor="let timeSlice of pollService.timeList; index as id" class="time-choice"> <div
*ngFor="let timeSlice of pollService.timeList; index as id"
class="time-choice time-slice-list-of-a-day"
>
<label for="timeList_{{ id }}"> {{ 'hours.element' | translate }} {{ id + 1 }} </label> <label for="timeList_{{ id }}"> {{ 'hours.element' | translate }} {{ id + 1 }} </label>
<input class="input" type="text" id="timeList_{{ id }}" [(ngModel)]="timeSlice.literal" />
<div class="columns"> <button
<div class="column"> [attr.aria-label]="'choices.delete' | translate"
<input class="has-no-border delete-hour"
class="input is-fullwidth" (click)="pollService.timeList.splice(id, 1)"
type="text" >
id="timeList_{{ id }}" <!-- {{ 'choices.delete' | translate }}-->
[(ngModel)]="timeSlice.literal" <img src="assets/icons/trash-2.svg" class="icon is-filtered-icon-primary" />
/> </button>
</div>
<div class="column is-narrow">
<button class="button is-block has-no-border" (click)="pollService.timeList.splice(id, 1)">
<img src="assets/icons/trash-2.svg" class="icon" />
</button>
</div>
</div>
</div> </div>
<div class="title" *ngIf="environment.display_count_timelist && pollService.timeList.length"> <div class="title" *ngIf="environment.display_count_timelist && pollService.timeList.length">
<span class="count-dates"> <span class="count-dates">

92
src/app/features/administration/form/steps/step-four/step-four.component.scss
View File

@ -9,56 +9,56 @@
font-weight: 700; font-weight: 700;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
}
.time-slice-list-of-a-day { .time-slice-list-of-a-day {
label { label {
line-height: 2.25rem; line-height: 2.25rem;
margin-bottom: 0; margin-bottom: 0;
} }
input { input {
width: calc(100% - 2rem); width: calc(100% - 2rem);
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.button { .button {
color: $primary_color; color: $primary_color;
.icon { .icon {
margin-right: 1rem; margin-right: 1rem;
fill: $primary_color; fill: $primary_color;
}
}
#close_dialog {
border: 0;
color: $primary !important;
.icon {
margin-left: 1rem;
height: 1.5em;
width: 1.5em;
}
}
.add-time-choice {
margin-top: 0.5rem;
.button {
justify-content: inherit;
background: transparent;
}
}
.delete-hour {
background: transparent;
font-size: 0.8rem;
width: 2rem;
padding: 0;
float: right;
margin-top: -3rem;
margin-right: 0;
margin-bottom: 0;
} }
} }
#close_dialog {
border: 0;
color: $primary !important;
.icon {
margin-left: 1rem;
height: 1.5em;
width: 1.5em;
}
}
.add-time-choice {
margin-top: 0.5rem;
.button {
justify-content: inherit;
background: transparent;
}
}
.delete-hour {
background: transparent;
font-size: 0.8rem;
width: 2rem;
padding: 0;
float: right;
margin-top: -3rem;
margin-right: 0;
margin-bottom: 0;
}
} }

2
src/app/features/administration/form/steps/step-four/step-four.component.ts
View File

@ -22,7 +22,7 @@ export class StepFourComponent implements OnInit {
form: any; form: any;
showSameTimeSlices: boolean = false; showSameTimeSlices: boolean = false;
timeSlicesProposals: TimeSlices[] = timeSlicesProposals; timeSlicesProposals: TimeSlices[] = timeSlicesProposals;
display_same_hours_dialog: boolean = true; display_same_hours_dialog: boolean = false;
constructor( constructor(
private dateUtilitiesService: DateUtilitiesService, private dateUtilitiesService: DateUtilitiesService,

2
src/styles/dev-utilities/_helpers.scss
View File

@ -60,7 +60,7 @@
border-radius: 0.25em; border-radius: 0.25em;
background: $d-blue30; background: $d-blue30;
padding: 1em; padding: 1em;
margin-bottom: 0.5em; margin-bottom: 1rem;
hr { hr {
margin: 0.5em -1em; margin: 0.5em -1em;