landingPages/landing-utils/availableOn.component.ts

@@ -11,19 +11,16 @@ declare var UIkit;
 		<ng-container *ngIf="availableOn && availableOn.length > 0">
 			<div class="uk-flex uk-flex-middle">
 				<ng-container *ngIf="availableOn[0].downloadUrl">
-					<span *ngIf="source" class="uk-margin-xsmall-right">Source: </span>
+					<span [class]="'uk-margin-xsmall-right ' + (availableOn[0].accessRightIcon == 'open_access' ? 'open-access' : 'closed-access')"
-					<span
-							[class]="'uk-margin-xsmall-right ' + (availableOn[0].accessRightIcon == 'open_access' ? 'open-access' : 'closed-access')"
 							uk-tooltip [title]="availableOn[0].accessRight ? availableOn[0].accessRight : 'Not available'">
 						<icon [name]="availableOn[0].accessRightIcon" [flex]="true" [ratio]="0.8"></icon>
 					</span>
-					<a [href]="availableOn[0].downloadUrl" target="_blank"
+					<a uk-tooltip="Source" target="_blank"
-						 class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder custom-external">
+						 class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
 						<span>{{sliceString(availableOn[0].downloadNames.join("; "), 20)}}</span>
-					</a>
+                        <span>
-				</ng-container>
-				<a class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
                           <icon [flex]="true" [name]="'expand_' + (isOpen?'less':'more')"></icon>
+                        </span>
 					</a>
 				    <div #dropElement uk-drop="mode: click; pos: bottom-left;"
 						 class="download-drop uk-card uk-card-default uk-padding-small uk-padding-remove-horizontal uk-text-small">
@@ -67,6 +64,7 @@ declare var UIkit;
 						</div>
 					</div>
 				</div>
+                </ng-container>
 			</div>
 		</ng-container>
   `
@@ -74,7 +72,6 @@ declare var UIkit;
 
 export class AvailableOnComponent {
   @Input() availableOn: HostedByCollectedFrom[];
-  @Input() source: boolean = true;
   /** @deprecated */
   @Output() viewAllClicked = new EventEmitter();
   @ViewChild("dropElement") dropElement: ElementRef;

landingPages/landing-utils/citeThis/citeThis.component.ts

@@ -257,7 +257,7 @@ export class CiteThisComponent implements OnInit, OnDestroy {
 
   /**
    * Based on this and citeproc library https://citation.js.org/api/tutorial-plugins.html
-   * if the template doesn;t exist add the CSL xml and the library will produce the citation
+   * if the template doesn't exist add the CSL xml and the library will produce the citation
    * @param template
    */
 

landingPages/landing-utils/entity-metadata.component.ts

@@ -2,13 +2,15 @@ import {Component, Input} from "@angular/core";
 import {EnvProperties} from "../../utils/properties/env-properties";
 import {properties} from "../../../../environments/environment";
 import {OpenaireEntities} from "../../utils/properties/searchFields";
+import {Project} from "../../utils/result-preview/result-preview";
 
 @Component({
   selector: 'entity-metadata',
   template: `
     <div class="uk-text-xsmall uk-text-emphasis uk-flex uk-flex-middle uk-flex-wrap">
       <!-- oa -->
-      <ng-container *ngIf="(openAccessMandatePublications != undefined && openAccessMandatePublications) || (openAccessMandateDatasets != undefined && openAccessMandateDatasets)">
+      <ng-container
+          *ngIf="(openAccessMandatePublications != undefined && openAccessMandatePublications) || (openAccessMandateDatasets != undefined && openAccessMandateDatasets)">
 					<span class="uk-margin-xsmall-right open-access">
 						<icon name="open_access" [flex]="true" [ratio]="0.8"></icon>
 					</span>
@@ -65,7 +67,7 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
       </ng-container>
       <ng-container *ngIf="startYear && endYear">
         <span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
-        <ng-container *ngIf="startDate">
+        <ng-container>
           <span>{{startYear}} - {{endYear}}</span>
         </ng-container>
       </ng-container>
@@ -92,7 +94,7 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
           <span class="uk-margin-xsmall-left">{{currentDate >= endDate ? '(Ended)' : '(Ending)'}}</span>
         </ng-container>
       </ng-container>
-      <ng-container *ngIf="status && status != ''">
+      <ng-container *ngIf="status">
         <span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
         <span>{{status}}</span>
       </ng-container>
