From 1d27a50be3b3670381cd37f81995a8dc127c68a5 Mon Sep 17 00:00:00 2001
From: Alex Martzios <alexandros.martzios@gmail.com>
Date: Tue, 17 May 2022 09:44:05 +0300
Subject: [PATCH] homepage - hero section tweaks

---
 explore/src/app/home/home.component.html | 25 ++++++++++++++----------
 1 file changed, 15 insertions(+), 10 deletions(-)

diff --git a/explore/src/app/home/home.component.html b/explore/src/app/home/home.component.html
index 924b89fb..973e80ba 100644
--- a/explore/src/app/home/home.component.html
+++ b/explore/src/app/home/home.component.html
@@ -10,20 +10,23 @@
   <div class="uk-section uk-padding-remove-bottom uk-overflow-hidden">
     <div class="uk-container uk-container-large" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200">
       <div class="uk-grid uk-flex-middle" uk-grid>
-        <div class="uk-width-3-5 uk-margin-large-bottom">
+        <div class="uk-width-3-5@m uk-margin-large-bottom">
           <h1 class="uk-h2" uk-scrollspy-class>
             Discover open <br> linked research<span class="uk-text-primary">.</span>
           </h1>
           <div *ngIf="showContentWithNumbers" class="uk-text-large uk-margin-medium-top" uk-scrollspy-class>
-						<div>A comprehensive and open dataset of research information covering {{numbers.publicationsSize.number|number}}{{numbers.publicationsSize.size}} {{openaireEntities.PUBLICATIONS.toLowerCase()}},</div>
-						<div>{{numbers.datasetsSize.number|number}}{{numbers.datasetsSize.size}} {{openaireEntities.DATASETS.toLowerCase()}}, 
-							{{numbers.softwareSize.number|number}}{{numbers.softwareSize.size}} {{openaireEntities.SOFTWARE.toLowerCase()}} items, from 
-							{{numbers.datasourcesSize.number|number}}{{numbers.datasourcesSize.size}} {{openaireEntities.DATASOURCES.toLowerCase()}}, linked to 
-							{{numbers.projectsSize.number|number}}{{numbers.projectsSize.size}} grants and 
-							{{numbers.organizationsSize.number|number}}{{numbers.organizationsSize.size}} {{openaireEntities.ORGANIZATIONS.toLowerCase()}}.</div>
+						<div>
+							A comprehensive and open dataset of research information covering 
+							<span class="uk-text-bold">{{numbers.publicationsSize.number|number}}{{numbers.publicationsSize.size}} {{openaireEntities.PUBLICATIONS.toLowerCase()}}</span>,
+							<span class="uk-text-bold">{{numbers.datasetsSize.number|number}}{{numbers.datasetsSize.size}} {{openaireEntities.DATASETS.toLowerCase()}}</span>, 
+							<span class="uk-text-bold">{{numbers.softwareSize.number|number}}{{numbers.softwareSize.size}} {{openaireEntities.SOFTWARE.toLowerCase()}}</span> items, from 
+							<span class="uk-text-bold">{{numbers.datasourcesSize.number|number}}{{numbers.datasourcesSize.size}} {{openaireEntities.DATASOURCES.toLowerCase()}}</span>, linked to 
+							<span class="uk-text-bold">{{numbers.projectsSize.number|number}}{{numbers.projectsSize.size}} grants</span> and 
+							<span class="uk-text-bold">{{numbers.organizationsSize.number|number}}{{numbers.organizationsSize.size}} {{openaireEntities.ORGANIZATIONS.toLowerCase()}}</span>.
+						</div>
 						<div>All linked together through citations and semantics.</div>
           </div>
-          <div [class.uk-invisible]="disableSelect" class="uk-margin-medium-top uk-width-3-5@m" uk-scrollspy-class>
+          <div [class.uk-invisible]="disableSelect" class="uk-margin-medium-top uk-width-4-5@m" uk-scrollspy-class>
 						<advanced-search-input (searchEmitter)="goTo(true)">
 							<entities-selection #entities [simpleView]="true" currentEntity="all" [selectedEntity]="selectedEntity"
 																	(selectionChange)="entityChanged($event)" (disableSelectEmitter)="disableSelectChange($event)"
@@ -45,14 +48,16 @@
 								routerLinkActive="router-link-active" routerLink="/sdg">
 								<span class="uk-flex uk-flex-middle">
 									<img src="assets/explore-assets/sdg-dot-img.svg" alt="SDGs logo" loading="lazy">
-									<span class="uk-margin-small-left">Sustainable Development Goals (SDGs)</span>
+									<span class="uk-margin-small-left uk-visible@xl">Sustainable Development Goals (SDGs)</span>
+									<span class="uk-margin-small-left uk-hidden@xl">SDGs</span>
 								</span>
 							</a>
 							<a class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
 								routerLinkActive="router-link-active" routerLink="/fos">
 								<span class="uk-flex uk-flex-middle">
 									<img src="assets/explore-assets/fos-icon.svg" alt="FOS logo" loading="lazy">
-									<span class="uk-margin-small-left">Fields of Science (FoS)</span>
+									<span class="uk-margin-small-left uk-visible@xl">Fields of Science (FoS)</span>
+									<span class="uk-margin-small-left uk-hidden@xl">FoS</span>
 								</span>
 							</a>
 						</div>