style calendar lines

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

@@ -3,7 +3,7 @@
 		<section class="supplement">
 			<app-stepper [step_current]="5" [step_max]="pollService.step_max"></app-stepper>
 			<app-errors-list [form]="pollService.form"></app-errors-list>
-			<div class="advanced-config padded">
+			<div class="advanced-config">
 				<h2 class="title is-2">
 					Configuration avancée
 				</h2>
@@ -11,10 +11,10 @@
 					<app-advanced-config [form]="pollService.form"></app-advanced-config>
 				</div>
 			</div>
-			<app-nav-steps
-				[next_step_number]="pollService.step_current + 1"
-				[previous_step_number]="pollService.step_current - 1"
-			></app-nav-steps>
 		</section>
 	</div>
 </div>
+<app-nav-steps
+	[next_step_number]="pollService.step_current + 1"
+	[previous_step_number]="pollService.step_current - 1"
+></app-nav-steps>

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

@@ -28,8 +28,8 @@
 		<app-day-list [form]="pollService.form"></app-day-list>
 		<!--			[hasSeveralHours]="pollService.form.value.hasSeveralHours"-->
 	</div>
+	<app-nav-steps
+		[next_step_number]="pollService.step_current + 1"
+		[previous_step_number]="pollService.step_current - 1"
+	></app-nav-steps>
 </div>
-<app-nav-steps
-	[next_step_number]="pollService.step_current + 1"
-	[previous_step_number]="pollService.step_current - 1"
-></app-nav-steps>

src/app/features/administration/nav-steps/nav-steps.component.html

@@ -1,26 +1,24 @@
 <div class="bottom-step-buttons" class="is-fixed-bottom">
 	<div class="container">
 		<div class="columns half-columns">
-			<div class="column">
+			<div class="column" *ngIf="display_previous_button">
 				<button
-					*ngIf="display_previous_button"
 					class="button button-previous is-secondary is-fullwidth"
 					[routerLink]="['/administration/step/' + previous_step_number]"
 				>
 					Précédent
 				</button>
 			</div>
-			<div class="column">
+			<div class="column" [ngClass]="{ 'is-fullwidth': !display_previous_button }">
 				<button
 					*ngIf="display_next_button"
-					class="button button-next is-fullwidth"
+					class="button button-next"
 					[ngClass]="{ 'is-finish': is_finish_step, 'is-primary': !is_finish_step }"
 					[routerLink]="['/administration/step/' + next_step_number]"
 					(click)="runEndAction()"
 				>
 					<span *ngIf="is_finish_step">
-						<i class="fa fa-save"></i>
-						Enregistrer le sondage
+						Enregistrer
 					</span>
 					<span *ngIf="!is_finish_step">
 						Suivant

src/styles/partials/_forms.scss

@@ -58,6 +58,7 @@ select,
 .select {
 	@extend .clickable;
 	border: solid 1px $font_color;
+	max-width: 90vw !important;
 }
 
 input,
@@ -85,6 +86,8 @@ textarea {
 .mat-checkbox-label,
 .mat-checkbox-layout .mat-checkbox-label {
 	max-width: 90vw;
+
+	overflow: scroll;
 }
 .button {
 	label {
@@ -300,9 +303,10 @@ mat-checkbox {
 
 .advanced-config {
 	.work-in-progress {
-		padding: 1em 2em;
-		border-left: 3px solid $warning-dark;
-		color: $light;
+		background: $primary-light;
+		padding: 0.25em;
+		border-left: 1px solid $warning-dark;
+		color: $warning-dark;
 	}
 }
 

src/styles/partials/global.scss

@@ -8,6 +8,7 @@ html {
 form {
 	margin: 0 !important;
 }
+
 main {
 	min-height: 90vh;
 }
@@ -43,22 +44,40 @@ main {
 		max-width: $main-column-width;
 		margin: 0 auto;
 		padding: 0;
+
 		.column {
 			padding: 0;
 			width: 50% !important;
 			float: left;
+
 			&:nth-of-type(1) {
 				padding-right: 1.5rem;
+
 				.step-info & {
 					padding: 0;
 				}
 			}
+
 			&:nth-of-type(2) {
 				padding-left: 1.5rem;
 			}
+
+			&.is-fullwidth {
+				width: 100% !important;
+				padding-right: 0 !important;
+				.button:nth-of-type(1) {
+					width: 50%;
+					float: right;
+				}
+			}
 		}
+
 		.button {
 			width: 100%;
+
+			.is-half-offseted {
+				float: right;
+			}
 		}
 	}
 }