@@ -105,8 +107,8 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
         <span>Embargo end date: {{embargoEndDate | date: 'dd MMM yyyy'}}</span>
       </ng-container>
       <span *ngIf="underCuration">
-          . <span title="{{buildCurationTooltip()}}"
+        <span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
-                  uk-tooltip="pos:bottom-right; delay:10;"
+        <span title="{{buildCurationTooltip()}}"uk-tooltip="pos:bottom-right; delay:10;"
               class="uk-text-primary">Under curation</span>
       </span>
       <!-- countries -->
@@ -130,12 +132,41 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
           <span>{{programmingLanguage}}</span>
         </ng-container>
       </ng-container>
+      <!-- Projects -->
+      <ng-container *ngIf="projects && projects.length > 0">
+        <span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
+        <span uk-tooltip="Projects">
+          <span *ngFor="let project of projects.slice(0,10) let i=index">
+            <span>
+              {{project.funderShortname ? project.funderShortname : project.funderName}}
+            </span>
+            <span *ngIf="project.acronym || project.title">
+              | {{ project.acronym ? project.acronym : (project.title.length > 25 ?
+                project.title.substring(0, 25) + '...' : project.title)}}
+            </span>
+            <span *ngIf="project.code"> ({{project.code}})</span>
+            <span *ngIf="i < projects.length-1">,</span>
+          </span>
+          <span *ngIf="projects.length > 10">...</span>
+        </span>
+      </ng-container>
+      <!-- Subjects -->
+      <ng-container *ngIf="subjects && subjects.length > 0">
+        <span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
+        <span uk-tooltip="Subjects">
+          <span *ngFor="let subject of  subjects.slice(0,10) let i = index">
+            <span>{{subject}}</span>
+            <span>{{(i < (subjects.slice(0, 10).length - 1)) ? ", " : ""}}</span>
+            <span>{{(i == subjects.slice(0, 10).length - 1 && subjects.length > 10) ? "..." : ""}}</span>
+          </span>
+        </span>
+      </ng-container>
       <!-- published info -->
       <showPublisher [publisher]="publisher" [journal]="journal" [properties]="properties"></showPublisher>
       <!-- data provider labels -->
       <ng-container *ngIf="compatibility && !(compatibility.info == 'not available' && type == 'service')">
         <span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
-        <span title="Compatibility">
+        <span uk-tooltip title="Compatibility">
           <a *ngIf="compatibility.id"
              [queryParams]="{datasourceId: compatibility.id}" routerLinkActive="router-link-active"
              [routerLink]="properties.searchLinkToDataProvider.split('?')[0]">
@@ -154,6 +185,10 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
           </span>
         </span>
       </ng-container>
+      <ng-container *ngIf="compatibilityString">
+        <span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
+        <span uk-tooltip title="Compatibility">{{compatibilityString}}</span>
+      </ng-container>
       <ng-container
           *ngIf="aggregationStatus && aggregationStatus.fulltexts && aggregationStatus.fulltexts > 0">
         <span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
