From b7360ecdc700985dbb84b3a20cbdd2be97082050 Mon Sep 17 00:00:00 2001
From: "k.triantafyllou" <k.triantafyllou@d315682c-612b-4755-9ff5-7f18f6832af3>
Date: Mon, 15 Apr 2019 14:31:34 +0000
Subject: [PATCH] [Trunk|Connect]: ContactUs: Change view of form

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-connect-portal/trunk@55367 d315682c-612b-4755-9ff5-7f18f6832af3
---
 src/app/contact/contact.component.html | 38 +++++++++++++-------------
 1 file changed, 19 insertions(+), 19 deletions(-)

diff --git a/src/app/contact/contact.component.html b/src/app/contact/contact.component.html
index 339015f..207485c 100644
--- a/src/app/contact/contact.component.html
+++ b/src/app/contact/contact.component.html
@@ -10,33 +10,34 @@
                         <div class="uk-width-1-2@m uk-width-1-1@s">
                             <h4 class="uk-margin-auto uk-h4 uk-text-bold">Contact us and create your community profile</h4>
                             <div *ngIf="errorMessage" class="uk-width-1-1 uk-alert uk-alert-danger uk-text-center" role="alert">{{errorMessage}}</div>
-                            <div class="uk-margin uk-padding uk-padding-remove-left" uk-grid>
-                                <label class="uk-width-1-2 uk-h5 uk-text-bold">
-                                    Name <span class="uk-text-danger uk-text-bold">*</span>
-                                </label>
-                                <label class="uk-width-1-2 uk-h5 uk-text-bold">
-                                    Surname <span class="uk-text-danger uk-text-bold">*</span>
-                                </label>
-                                <div class="uk-width-1-2 uk-margin-remove-top">
+                            <div class="uk-margin-top" uk-grid>
+                                <div class="uk-margin-small uk-width-1-1 uk-text-danger uk-text-bold uk-margin-remove-bottom">* Required fields</div>
+                                <div class="uk-width-1-2 uk-margin-small-top">
+                                    <label class="uk-h5 uk-text-bold">
+                                        Name <span class="uk-text-danger uk-text-bold">*</span>
+                                    </label>
                                     <div *ngIf="name.invalid && isSubmitted" class=" uk-text-danger uk-text-small style=display:none"> Please add a name. </div>
                                     <input class="uk-input" type="text" placeholder="Your Name" [(ngModel)]="contactForm.name" required #name="ngModel">
                                 </div>
-                                <div class="uk-width-1-2 uk-margin-remove-top">
+                                <div class="uk-width-1-2 uk-margin-small-top">
+                                    <label class="uk-h5 uk-text-bold">
+                                        Surname <span class="uk-text-danger uk-text-bold">*</span>
+                                    </label>
                                     <div *ngIf="surname.invalid && isSubmitted" class=" uk-text-danger uk-text-small style=display:none"> Please add a surname. </div>
                                     <input class="uk-input" type="text" placeholder="Your Surname" [(ngModel)]="contactForm.surname" required #surname="ngModel">
                                 </div>
-                                <label class="uk-width-1-2 uk-h5 uk-text-bold">
-                                    Email <span class="uk-text-danger uk-text-bold">*</span>
-                                </label>
-                                <label class="uk-width-1-2 uk-h5 uk-text-bold">
-                                    Affiliation <span class="uk-text-danger uk-text-bold">*</span>
-                                </label>
-                                <div class="uk-width-1-2 uk-margin-remove-top">
+                                <div class="uk-width-1-2 uk-margin-small-top">
+                                    <label class="uk-h5 uk-text-bold">
+                                        Email <span class="uk-text-danger uk-text-bold">*</span>
+                                    </label>
                                     <div *ngIf="sender.invalid && isSubmitted" class=" uk-text-danger uk-text-small style=display:none">Please add an email. </div>
                                     <div *ngIf="!sender.invalid && isSubmitted && !contactForm.email.match('^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$')" class=" uk-text-danger uk-text-small style=display:none">Please add a valid email. </div>
                                     <input class="uk-input" type="email" placeholder="Your Email" [(ngModel)]="contactForm.email" required #sender="ngModel">
                                 </div>
-                                <div class="uk-width-1-2 uk-margin-remove-top">
+                                <div class="uk-width-1-2 uk-margin-small-top">
+                                    <label class="uk-h5 uk-text-bold">
+                                        Affiliation <span class="uk-text-danger uk-text-bold">*</span>
+                                    </label>
                                     <div *ngIf="affiliation.invalid && isSubmitted" class=" uk-text-danger uk-text-small style=display:none"> Please add an affiliation. </div>
                                     <input class="uk-input" type="text" placeholder="Your Affiliation" [(ngModel)]="contactForm.affiliation" required #affiliation="ngModel">
                                 </div>
@@ -54,11 +55,10 @@
                                     <div *ngIf="message.invalid && isSubmitted" class=" uk-text-danger uk-text-small style=display:none"> Please write us a message. </div>
                                     <textarea rows="4" class="uk-textarea" type="text" placeholder="Your message" [(ngModel)]="contactForm.message" required #message="ngModel"></textarea>
                                 </div>
-                                <div class="uk-width-1-2">
+                                <div class="uk-width-1-1">
                                     <div *ngIf="!contactForm.recaptcha && isSubmitted" class=" uk-text-danger uk-text-small style=display:none"> Please complete reCaptcha challenge. </div>
                                     <re-captcha #recaptcha (resolved)="handleRecaptcha($event)" [(siteKey)]="properties.reCaptchaSiteKey" required></re-captcha>
                                 </div>
-                                <div class="uk-width-1-1 uk-text-danger uk-text-bold uk-text-right">* Required fields</div>
                                 <div class="uk-width-1-1 uk-text-right">
                                     <button class="uk-button uk-button-default uk-margin-auto-top" (click)="reset()">Reset</button>
                                     <button class="uk-button portal-button" (click)="send()">Send</button>