From 51e40a6ab0b9287ef4b6440dabe5235ad183d9db Mon Sep 17 00:00:00 2001
From: Alex Martzios <alexandros.martzios@gmail.com>
Date: Thu, 3 Mar 2022 08:33:56 +0200
Subject: [PATCH] Add get-started assets and scrollspy on all pages

---
 src/app/get-started/get-started.component.css |  6 ++++
 .../get-started/get-started.component.html    | 28 +++++++++++--------
 src/app/get-started/get-started.component.ts  |  1 +
 src/app/get-started/get-started.module.ts     |  4 ++-
 src/app/home/home.component.html              |  2 +-
 src/app/learn-how/learn-how.component.html    |  2 +-
 src/app/openaireLibrary                       |  2 +-
 src/assets/monitor-assets/get-started/1.svg   | 10 +++++++
 src/assets/monitor-assets/get-started/2.svg   |  6 ++++
 src/assets/monitor-custom.css                 |  6 +---
 src/assets/openaire-theme                     |  2 +-
 11 files changed, 47 insertions(+), 22 deletions(-)
 create mode 100644 src/app/get-started/get-started.component.css
 create mode 100644 src/assets/monitor-assets/get-started/1.svg
 create mode 100644 src/assets/monitor-assets/get-started/2.svg

diff --git a/src/app/get-started/get-started.component.css b/src/app/get-started/get-started.component.css
new file mode 100644
index 0000000..1af0ec3
--- /dev/null
+++ b/src/app/get-started/get-started.component.css
@@ -0,0 +1,6 @@
+.floating-number {
+	transform: translateY(-50%);
+}
+.floating-text {
+	transform: translate(50%, 50%);
+}
\ No newline at end of file
diff --git a/src/app/get-started/get-started.component.html b/src/app/get-started/get-started.component.html
index 28e59d2..dda73f7 100644
--- a/src/app/get-started/get-started.component.html
+++ b/src/app/get-started/get-started.component.html
@@ -1,14 +1,14 @@
 <schema2jsonld *ngIf="url" [URL]="url" [name]="pageTitle" type="other" [description]="description"></schema2jsonld>
-<div class="">
+<div class="uk-background-muted">
 	<div class="uk-container uk-container-large uk-section uk-section-small uk-padding-remove-bottom">
 		<div class="uk-padding-small">
 			<breadcrumbs [breadcrumbs]="breadcrumbs"></breadcrumbs>
 		</div>
 	</div>
-	<div class="uk-container uk-container-large uk-section uk-padding-remove-top">
+	<div class="uk-container uk-container-large uk-section uk-padding-remove-top" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200">
 		<div class="uk-padding-small uk-margin-small-top uk-text-center">
-			<h1>Lorem ipsum dolor <br> sit amet, consetetur<span class="uk-text-primary">.</span></h1>
-			<div class="uk-text-large">
+			<h1 uk-scrollspy-class>Lorem ipsum dolor <br> sit amet, consetetur<span class="uk-text-primary">.</span></h1>
+			<div class="uk-text-large" uk-scrollspy-class>
 				Lorem ipsum dolor sit amet, consetetur sadipscing elitr, <br> sed diam nonumy eirmod tempor invidunt ut labore et <br> dolore magna aliquyam erat, sed diam voluptua.
 			</div>
 		</div>
@@ -17,24 +17,28 @@
 <div class="mixed-background">
 	<div class="uk-background-muted">
 		<div class="uk-container uk-container-large uk-section">
-			<div class="uk-padding-small uk-text-center uk-width-1-2 uk-margin-auto uk-grid uk-child-width-1-2" uk-grid>
-				<div class="">
-					provide
+			<div class="uk-padding-small  uk-margin-auto uk-width-2-3 uk-grid uk-grid-large uk-child-width-1-2" uk-grid>
+				<div class="uk-flex uk-flex-column floating-text">
+					<icon name="description" ratio="3" visuallyHidden="Provide some information"
+						customClass="uk-text-primary-gradient"></icon>
+					<span class="uk-text-lead uk-text-bold uk-text-uppercase">Provide some <br> information</span>
 				</div>
-				<div class="">
-					contact
+				<div class="uk-flex uk-flex-column floating-text">
+					<icon name="email" ratio="3" visuallyHidden="Provide some information"
+						customClass="uk-text-primary-gradient"></icon>
+					<span class="uk-text-lead uk-text-bold uk-text-uppercase">We contact <br> you</span>
 				</div>
 			</div>
 		</div>
 	</div>
 	<div class="normal-background">
 		<div class="uk-container uk-container-large uk-section uk-padding-remove-vertical">
