hide time slices per day select, colors

src/app/core/services/poll.service.ts

@@ -140,7 +140,7 @@ export class PollService implements Resolve<Poll> {
 			hasMaxCountOfAnswers: [300, [Validators.required]],
 			useVoterUniqueLink: [false, [Validators.required]],
 			voterEmailList: ['', []],
-			hasSeveralHours: [false, []],
+			hasSeveralHours: [true, []],
 			hideResults: [false, []],
 			allowNewDateTime: [true, [Validators.required]],
 		});

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

@@ -2,61 +2,55 @@
 	<div class="min-height">
 		<app-stepper [step_current]="4" [step_max]="pollService.step_max"></app-stepper>
 		<app-errors-list [form]="pollService.form"></app-errors-list>
-		<h2 class="title is-2">
+
-			Choisissez les horaires
+		<div class="custom-day-time-slices" *ngIf="environment.creation_display_hour_per_day">
-		</h2>
+			<h2 class="title is-2">
-		<div
+				Choisissez les horaires
-			class="days-list-having-separated-time-slices rounded-block"
+			</h2>
-			*ngFor="let dayChoice of pollService.dateChoiceList; index as day_id"
+			<div
-		>
+				class="days-list-having-separated-time-slices rounded-block"
-			<div class="heading day-choice">
+				*ngFor="let dayChoice of pollService.dateChoiceList; index as day_id"
-				{{ dayChoice.date_object | date }}
+			>
+				<div class="heading day-choice">
+					{{ dayChoice.date_object | date }}
+				</div>
+
+				<section class="time-slice-list-of-a-day">
+					<div *ngFor="let timeSlice of dayChoice.timeSlices; index as id" class="time-choice padded">
+						<label for="dateChoices_{{ id }}"> Horaire / option {{ id + 1 }} </label>
+						<input
+							class="input is-fullwidth"
+							type="text"
+							id="dateChoices_{{ id }}"
+							[(ngModel)]="timeSlice.literal"
+						/>
+						<button class="button input is-full" (click)="pollService.timeList.splice(id, 1)">
+							<i class="fa fa-trash"></i> supprimer
+						</button>
+					</div>
+					<div class="add-time-choice">
+						<button (click)="addChoiceForDay(dayChoice)">
+							<i class="fa fa-plus"></i>
+							Ajouter horaire / option
+						</button>
+					</div>
+				</section>
 			</div>
-
-			<section class="time-slice-list-of-a-day">
-				<div *ngFor="let timeSlice of dayChoice.timeSlices; index as id" class="time-choice padded">
-					<label for="dateChoices_{{ id }}"> Horaire / option {{ id + 1 }} </label>
-					<input
-						class="input is-fullwidth"
-						type="text"
-						id="dateChoices_{{ id }}"
-						[(ngModel)]="timeSlice.literal"
-					/>
-					<button class="button input is-full" (click)="pollService.timeList.splice(id, 1)">
-						<i class="fa fa-trash"></i> supprimer
-					</button>
-				</div>
-				<div class="add-time-choice">
-					<button (click)="addChoiceForDay(dayChoice)">
-						<i class="fa fa-plus"></i>
-						Ajouter horaire / option
-					</button>
-				</div>
-			</section>
 		</div>
-
 		<section class="same-time-slices">
-			<button class="is-outlined is-primary" (click)="toggleHasSeveralHours()">
+			<!--			<button class="is-outlined is-primary" (click)="toggleHasSeveralHours()">-->
-				Appliquer le même horaire / option à toutes les dates
+			<!--				Appliquer le même horaire / option à toutes les dates-->
-			</button>
+			<!--			</button>-->
-			<section class="same-time-slices rounded-block" *ngIf="pollService.form.value.hasSeveralHours">
+			<section class="same-time-slices" *ngIf="pollService.form.value.hasSeveralHours">
 				<h3 class="title is-3">
 					Choisissez les horaires ou options à appliquer à toutes les dates
 				</h3>
-				<button
-					(click)="pollService.addTime()"
-					*ngIf="false == pollService.allowSeveralHours"
-					class="button is-primary is-block is-fullwidth"
-					id="add_time_button"
-				>
-					<i class="fa fa-plus" aria-hidden="true"></i>
-					{{ 'dates.add_time' | translate }}
-				</button>
 
-				<section class="proposals">
+				<section class="proposals" *ngIf="environment.creation_display_proposals_time_slices">
 					<h3 class="title is-3">
 						Propositions de créneaux horaires
 					</h3>
+
 					<div class="time-slices-proposals rounded-block">
 						<div
 							class="button is-rounded"
@@ -88,6 +82,15 @@
 						(pour chaque jour)
 					</span>
 				</div>
+				<button
+					(click)="pollService.addTime()"
+					*ngIf="false == pollService.allowSeveralHours"
+					class="button is-primary is-block is-fullwidth"
+					id="add_time_button"
+				>
+					<i class="fa fa-plus" aria-hidden="true"></i>
+					{{ 'dates.add_time' | translate }}
+				</button>
 				<button class="is-primary button" (click)="applyTimeSlicesToDateChoices()">
 					Appliquer ces créneaux
 				</button>
@@ -124,11 +127,7 @@
 			</button>
 		</div>
 		<div class="column">
-			<button
+			<button class="btn is-primary is-fullwidth" [routerLink]="['/administration/step/5']">
-				class="btn is-primary is-fullwidth"
-				[routerLink]="['/administration/step/5']"
-				[disabled]="!pollService.form.valid"
-			>
 				Suivant
 			</button>
 		</div>

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

