From c799bea900a29b838d1989e4990b49e305333083 Mon Sep 17 00:00:00 2001
From: Tykayn <contact@cipherbliss.com>
Date: Tue, 21 Dec 2021 14:58:31 +0100
Subject: [PATCH] striked background on calendar disabled dates

---
 .../date/list/day/day-list.component.html     |  2 +-
 .../steps/step-one/step-one.component.html    |  7 +++----
 src/styles/partials/_datepicker.scss          |  3 +++
 src/styles/partials/_forms.scss               | 20 +++++++++++++++++--
 4 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/app/features/administration/form/date/list/day/day-list.component.html b/src/app/features/administration/form/date/list/day/day-list.component.html
index 1d65de3d..46fee8b6 100644
--- a/src/app/features/administration/form/date/list/day/day-list.component.html
+++ b/src/app/features/administration/form/date/list/day/day-list.component.html
@@ -37,7 +37,7 @@
 				/>
 				<hr />
 				<div class="button delete-date is-block" (click)="dateChoices.splice(id, 1)">
-					<img class="icon" aria-hidden="true" src="assets/icons/trash.cvg" />
+					<img class="icon" aria-hidden="true" src="assets/icons/trash.csv" />
 					Supprimer la date
 				</div>
 				<div *ngIf="hasSeveralHours" class="several-times">
diff --git a/src/app/features/administration/form/steps/step-one/step-one.component.html b/src/app/features/administration/form/steps/step-one/step-one.component.html
index 07bf5c54..f7108d25 100644
--- a/src/app/features/administration/form/steps/step-one/step-one.component.html
+++ b/src/app/features/administration/form/steps/step-one/step-one.component.html
@@ -44,11 +44,10 @@
 						class="text-info"
 						[ngClass]="{ 'has-background-warning': pollService.form.value.description.length === 300 }"
 					>
-						<span class="counter-current" *ngIf="pollService.form.value.description.length">
-							{{ pollService.form.value.description.length }} /
-						</span>
 						<p>
-							300 caractères maximum
+							<span class="counter-current" *ngIf="pollService.form.value.description.length">
+								{{ pollService.form.value.description.length }} / </span
+							>300 caractères maximum
 						</p>
 					</div>
 				</div>
diff --git a/src/styles/partials/_datepicker.scss b/src/styles/partials/_datepicker.scss
index 56ccb509..9c7e2750 100644
--- a/src/styles/partials/_datepicker.scss
+++ b/src/styles/partials/_datepicker.scss
@@ -91,6 +91,9 @@ p-calendar,
 				color: $white;
 				transition: all ease 0.2s;
 			}
+			&.p-disabled {
+				@extend .striked-background;
+			}
 		}
 	}
 
diff --git a/src/styles/partials/_forms.scss b/src/styles/partials/_forms.scss
index c705d45a..3c04c5ff 100644
--- a/src/styles/partials/_forms.scss
+++ b/src/styles/partials/_forms.scss
@@ -51,9 +51,11 @@ input,
 .textarea,
 select,
 .select {
-	@extend .clickable;
+	font-size: 1rem !important;
+	line-height: 1.25rem;
 	border: solid 1px $font_color;
 	max-width: 90vw !important;
+	@extend .clickable;
 	&:focus {
 		@extend .outlined;
 	}
@@ -84,8 +86,8 @@ textarea {
 .mat-checkbox-label,
 .mat-checkbox-layout .mat-checkbox-label {
 	max-width: 90vw;
-
 	overflow-x: auto;
+	@extend .clickable;
 }
 .button {
 	label {
@@ -329,4 +331,18 @@ label {
 	line-height: 1rem;
 	margin-bottom: 0.5rem;
 	display: block;
+	@extend .clickable;
+}
+
+.striked-background {
+	&:after {
+		content: '';
+		position: absolute;
+		border-top: 1px solid $border-color;
+		width: 4rem;
+		transform: rotate(45deg);
+		transform-origin: 0% 0%;
+		left: 0;
+		top: 0;
+	}
 }