From 73d6a9f32f255823effa506d08090e51e0590528 Mon Sep 17 00:00:00 2001
From: Alex Martzios <alexandros.martzios@gmail.com>
Date: Thu, 20 Jul 2023 11:50:10 +0300
Subject: [PATCH] landing mobile: view all modal for FoS & SDGs. update how
 they appear

---
 landingPages/landing-utils/fos.component.ts | 14 +++++++++-
 landingPages/landing-utils/sdg.component.ts | 29 +++++++++++++--------
 2 files changed, 31 insertions(+), 12 deletions(-)

diff --git a/landingPages/landing-utils/fos.component.ts b/landingPages/landing-utils/fos.component.ts
index 39eaa6c5..c8445f9f 100644
--- a/landingPages/landing-utils/fos.component.ts
+++ b/landingPages/landing-utils/fos.component.ts
@@ -39,7 +39,7 @@ import {StringUtils} from "../../utils/string-utils.class";
 			</div>
 		</div>
 		<div class="uk-hidden@m">
-			<div class="uk-grid uk-grid-small uk-grid-divider" uk-grid>
+			<div *ngIf="!viewAll" class="uk-grid uk-grid-small uk-grid-divider" uk-grid>
 				<div class="uk-width-1-4 uk-text-meta">
           <div class="uk-text-xsmall" style="color: #EEB204">Beta</div>
 					{{title}}
@@ -57,6 +57,18 @@ import {StringUtils} from "../../utils/string-utils.class";
 					</div>
 				</div>
 			</div>
+      <div *ngIf="viewAll">
+        <div *ngFor="let subject of subjects; let i=index" class="uk-text-truncate">
+          <a *ngIf="properties.adminToolsPortalType != 'eosc'"
+             [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(subject.id)}">
+            {{subject.label}}
+          </a>
+          <a *ngIf="properties.adminToolsPortalType == 'eosc'" class="custom-external" target="_blank"
+             [href]="'https://explore.openaire.eu'+properties.searchLinkToResults+'?fos='+urlEncodeAndQuote(subject.id)">
+            {{subject.label}}
+          </a>
+        </div>
+      </div>
       <div class="uk-text-right uk-margin-small-top">
         <a *ngIf="subjects && subjects.length > threshold && !viewAll"
            (click)="viewAllClick();" class="view-more-less-link uk-text-truncate">
diff --git a/landingPages/landing-utils/sdg.component.ts b/landingPages/landing-utils/sdg.component.ts
index d16b40be..33302d62 100644
--- a/landingPages/landing-utils/sdg.component.ts
+++ b/landingPages/landing-utils/sdg.component.ts
@@ -46,19 +46,26 @@ import {StringUtils} from "../../utils/string-utils.class";
 			</div>
 		</div>
 		<div class="uk-hidden@m">
-      <div class="uk-text-xsmall" style="color: #EEB204">Beta</div>
-			<div class="uk-flex uk-flex-middle uk-flex-wrap">
-				<img src="assets/common-assets/common/The_Global_Goals_Icon_Color.svg"
-					loading="lazy" alt="sdg_colors" style="width:18px; height:18px">
-				<span class="uk-margin-xsmall-left uk-margin-xsmall-right uk-text-meta">SDGs:</span>
-				<div *ngFor="let subject of subjects.slice(0, viewAll?subjects.length:threshold); let i=index" class="uk-text-truncate">
+      <div *ngIf="!viewAll">
+        <div class="uk-text-xsmall" style="color: #EEB204">Beta</div>
+        <div class="uk-flex uk-flex-middle uk-flex-wrap">
+          <img src="assets/common-assets/common/The_Global_Goals_Icon_Color.svg"
+            loading="lazy" alt="sdg_colors" style="width:18px; height:18px">
+          <span class="uk-margin-xsmall-left uk-margin-xsmall-right uk-text-meta">SDGs:</span>
+          <div *ngFor="let subject of subjects.slice(0, viewAll?subjects.length:threshold); let i=index" class="uk-text-truncate">
+            <a [routerLink]=" properties.searchLinkToResults" [queryParams]="{'sdg': urlEncodeAndQuote(subject)}">{{subject}}</a>
+            <span *ngIf="(viewAll && i<subjects.length-1) || i<threshold-1">, &nbsp;</span>
+          </div>
+          <!-- <div>
+            {{subjects.slice(0, viewAll?subjects.length:threshold).join(", ")}}
+          </div> -->
+        </div>
+      </div>
+      <div *ngIf="viewAll">
+        <div *ngFor="let subject of subjects; let i=index" class="uk-text-truncate">
 					<a [routerLink]=" properties.searchLinkToResults" [queryParams]="{'sdg': urlEncodeAndQuote(subject)}">{{subject}}</a>
-          <span *ngIf="(viewAll && i<subjects.length-1) || i<threshold-1">, &nbsp;</span>
 				</div>
-				<!-- <div>
-					{{subjects.slice(0, viewAll?subjects.length:threshold).join(", ")}}
-				</div> -->
-			</div>
+      </div>
       <div class="uk-text-right uk-margin-small-top">
         <a *ngIf="subjects && subjects.length > threshold && !viewAll"
            (click)="viewAllClick();" class="view-more-less-link uk-link uk-text-truncate">