@@ -14,8 +14,9 @@ import { ToastService } from '../../../../../core/services/toast.service';
 	styleUrls: ['./step-four.component.scss'],
 })
 export class StepFourComponent implements OnInit {
-	urlPrefix: any;
+	public urlPrefix: any;
-	advancedDisplayEnabled: boolean = environment.advanced_options_display;
+	public environment = environment;
+	public advancedDisplayEnabled: boolean = environment.advanced_options_display;
 	@Input()
 	step_max: any;
 	@Input()

src/app/features/administration/form/steps/step-one/step-one.component.html

@@ -1,6 +1,6 @@
 <div class="step step-container">
 	<form class="min-height" [formGroup]="pollService.form">
-		<app-stepper [step_current]="1" [step_max]="5"></app-stepper>
+		<app-stepper [step_current]="1" [step_max]="pollService.step_max"></app-stepper>
 		<section class="poll-title">
 			<h2 class="title is-2">
 				{{ 'creation.choose_title' | translate }}

src/app/features/administration/form/steps/step-one/step-one.component.ts

@@ -21,7 +21,9 @@ export class StepOneComponent implements OnInit {
 		@Inject(DOCUMENT) private document: any,
 		private router: Router,
 		private confirmationService: ConfirmationService
-	) {}
+	) {
+		this.step_max = this.pollService.step_max;
+	}
 
 	ngOnInit(): void {
 		this.pollService.step_current = 1;

src/app/features/administration/form/steps/step-six/step-six.component.html

@@ -22,11 +22,7 @@
 			</button>
 		</div>
 		<div class="column">
-			<button
+			<button class="btn is-primary is-fullwidth" [routerLink]="['/administration/step/7']">
-				class="btn is-primary is-fullwidth"
-				[routerLink]="['/administration/step/7']"
-				[disabled]="!pollService.form.valid"
-			>
 				Suivant
 			</button>
 		</div>

src/app/features/administration/form/steps/step-three/step-three.component.html

@@ -2,7 +2,11 @@
 	<app-stepper [step_current]="3" [step_max]="pollService.step_max"></app-stepper>
 	<app-errors-list [form]="pollService.form"></app-errors-list>
 	<!--	sélecteur d'interface-->
-	<button class="button" (click)="changeDateInputMode()" [ngClass]="{ 'is-primary': !pollService.mode_calendar }">
+	<button
+		class="button is-fullwidth"
+		(click)="changeDateInputMode()"
+		[ngClass]="{ 'is-primary': !pollService.mode_calendar }"
+	>
 		<span *ngIf="pollService.mode_calendar"> <i class="fa fa-pencil"></i> Saisir les dates manuellement </span>
 		<span *ngIf="!pollService.mode_calendar">
 			<i class="fa fa-calendar-o"></i> Saisir les dates dans le calendrier

src/app/features/administration/form/steps/step-two/step-two.component.html

@@ -1,7 +1,7 @@
 <div class="step step-container form-field poll-kind">
 	<form action="#" [formGroup]="pollService.form">
 		<div class="min-height">
-			<app-stepper [step_current]="2" [step_max]="5"></app-stepper>
+			<app-stepper [step_current]="2" [step_max]="pollService.step_max"></app-stepper>
 			<app-errors-list [form]="pollService.form"></app-errors-list>
 			<h2 class="title is-2">
 				{{ 'creation.want' | translate }}
@@ -11,7 +11,10 @@
 					<div class="column">
 						<div
 							class="button input-radio is-fullwidth"
-							[ngClass]="{ 'is-selected is-primary': pollService.form.controls.isAboutDate.value }"
+							[ngClass]="{
+								'is-selected has-background-primary has-text-white':
+									pollService.form.controls.isAboutDate.value
+							}"
 							(click)="pollService.form.controls.isAboutDate.setValue(true)"
 						>
 							<i class="fa fa-calendar"></i>
@@ -24,7 +27,10 @@
 					<div class="column">
 						<div
 							class="button input-radio is-fullwidth"
-							[ngClass]="{ 'is-selected is-primary': !pollService.form.controls.isAboutDate.value }"
+							[ngClass]="{
+								'is-selected has-background-primary has-text-white': !pollService.form.controls
+									.isAboutDate.value
+							}"
 							(click)="pollService.form.controls.isAboutDate.setValue(false)"
 						>
 							<i class="fa fa-list-ul"></i>

src/app/features/administration/form/steps/step-two/step-two.component.ts

@@ -40,6 +40,7 @@ export class StepTwoComponent implements OnInit {
 	) {
 		this.form = this.pollService.form;
 		this.pollService.step_current = 2;
+		this.step_max = this.pollService.step_max;
 	}
 
 	get choices(): FormArray {

src/app/shared/components/feedback/feedback.component.scss

@@ -1,5 +1,5 @@
 :host {
-	position: fixed;
+	position: relative;
 	bottom: 4em;
 	left: 1em;
 	color: white;

src/environments/environment.ts

@@ -25,6 +25,7 @@ export const environment = {
 	autofill_participation: false,
 	autofill_default_timeslices: false,
 	creation_email_is_required: true,
+	creation_display_proposals_time_slices: false,
 	creation_display_admin_url: false,
 	creation_display_hour_per_day: false, // display or not the ability to choose time slices different per day
 	showDemoWarning: false,

src/styles/partials/_responsive.scss

@@ -1,7 +1,7 @@
 // small screens
 @media (min-width: 600px) {
 	.feedback-container {
-		position: fixed;
+		//position: fixed;
 	}
 }
 // wide screen like desktop