🎨 add pictures from undraw, translate sentences on homepage

src/app/core/components/home/home.component.html

@@ -34,17 +34,35 @@
 				</div>
 			</div>
 			<div class="column">
-				Prise en main Framadate est un service en ligne permettant de planifier un rendez-vous ou prendre des
-				décisions rapidement et simplement. Aucune inscription préalable n’est nécessaire. Voici comment ça
-				fonctionne : Créez un sondage Déterminez les dates ou les sujets à choisir Envoyez le lien du sondage à
-				vos amis ou collègues Discutez et prenez votre décision Voulez-vous voir un exemple ? Le logiciel
-				Framadate est initialement basé sur Studs un logiciel développé par l'Université de Strasbourg.
-				Aujourd'hui, son développement est assuré par l’association Framasoft. Ce logiciel requiert l’activation
-				du JavaScript et des cookies. Il est compatible avec les navigateurs web suivants : Microsoft Internet
-				Explorer 9+ Google Chrome 19+ Firefox 12+ Safari 5+ Opera 11+ Il est régi par la licence CeCILL-B.
-				Cultivez votre jardin Pour participer au développement du logiciel, proposer des améliorations ou
-				simplement le télécharger, rendez-vous sur le site de développement. Si vous souhaitez installer ce
-				logiciel pour votre propre usage et ainsi gagner en autonomie, nous vous aidons sur :
+				<img src="assets/img/undraw_group_selfie_ijc6.svg" alt="image WIP" />
+				<p>
+					{{
+						'SENTENCES.framadate-is-an-online-service-for-planning-an-appointment-or-making-a-decision-quickly-and-easily'
+							| translate
+					}}
+					{{ 'SENTENCES.here-is-how-it-works' | translate }}
+					{{ 'SENTENCES.send-the-poll-link-to-your-friends-or-colleagues' | translate }}
+				</p>
+				<p>
+					{{ 'SENTENCES.what-is-framadate' | translate }}
+					{{ 'SENTENCES.view-an-example' | translate }}
+					{{ 'SENTENCES.framadate-is-licensed-under-the' | translate }}
+					<span class="licence">
+						GNU Affero v3 Licence
+					</span>
+				</p>
+				<p>
+					{{ 'SENTENCES.grow-your-own' | translate }}
+					{{
+						'SENTENCES.if-you-want-to-install-the-software-for-your-own-use-and-thus-increase-your-independence-we-can-help'
+							| translate
+					}}
+					{{
+						'SENTENCES.to-participate-in-the-software-development-suggest-improvements-or-simply-download-it-please-visit'
+							| translate
+					}}
+					{{ 'SENTENCES.the-development-site' | translate }}
+				</p>
 			</div>
 		</div>
 	</div>

src/app/features/administration/form/form.component.html

@@ -3,6 +3,7 @@
 		{{ 'creation.title' | translate }}
 	</h1>
 
+	<img src="assets/img/undraw_Moving_twwf.svg" alt="image WIP" />
 	<button class="btn btn--warning" (click)="askInitFormDefault()">
 		<i class="fa fa-refresh"></i>
 		Tout réinitialiser

src/app/features/administration/form/form.component.ts

@@ -41,6 +41,10 @@ export class FormComponent implements OnInit {
 		@Inject(DOCUMENT) private document: any
 	) {}
 
+	get choices(): FormArray {
+		return this.form.get('choices') as FormArray;
+	}
+
 	ngOnInit(): void {
 		this.initFormDefault();
 	}
@@ -52,6 +56,8 @@ export class FormComponent implements OnInit {
 			const newpoll = this.pollService.newPollFromForm(this.form);
 			// TODO : save the poll
 			this.apiService.createPoll(newpoll);
+		} else {
+			this.toastService.display('invalid form');
 		}
 	}
 
@@ -60,10 +66,6 @@ export class FormComponent implements OnInit {
 		this.form.patchValue({ slug: newValueFormatted });
 	}
 
-	get choices(): FormArray {
-		return this.form.get('choices') as FormArray;
-	}
-
 	addChoice(optionalLabel = ''): void {
 		const newControlGroup = this.fb.group({
 			label: this.fb.control('', [Validators.required]),
@@ -82,7 +84,7 @@ export class FormComponent implements OnInit {
 		this.focusOnChoice(this.choices.length - 1);
 	}
 
-	focusOnChoice(index) {
+	focusOnChoice(index): void {
 		const selector = '#choice_label_' + index;
 		const elem = this.document.querySelector(selector);
 		if (elem) {

src/app/features/user-profile/user-polls/user-polls.component.html

@@ -26,7 +26,10 @@
 	<div class="columns">
 		<div class="column">
 			<form (submit)="sendRetrieveEmail()">
-				<input type="email" autofocus="autofocus" placeholder="contact@exemple.com" />
+				<label for="search_field">
+					<img src="assets/img/undraw_prototyping_process_rswj.svg" alt="image my polls" />
+					<input type="email" id="search_field" autofocus="autofocus" placeholder="contact@exemple.com" />
+				</label>
 				<button class="button is-primary">
 					envoyez-moi la liste par email
 				</button>