From 156ec495a2512fca9344bc0e24c00646882bc8a8 Mon Sep 17 00:00:00 2001
From: "k.triantafyllou" <k.triantafyllou@di.uoa.gr>
Date: Thu, 2 Jun 2022 18:35:53 +0300
Subject: [PATCH] Quick contact: Make header sticky

---
 .../quick-contact.component.html              | 36 ++++++++++---------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/sharedComponents/quick-contact/quick-contact.component.html b/sharedComponents/quick-contact/quick-contact.component.html
index 612c66d9..cc7bab9b 100644
--- a/sharedComponents/quick-contact/quick-contact.component.html
+++ b/sharedComponents/quick-contact/quick-contact.component.html
@@ -4,26 +4,28 @@
 		<icon *ngIf="showDrop" name="close" [flex]="true"></icon>
 		<span class="uk-margin-small-left">{{contact}}</span>
 	</button>
-	<div #drop id="quick-contact" class="uk-dropdown uk-padding-remove uk-overflow-auto"
+	<div #drop id="quick-contact" class="uk-dropdown uk-padding-remove"
 			 uk-dropdown="mode: click; pos: top-right; animation: uk-animation-fade; offset: 20">
-		<div class="uk-card-header uk-padding-small uk-text-center" [ngClass]="background">
-			<div class="uk-text-small">
-				Send a message
+		<div class="uk-card uk-flex uk-flex-column uk-height-1-1">
+			<div class="uk-card-header uk-padding-small uk-text-center" [ngClass]="background">
+				<div class="uk-text-small">
+					Send a message
+				</div>
+				<div *ngIf="images.length > 0" class="uk-margin-small avatars">
+					<img *ngFor="let image of images" [src]="image" class="uk-border-circle" >
+				</div>
+				<div class="uk-text-bold">
+					How can we help?
+				</div>
+				<div class="uk-text-small">
+					We usually respond in a few hours.
+				</div>
 			</div>
-			<div *ngIf="images.length > 0" class="uk-margin-small avatars">
-				<img *ngFor="let image of images" [src]="image" class="uk-border-circle" >
+			<div class="uk-card-body uk-width-expand uk-overflow-auto">
+				<loading *ngIf="sending" class="uk-margin-xlarge-top"></loading>
+				<contact-us *ngIf="contactForm && !sending" [organizationTypes]="organizationTypes" (sendEmitter)="send($event)"
+										[smallForm]="true" sendButton="Send Message" [contactForm]="contactForm"></contact-us>
 			</div>
-			<div class="uk-text-bold">
-				How can we help?
-			</div>
-			<div class="uk-text-small">
-				We usually respond in a few hours.
-			</div>
-		</div>
-		<div class="uk-card-body">
-			<loading *ngIf="sending" class="uk-margin-xlarge-top"></loading>
-			<contact-us *ngIf="contactForm && !sending" [organizationTypes]="organizationTypes" (sendEmitter)="send($event)"
-									[smallForm]="true" sendButton="Send Message" [contactForm]="contactForm"></contact-us>
 		</div>
 	</div>
 </div>