@@ -194,12 +229,15 @@ export class EntityMetadataComponent {
   @Input() countries;
   @Input() languages;
   @Input() programmingLanguages;
+  @Input() compatibilityString: string;
   @Input() compatibility; // data provider landing
   @Input() aggregationStatus; // data provider landing
   @Input() thematic: boolean; // data provider landing
   @Input() type; // data provider landing
   @Input() provenanceAction: string; // search result
   @Input() relationName: string; // search result
+  @Input() projects: Project[];
+  @Input() subjects: string[];
   
   properties: EnvProperties = properties;
   public openaireEntities = OpenaireEntities;

landingPages/result/resultLanding.component.ts

@@ -948,7 +948,7 @@ export class ResultLandingComponent {
 	// 	this.sdgSelectionModal.open();
 	// }
 
-	private openFosSelectionModal() {
+	/*private openFosSelectionModal() {
 		this.fosSelectionModal.cancelButton = false;
 		this.fosSelectionModal.alertTitle = "Please select FOS that are the most relevant for this publication.";
 		this.fosSelectionModal.open();
@@ -956,5 +956,5 @@ export class ResultLandingComponent {
 
 	public sdgModalOutput() {
 		this.sdgFosSuggest.sdgModalOutput();
-	}
+	}*/
 }

searchPages/searchUtils/advancedSearchForm.component.html

@@ -163,12 +163,15 @@
     </div>
     <div class="uk-flex uk-flex-center uk-child-width-1-1">
       <ng-container *ngIf="entitiesSelection">
-        <advanced-search-input [class.uk-hidden]="disableSelect" [dark]="dark" [disabled]="isDisabled" (searchEmitter)="simpleKeywordChanged()">
+        <advanced-search-input [class.uk-hidden]="disableSelect" [dark]="dark" [iconPosition]="isMobile?'left':'right'" [disabled]="isDisabled" (searchEmitter)="simpleKeywordChanged()">
           <entities-selection [simpleView]="true" [currentEntity]="entityType"
                               (selectionChange)="simpleEntityChanged($event)" (disableSelectEmitter)="disableSelectChange($event)"
                               [onChangeNavigate]="true" [customFilter]="customFilter" class="uk-width-2-5"></entities-selection>
           <div class="uk-width-expand" input placeholder="Scholary works" [searchable]="true" [hint]="formPlaceholderText"
                [(value)]="selectedFields[0].value" tooltip="true"></div>
+          <a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle>
+            <icon name="filters"></icon>
+          </a>
         </advanced-search-input>
         <div *ngIf="selectedFields[0] && disableSelect" search-input [disabled]="isDisabled" [(value)]="selectedFields[0].value"
              [placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()" [iconPosition]="isMobile?'left':'right'">

searchPages/searchUtils/searchResult.component.html

@@ -1,6 +1,6 @@
-<ul class="uk-list uk-list-large uk-margin" [class.uk-list-xlarge]="!isMobile" [ngClass]="custom_class">
+<ul class="uk-list uk-margin" [ngClass]="custom_class">
   <errorMessages [status]="[status]" [type]="'results'"></errorMessages>
-  <li *ngFor="let result of previewResults" [class.uk-border-bottom]="!isMobile">
+  <li *ngFor="let result of previewResults">
 		<result-preview [properties]="properties" [showOrganizations]="showOrganizations"
 						[showSubjects]="showSubjects" [result]="result" [showEnermaps]="showEnermaps"
 						[isCard]="isMobile" [isMobile]="isMobile">

sharedComponents/advanced-search-input/advanced-search-input.component.ts

@@ -22,7 +22,10 @@ import {EntitiesSelectionComponent} from "../../searchPages/searchUtils/entities
             <ng-content></ng-content>
           </div>
         </div>
-        <div class="uk-width-auto">
+        <div class="uk-width-auto filters-toggle">
+          <ng-content select="[filters-toggle]"></ng-content>
+        </div>
+        <div class="uk-width-auto" [class.uk-flex-first]="iconPosition === 'left'">
           <div class="search-icon" [class.disabled]="disabled" (click)="searchEmitter.emit()">
             <icon name="search" [flex]="true" ratio="1.3"></icon>
           </div>
@@ -34,6 +37,7 @@ import {EntitiesSelectionComponent} from "../../searchPages/searchUtils/entities
 export class AdvancedSearchInputComponent implements AfterContentInit, OnDestroy {
   @ContentChildren(InputComponent) inputs: QueryList<InputComponent>;
   @ContentChildren(EntitiesSelectionComponent) entities: QueryList<EntitiesSelectionComponent>;
+  @Input() iconPosition: 'left' | 'right' = 'right';
   @Input() disabled: boolean = false;
   @Input() searchInputClass: string = 'inner';
   @Input() dark: boolean;

utils/authors/showAuthors.component.ts

@@ -83,9 +83,9 @@ import {properties} from "../../../../environments/environment";
           +{{authors.length-authorsLimit | number}} Authors
         </a>
       </span>
+      <div *ngIf="viewAll && lessBtn" class="uk-text-small">
+        <a (click)="viewAll = !viewAll; lessBtn=false;">View less</a>
       </div>
-    <div *ngIf="viewAll && lessBtn" class="uk-width-1-1 uk-text-right uk-text-small">
-      <a (click)="viewAll = !viewAll; lessBtn=false;" class="view-more-less-link">View less authors</a>
     </div>
 
     <modal-alert #authorsModal>

utils/entity-actions/entity-actions.component.ts

@@ -0,0 +1,80 @@
+import {Component, Input, ViewChild} from "@angular/core";
+import {StringUtils} from "../string-utils.class";
+import {RouterHelper} from "../routerHelper.class";
+import {properties} from "../../../../environments/environment";
+
+@Component({
+  selector: 'entity-actions',
+  template: `
+    <div class="uk-grid uk-grid-small uk-child-width-auto" uk-grid>
+      <a *ngIf="linking"
+         [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'], [id,type,linkTo])"
+         routerLinkActive="router-link-active" routerLink="/participate/direct-claim"
+         [title]="'Link this '+getTypeName()+' to ...'"
+         [attr.uk-tooltip]="'pos: bottom; cls: uk-active  uk-text-small uk-padding-small'"
+         class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
+        <icon [flex]="true" [ratio]="0.7" name="link_to" visuallyHidden="link"></icon>
+        <span class="uk-margin-xsmall-left">Link to</span>
+      </a>
+      <a *ngIf="share" (click)="openAddThisModal()"
+         class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
+        <icon [flex]="true" [ratio]="0.8" name="share" visuallyHidden="share"></icon>
+        <span class="uk-margin-xsmall-left">Share</span>
+      </a>
+      <a *ngIf="cite" (click)="openCiteModal()"
+         class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
+        <icon [flex]="true" [ratio]="0.7" name="cite" visuallyHidden="cite"></icon>
+        <span class="uk-margin-xsmall-left">Cite</span>
+      </a>
+      <ng-content></ng-content>
+    </div>
+    <modal-alert *ngIf="cite" #citeModal>
+      <citeThis *ngIf="citeThisClicked" [result]="result" [id]="id"
+                [type]="getTypeName().toLowerCase()" [piwikSiteId]="piwikSiteId"></citeThis>
+    </modal-alert>
+    <modal-alert *ngIf="share" #addThisModal classBody="uk-flex uk-flex-center uk-flex-middle">
+      <addThis [url]="url"></addThis>
+    </modal-alert>
+  `
+})
+export class EntityActionsComponent {
+  @Input() result: any;
+  @Input() type: string;
+  @Input() id: string;
+  @Input() linking: boolean = false;
+  @Input() share: boolean = false;
+  @Input() cite: boolean = false;
+  @Input() url: string;
+  public piwikSiteId = properties.piwikSiteId;
+  public citeThisClicked: boolean;
+  public routerHelper: RouterHelper = new RouterHelper();
+  @ViewChild('citeModal') citeModal;
+  @ViewChild('addThisModal') addThisModal;
+
+  constructor() {
+  }
+
+  get linkTo():string {
+    return this.type === 'project'?'result':'project';
+  }
+
+  public getTypeName(): string {
+    return StringUtils.getEntityName(this.type, false);
+  }
+
+  public openCiteModal() {
+    this.citeThisClicked = true;
+    this.citeModal.cancelButton = false;
+    this.citeModal.okButton = false;
+    this.citeModal.alertTitle = "Cite this " + this.getTypeName();
+    this.citeModal.open();
+  }
+
+  public openAddThisModal() {
+    console.log(this.url);
+    this.addThisModal.cancelButton = false;
+    this.addThisModal.okButton = false;
+    this.addThisModal.alertTitle = "Share this " + this.getTypeName() + " in your social networks";
+    this.addThisModal.open();
+  }
+}

utils/entity-actions/entity-actions.module.ts

@@ -0,0 +1,17 @@
+import {NgModule} from "@angular/core";
+import {CommonModule} from "@angular/common";
+import {EntityActionsComponent} from "./entity-actions.component";
+import {RouterLinkWithHref} from "@angular/router";
+import {IconsModule} from "../icons/icons.module";
+import {AlertModalModule} from "../modal/alertModal.module";
+import {CiteThisModule} from "../../landingPages/landing-utils/citeThis/citeThis.module";
+import {LandingModule} from "../../landingPages/landing-utils/landing.module";
+
+@NgModule({
+  imports: [CommonModule, RouterLinkWithHref, IconsModule, AlertModalModule, CiteThisModule, LandingModule],
+  declarations: [EntityActionsComponent],
+  exports: [EntityActionsComponent]
+})
+export class EntityActionsModule {
+
+}

utils/result-preview/result-preview.component.html

@@ -1,5 +1,6 @@
-<div *ngIf="result" [ngClass]="{'uk-card uk-card-default': isCard}">
+<div *ngIf="result" class="uk-card" [class.uk-card-default]="isMobile">
-	<div [ngClass]="{'uk-card-body': isCard}">
+  <div class="uk-padding-small">
+    <div>
       <div class="uk-grid uk-flex uk-flex-middle">
         <div *ngIf="properties.enermapsURL && showEnermaps && result.enermapsId"
              class=" uk-inline uk-width-auto  uk-text-center uk-visible-toggle">
@@ -66,76 +67,21 @@
             </div>
             <!-- Metadata -->
             <div class="uk-margin-xsmall-top">
-						<entity-metadata [entityType]="type" [types]="result.types" [startYear]="result.startYear?.toString()" [endYear]="result.endYear?.toString()"
+              <entity-metadata [entityType]="type" [types]="result.types" [startYear]="result.startYear?.toString()"
-														 [year]="result.year?.toString()" [openAccessMandatePublications]="result.openAccessMandatePublications"
+                               [endYear]="result.endYear?.toString()"
-														 [openAccessMandateDatasets]="result.openAccessMandateDatasets" [date]="" [embargoEndDate]="result.embargoEndDate"
+                               [year]="result.year?.toString()"
+                               [openAccessMandatePublications]="result.openAccessMandatePublications"
+                               [openAccessMandateDatasets]="result.openAccessMandateDatasets" [date]=""
+                               [embargoEndDate]="result.embargoEndDate"
                                [publisher]="result.publisher" [countries]="result.countries"
                                [languages]="result.languages" [programmingLanguages]="result.programmingLanguages"
-														 [compatibility]="result.compatibility" [type]="type"
+                               [compatibilityString]="result.compatibility" [type]="type" [projects]="result.projects"
+                               [subjects]="result.subjects"
               ></entity-metadata>
             </div>
           </div>
-				<!-- 2nd section (labels only) -->
+          <!-- 2nd section (funders, budget, authors, PIDs, publisher etc.) -->
-				<!--<div class="uk-margin-bottom">
+          <div class="uk-text-small uk-margin-small-bottom uk-visible@m">
-					&lt;!&ndash; Labels &ndash;&gt;
-					<div>
-						<span
-								*ngIf="result.accessMode && result.accessMode.toLowerCase() !== 'not available'"
-								class="uk-label uk-text-truncate " [ngClass]="'uk-label-' + accessClass(result.accessMode)"
-								title="Access Mode">
-							{{result.accessMode}}
-						</span>{{' '}}
-						<span
-								*ngIf="result.openAccessMandatePublications && (!result.openAccessMandateDatasets)"
-								class="uk-label uk-label-success uk-text-truncate"
-								title="Open Access mandate for {{openaireEntities.PUBLICATIONS}}">
-							Open Access mandate for {{openaireEntities.PUBLICATIONS}}
-						</span>{{' '}}
-						<span
-								*ngIf="result.openAccessMandateDatasets != undefined && result.openAccessMandateDatasets && (result.openAccessMandatePublications == undefined || !result.openAccessMandatePublications)"
-								class="uk-label uk-label-success uk-text-truncate "
-								title="Open Access mandate for {{openaireEntities.DATASETS}}">
-							Open Access mandate for {{openaireEntities.DATASETS}}
-						</span>{{' '}}
-						<span
-								*ngIf="result.openAccessMandatePublications != undefined && result.openAccessMandatePublications && result.openAccessMandateDatasets != undefined && result.openAccessMandateDatasets"
-								class="uk-label uk-label-success uk-text-truncate"
-								title="Open Access mandate for {{openaireEntities.PUBLICATIONS}} and {{openaireEntities.DATASETS}}">
-							Open Access mandate for {{openaireEntities.PUBLICATIONS}} and {{openaireEntities.DATASETS}}
-						</span>{{' '}}
-						<span *ngIf="result.languages && result.languages.length > 0">
-							<span
-									*ngFor="let language of result.languages"
-									class="uk-label" title="Language">
-								{{language}}
-							</span>{{' '}}
-						</span>
-						<span *ngIf="result.programmingLanguages && result.programmingLanguages.length > 0">
-							<span
-									*ngFor="let programmingLanguage of result.programmingLanguages"
-									class="uk-label" title="Programming Language">
-								{{programmingLanguage}}
-							</span>{{" "}}
-						</span>
-						&lt;!&ndash;						<span &ndash;&gt;
-						&lt;!&ndash;								*ngIf="result.sc39" class="uk-label" title="Special Clause 39">&ndash;&gt;
-						&lt;!&ndash;							Special Clause 39&ndash;&gt;
-						&lt;!&ndash;						</span>{{' '}}&ndash;&gt;
-						<span
-								*ngIf="result.compatibility && result.compatibility != '' && result.compatibility.toLowerCase() != 'not yet registered'"
-								class="uk-label" title="Compatibility">
-							{{result.compatibility}}
-						</span>{{' '}}
-						<span
-								*ngIf="result.compatibility != undefined && result.compatibility != '' && result.compatibility.toLowerCase() == 'not yet registered'
-											&& result.resultType != 'service'"
-								class="uk-label" [class.uk-label-danger]="deposit" title="OpenAIRE Compatibility">
-							{{result.compatibility}} <span *ngIf="properties.adminToolsPortalType == 'eosc'">in OpenAIRE</span>
-						</span>{{' '}}
-					</div>
-				</div>-->
-				<!-- 3rd section (funders, budget, authors, PIDs, publisher etc.) -->
-				<div class="uk-text-small uk-margin-small-bottom">
             <!-- Funder -->
             <div *ngIf="result.funderShortname || result.code" class="uk-margin-xsmall-bottom">
 						<span *ngIf="result.funderShortname">
@@ -166,30 +112,14 @@
 						</span>
             </div>
             <!-- Authors -->
-					<div *ngIf="result.authors" class="uk-flex uk-margin-xsmall-bottom">
+            <div *ngIf="result.authors" class="uk-margin-xsmall-bottom">
-						<showAuthors [authors]="result.authors" [authorsLimit]=10 [modal]="modal"
+              <showAuthors [authors]="result.authors" [authorsLimit]=4 [modal]="modal"
-												 [showAll]=false></showAuthors>
+                           [showAll]=true></showAuthors>
             </div>
             <!-- Identifiers -->
             <div *ngIf="result.identifiers && result.identifiers.size > 0" class="uk-margin-xsmall-bottom">
               <showIdentifiers [identifiers]="result.identifiers"></showIdentifiers>
             </div>
-					<!-- Projects -->
-					<div *ngIf="result.projects && result.projects.length > 0" class="uk-margin-xsmall-bottom">
-						<span class="uk-text-meta"> Project: </span>
-						<span *ngFor="let project of result.projects.slice(0,10) let i=index">
-							<span>
-								{{project.funderShortname ? project.funderShortname : project.funderName}}
-							</span>
-							<span *ngIf="project.acronym || project.title">
-								| {{ project.acronym ? project.acronym : (project.title.length > 25 ?
-                  project.title.substring(0, 25) + '...' : project.title)}}
-							</span>
-							<span *ngIf="project.code"> ({{project.code}})</span>
-							<span *ngIf="i < result.projects.length-1">,</span>
-						</span>
-						<span *ngIf="result.projects.length > 10">...</span>
-					</div>
             <!-- Organizations -->
             <div *ngIf="showOrganizations && result.organizations && result.organizations.length > 0"
                  class="uk-margin-xsmall-bottom">
@@ -219,28 +149,18 @@
               </a>
             </span>
             </div>
-					<!-- Subjects -->
-					<div *ngIf="showSubjects && result.subjects && result.subjects.length > 0"
-							 class="uk-margin-xsmall-bottom">
-						<span class="uk-text-meta">Subject: </span>
-						<span *ngFor="let subject of  result.subjects.slice(0,10) let i = index">
-							<span>{{subject}}</span>
-							<span>{{(i < (result.subjects.slice(0, 10).length - 1)) ? ", " : ""}}</span>
-							<span>{{(i == result.subjects.slice(0, 10).length - 1 && result.subjects.length > 10) ? "..." : ""}}</span>
-						</span>
           </div>
-				</div>
+          <!-- 3rd section (description) -->
-				<!-- 4th section (description) -->
+          <div class="uk-text-small uk-visible@m">
-				<div class="uk-text-small">
             <!-- Description -->
-					<div *ngIf="result.description" class="multi-line-ellipsis lines-3">
+            <div *ngIf="result.description" class="multi-line-ellipsis lines-2">
-						<p class="uk-text-meta" [innerHTML]="result.description"></p>
+              <p class="uk-margin-remove" [innerHTML]="result.description"></p>
             </div>
           </div>
           <!-- 5th section(deposit only) -->
           <div>
-					<span class="uk-flex uk-flex-right uk-margin-small-top">
+            <span *ngIf="result.websiteURL && promoteWebsiteURL" class="uk-flex uk-flex-right uk-margin-small-top">
-						<a *ngIf="result.websiteURL && promoteWebsiteURL" href="{{result.websiteURL}}" target="_blank" type="submit"
+              <a href="{{result.websiteURL}}" target="_blank" type="submit"
                  class="uk-float-right uk-margin-small-left uk-display-inline-block uk-text-uppercase uk-button uk-button-text">
                   <span class="uk-flex uk-flex-middle">
                     <icon name="file_upload" type="outlined" [flex]="true" class="uk-margin-small-right"></icon>
@@ -251,16 +171,19 @@
           </div>
         </div>
       </div>
-	</div>
+      <div *ngIf="result.hostedBy_collectedFrom || hasActions || result.measure?.bip.length || result.measure?.counts.length"
-	<!--&& loggedIn (card footer)-->
+          class="uk-text-small uk-margin-top" [class.uk-border-bottom]="!isMobile"
-	<div *ngIf="result.hostedBy_collectedFrom || result.measure?.bip.length || result.measure?.counts.length"
+           [class.uk-visible@m]="!result.measure?.bip.length && result.measure?.counts.length">
-			 class="uk-text-small" [class.uk-visible@m]="!result.measure?.bip.length && result.measure?.counts.length" [ngClass]="{'uk-card-footer': isCard}">
+        <div
-		<div class="uk-grid uk-grid-small uk-flex-between uk-flex-middle uk-grid-divider uk-margin-xsmall-bottom" uk-grid>
+            class="uk-grid uk-grid-small uk-flex-between uk-text-xsmall uk-flex-middle uk-grid-divider uk-margin-xsmall-bottom"
-			<div *ngIf="result.hostedBy_collectedFrom" class="uk-width-auto uk-visible@m">
+            uk-grid>
-				<availableOn [availableOn]="result.hostedBy_collectedFrom" [source]="false"></availableOn>
+          <div *ngIf="result.hostedBy_collectedFrom?.length" class="uk-width-auto uk-visible@m">
+            <availableOn [availableOn]="result.hostedBy_collectedFrom"></availableOn>
           </div>
           <div *ngIf="hasActions" class="uk-width-expand uk-visible@m">
-				<span class="uk-grid uk-grid-small uk-child-width-auto uk-text-xsmall" uk-grid>
+            <entity-actions [cite]="cite" [share]="share" [linking]="linking" [type]="result.resultType"
+                            [result]="result" [id]="result.objId"
+                            [url]="properties.domain + properties.baseLink + url + '?' + urlParam + '=' + result.id">
 					<span *ngIf="orcid">
 						<orcid-work *ngIf="showOrcid && result.identifiers && result.identifiers.size > 0"
                         [resultId]="result.relcanId" [resultTitle]="result.title"
@@ -281,49 +204,59 @@
 							</span>
 						</span>
 					</span>
-				</span>
+            </entity-actions>
           </div>
           <div *ngIf="result.measure?.bip.length || result.measure?.counts.length"
                class="uk-text-xsmall uk-width-auto metrics uk-flex uk-flex-middle uk-flex-right uk-text-meta">
             <ng-container *ngIf="result.measure?.bip.length">
               <a class="uk-flex uk-flex-middle uk-link-reset">
-						<icon customClass="bip-icon-hover" [flex]="true" [ratio]="0.7" [name]="result.measure.bip[0].icon"></icon>
+                <icon customClass="bip-icon-hover" [flex]="true" [ratio]="0.7"
+                      [name]="result.measure.bip[0].icon"></icon>
                 <span class="uk-margin-xsmall-left">{{result.measure.bip[0].value}}</span>
               </a>
-					<div uk-drop="pos: top-left" class="uk-card uk-card-default uk-border uk-box-no-shadow uk-padding-small">
+              <div uk-drop="pos: top-right" class="uk-card uk-card-default uk-border uk-box-no-shadow uk-padding-small">
                 <table>
                   <tr *ngFor="let metric of result.measure.bip">
-								<td class="bip-icon"><icon [flex]="true" [ratio]="0.7" [name]="metric.icon"></icon></td>
+                    <td class="bip-icon">
+                      <icon [flex]="true" [ratio]="0.7" [name]="metric.icon"></icon>
+                    </td>
                     <td class="uk-text-capitalize">{{metric.name}}</td>
                     <td class="uk-text-bolder">{{metric.value}}</td>
                   </tr>
                 </table>
                 <div class="uk-margin-top uk-flex uk-flex-middle uk-flex-center">
-							<img class="uk-margin-xsmall-right" width="15" src="assets/common-assets/bip-minimal.svg" loading="lazy" alt="BIP!">
+                  <img class="uk-margin-xsmall-right" width="15" src="assets/common-assets/bip-minimal.svg"
+                       loading="lazy" alt="BIP!">
                   <span class="uk-text-uppercase">Powered by <span class="uk-text-bolder">BIP!</span></span>
                 </div>
               </div>
             </ng-container>
             <ng-container *ngIf="result.measure?.counts.length">
               <a class="uk-flex uk-flex-middle uk-margin-small-left uk-link-reset">
-						<icon class="text-usage-counts-hover" [flex]="true" [ratio]="0.8" [name]="result.measure.counts[0].icon"></icon>
+                <icon class="text-usage-counts-hover" [flex]="true" [ratio]="0.8"
+                      [name]="result.measure.counts[0].icon"></icon>
                 <span class="uk-margin-xsmall-left">{{result.measure.counts[0].value}}</span>
               </a>
-					<div uk-drop="pos: top-left" class="uk-card uk-card-default uk-border uk-box-no-shadow uk-padding-small">
+              <div uk-drop="pos: top-right" class="uk-card uk-card-default uk-border uk-box-no-shadow uk-padding-small">
                 <table>
                   <tr *ngFor="let metric of result.measure.counts">
-							<td class="text-usage-counts"><icon [flex]="true" [ratio]="0.7" [name]="metric.icon"></icon></td>
+                    <td class="text-usage-counts">
+                      <icon [flex]="true" [ratio]="0.7" [name]="metric.icon"></icon>
+                    </td>
                     <td class="uk-text-capitalize">{{metric.name}}</td>
                     <td class="uk-text-bolder">{{metric.value}}</td>
                   </tr>
                 </table>
                 <div class="uk-margin-top uk-flex uk-flex-middle uk-flex-center">
                   <span class="uk-text-uppercase">Powered by </span>
-						<img class="uk-margin-xsmall-left" width="15" src="assets/common-assets/logo-small-usage-counts.png" loading="lazy" alt="BIP!">
+                  <img class="uk-margin-xsmall-left" width="15" src="assets/common-assets/logo-small-usage-counts.png"
+                       loading="lazy" alt="BIP!">
                 </div>
               </div>
             </ng-container>
           </div>
         </div>
       </div>
+    </div>
+  </div>
 </div>

utils/result-preview/result-preview.component.ts

@@ -22,14 +22,15 @@ export class ResultPreviewComponent implements OnInit, OnChanges {
   @Input() modal: AlertModal = null;
   @Input() promoteWebsiteURL: boolean = false;
   @Input() hasLink: boolean = true;
+  /**
+   * @deprecated
+   * */
   @Input() isCard: boolean = false;
   @Input() isMobile: boolean = false;
   public routerHelper: RouterHelper = new RouterHelper();
   public urlParam: string;
   public url: string;
   @Input() externalUrl: string;
-  
-  public dataProviderUrl = properties.searchLinkToDataProvider.split('?')[0];
   @Input() showOrcid: boolean = true;
   @Input() showEnermaps: boolean = false;
   @Input() deposit: boolean = false;

utils/result-preview/result-preview.module.ts

@@ -8,9 +8,10 @@ import {OrcidModule} from "../../orcid/orcid.module";
 import {IconsModule} from "../icons/icons.module";
 import {IconsService} from "../icons/icons.service";
 import {cite, fire, graph, landmark, link, link_to, quotes, rocket, versions} from "../icons/icons";
+import {EntityActionsModule} from "../entity-actions/entity-actions.module";
 
 @NgModule({
-  imports: [CommonModule, RouterModule, ShowAuthorsModule, ResultLandingUtilsModule, OrcidModule, IconsModule],
+  imports: [CommonModule, RouterModule, ShowAuthorsModule, ResultLandingUtilsModule, OrcidModule, IconsModule, EntityActionsModule],
   declarations: [ResultPreviewComponent],
   exports: [ResultPreviewComponent]
 })