-			<div class="uk-padding-small uk-padding-remove-vertical uk-text-center uk-width-1-2 uk-margin-auto uk-grid uk-child-width-1-2 uk-position-relative" uk-grid>
+			<div class="uk-padding-small uk-padding-remove-vertical  uk-margin-auto uk-width-2-3 uk-grid uk-grid-large uk-child-width-1-2 uk-position-relative" uk-grid>
 				<div class="floating-number">
-					1
+					<img src="assets/monitor-assets/get-started/1.svg" alt="">
 				</div>
 				<div class="floating-number">
-					2
+					<img src="assets/monitor-assets/get-started/2.svg" alt="">
 				</div>
 			</div>
 			<!-- <div class="uk-padding-small uk-text-center">
diff --git a/src/app/get-started/get-started.component.ts b/src/app/get-started/get-started.component.ts
index ec56632..4910af7 100644
--- a/src/app/get-started/get-started.component.ts
+++ b/src/app/get-started/get-started.component.ts
@@ -19,6 +19,7 @@ import {StringUtils} from "../openaireLibrary/utils/string-utils.class";
 @Component({
   selector: 'get-started',
   templateUrl: './get-started.component.html',
+	styleUrls: ['get-started.component.css']
 })
 export class GetStartedComponent implements OnInit {
   public url: string = null;
diff --git a/src/app/get-started/get-started.module.ts b/src/app/get-started/get-started.module.ts
index 2c10994..11c89da 100644
--- a/src/app/get-started/get-started.module.ts
+++ b/src/app/get-started/get-started.module.ts
@@ -15,13 +15,15 @@ import {SEOServiceModule} from "../openaireLibrary/sharedComponents/SEO/SEOServi
 import {ContactUsModule} from "../openaireLibrary/contact-us/contact-us.module";
 import {BreadcrumbsModule} from "../openaireLibrary/utils/breadcrumbs/breadcrumbs.module";
 import {LoadingModule} from "../openaireLibrary/utils/loading/loading.module";
+import {IconsModule} from '../openaireLibrary/utils/icons/icons.module';
 
 
 @NgModule({
   imports: [
     GetStartedRoutingModule, CommonModule, RouterModule,
     AlertModalModule, RecaptchaModule, HelperModule,
-    Schema2jsonldModule, SEOServiceModule, ContactUsModule, BreadcrumbsModule, LoadingModule
+    Schema2jsonldModule, SEOServiceModule, ContactUsModule, BreadcrumbsModule, LoadingModule,
+		IconsModule
   ],
   declarations: [
     GetStartedComponent
diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html
index 766bef1..5b54e80 100644
--- a/src/app/home/home.component.html
+++ b/src/app/home/home.component.html
@@ -27,7 +27,7 @@
     </div>
     <div left class="uk-width-1-1 uk-width-1-2@m uk-background-primary monitor-dark-logo-background uk-position-z-index">
       <div class="imgContainer uk-flex uk-flex-middle uk-flex-center">
-        <img id="ipad" src="assets/monitor-assets/home/ipad.png" alt="ipad" loading="lazy">
+        <img class="uk-animation-fade" id="ipad" src="assets/monitor-assets/home/ipad.png" alt="ipad" loading="lazy">
       </div>
     </div>
     <div scroll class="uk-width-expand">
diff --git a/src/app/learn-how/learn-how.component.html b/src/app/learn-how/learn-how.component.html
index f99aa5a..d9ec51b 100644
--- a/src/app/learn-how/learn-how.component.html
+++ b/src/app/learn-how/learn-how.component.html
@@ -100,7 +100,7 @@
 	</div>
 </div>
 <div class="uk-section uk-margin-large-top uk-container uk-container-large">
-	<div class="uk-h6 uk-text-primary uk-margin-remove">Inclusion, transparency, quality, state of the art technology.</div>
+	<span class="uk-h6 uk-text-primary uk-margin-remove">Inclusion, transparency, quality, state of the art technology.</span>
 	<h2 class="uk-h1 uk-margin-remove-top uk-margin-medium-bottom">Simplify research <br> tracking & monitoring.</h2>
 	<div class="uk-padding-large">
 		<how></how>
diff --git a/src/app/openaireLibrary b/src/app/openaireLibrary
index 894ce0a..4698a5f 160000
--- a/src/app/openaireLibrary
+++ b/src/app/openaireLibrary
@@ -1 +1 @@
-Subproject commit 894ce0add6f88ac2ea10998f76befef280c25042
+Subproject commit 4698a5fafd51fa7d8a0969b0d4e2691cce53ccf4
diff --git a/src/assets/monitor-assets/get-started/1.svg b/src/assets/monitor-assets/get-started/1.svg
new file mode 100644
index 0000000..f381ecf
--- /dev/null
+++ b/src/assets/monitor-assets/get-started/1.svg
@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="152.064" height="298.117" viewBox="0 0 152.064 298.117">
+  <g id="Group_13811" data-name="Group 13811" transform="translate(-311 -600)">
+    <g id="Group_13810" data-name="Group 13810" transform="translate(311 600)" style="isolation: isolate">
+      <path id="Path_104582" data-name="Path 104582" d="M103.163-138h-28.3c-15.812,0-30.793,4.161-46.189,12.9L-37.9-85.57v54.095L45.739-77.664V149.117h57.424V-138Z" transform="translate(37.9 138)" fill="#3086ed"/>
+    </g>
+    <g id="Group_13399" data-name="Group 13399" transform="translate(248.031 -0.441)" style="mix-blend-mode: multiply;isolation: isolate">
+      <path id="Path_104582-2" data-name="Path 104582" d="M103.164-138h-28.3c-15.812,0-30.793,4.161-46.189,12.9L-37.9-85.57v54.095L45.739-77.664V149.117h57.424V-138Z" transform="translate(110.869 748.441)" fill="none" stroke="#3086ed" stroke-width="2"/>
+    </g>
+  </g>
+</svg>
diff --git a/src/assets/monitor-assets/get-started/2.svg b/src/assets/monitor-assets/get-started/2.svg
new file mode 100644
index 0000000..2383dde
--- /dev/null
+++ b/src/assets/monitor-assets/get-started/2.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="219.715" height="298.559" viewBox="0 0 219.715 298.559">
+  <g id="Group_13812" data-name="Group 13812" transform="translate(-767.284 -600)">
+    <path id="Path_104612" data-name="Path 104612" d="M35.232,101.726,87.361,50.819C138.675.726,156.187-24.524,156.187-59.956,156.187-108.012,123.607-141,61.7-141-1.422-141-38.889-108.012-44.591-47.738L-45-43.665H10.8l.407-4.073c3.665-33.8,17.1-51.315,45.206-51.315,26.065,0,40.319,17.512,40.319,42.355,0,26.879-15.069,46.835-52.944,83.9L-50.7,119.645v26.472H154.151V101.726Z" transform="translate(817.984 741)" fill="#3086ed"/>
+    <path id="Path_104583" data-name="Path 104583" d="M35.232,101.726,87.361,50.819C138.675.726,156.187-24.524,156.187-59.956,156.187-108.012,123.607-141,61.7-141-1.422-141-38.89-108.012-44.591-47.738L-45-43.665H10.8l.407-4.073c3.665-33.8,17.1-51.315,45.206-51.315,26.065,0,40.319,17.512,40.319,42.355,0,26.879-15.069,46.835-52.944,83.9L-50.7,119.645v26.472H154.151V101.726Z" transform="translate(829.813 751.441)" fill="none" stroke="#3086ed" stroke-width="2" style="mix-blend-mode: multiply;isolation: isolate"/>
+  </g>
+</svg>
diff --git a/src/assets/monitor-custom.css b/src/assets/monitor-custom.css
index 4455341..47aa446 100644
--- a/src/assets/monitor-custom.css
+++ b/src/assets/monitor-custom.css
@@ -93,8 +93,4 @@ main {
 
 /*.monitorApp .uk-grid-divider>:not(.uk-first-column)::before {*/
 /*  border-left: 1px solid #DEDEDE;*/
-/*}*/
-.floating-number {
-	font-size: 200px;
-	transform: translateY(-50%);
-}
+/*}*/
\ No newline at end of file
diff --git a/src/assets/openaire-theme b/src/assets/openaire-theme
index 559ea1a..60be89e 160000
--- a/src/assets/openaire-theme
+++ b/src/assets/openaire-theme
@@ -1 +1 @@
-Subproject commit 559ea1a77d57e2e94d8b72a1089704dbfe5889b2
+Subproject commit 60be89ef464a3eb6a485b1f68bd9f3dcde0393a0