landing pages small screens: remove sidebar and add actions at the top
This commit is contained in:
parent
957a46ad84
commit
50a921ba43
|
|
@ -4,7 +4,7 @@
|
|||
<div *ngIf="!showFeedback" class="uk-grid">
|
||||
|
||||
<!-- left box - actions -->
|
||||
<div *ngIf="dataProviderInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color">
|
||||
<div *ngIf="dataProviderInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color uk-visible@s">
|
||||
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center landing-sidebar-height uk-sticky"
|
||||
uk-sticky="bottom: true" [attr.offset]="offset">
|
||||
<div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
|
||||
|
|
@ -75,9 +75,22 @@
|
|||
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
||||
<!-- schema.org-->
|
||||
<schema2jsonld [data]=dataProviderInfo
|
||||
[URL]="canonicalUrl"
|
||||
type="datasource"
|
||||
[otherURL]="(dataProviderInfo.provenance)?provenanceUrls:null"></schema2jsonld>
|
||||
[URL]="canonicalUrl"
|
||||
type="datasource"
|
||||
[otherURL]="(dataProviderInfo.provenance)?provenanceUrls:null"></schema2jsonld>
|
||||
<!-- Actions for mobile viewport -->
|
||||
<div class="uk-flex uk-flex-right uk-margin-medium-bottom uk-hidden@s">
|
||||
<div>
|
||||
<a (click)="openAddThisModal()"
|
||||
[title]="'Share this '+openaireEntities.PROJECT+' in your social networks'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="share" visuallyHidden="share"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
|
||||
[texts]="pageContents['top']"></helper>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,35 +3,35 @@
|
|||
<div class="organization">
|
||||
<div *ngIf="!showFeedback" class="uk-grid" uk-grid>
|
||||
<!-- left column -->
|
||||
<div *ngIf="organizationInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color">
|
||||
<div class="uk-flex uk-flex-column uk-flex-right landing-sidebar-height uk-sticky"
|
||||
uk-sticky="bottom: true" [attr.offset]="offset">
|
||||
<div class="uk-margin-large-bottom uk-align-center">
|
||||
<div class="uk-text-meta uk-text-uppercase">Actions</div>
|
||||
<ul class="uk-list">
|
||||
<!-- Share -->
|
||||
<li class="uk-text-center">
|
||||
<a (click)="openAddThisModal()" [title]="'Share this organization in your social networks'"
|
||||
<div *ngIf="organizationInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color uk-visible@s">
|
||||
<div class="uk-flex uk-flex-column uk-flex-right landing-sidebar-height uk-sticky"
|
||||
uk-sticky="bottom: true" [attr.offset]="offset">
|
||||
<div class="uk-margin-large-bottom uk-align-center">
|
||||
<div class="uk-text-meta uk-text-uppercase">Actions</div>
|
||||
<ul class="uk-list">
|
||||
<!-- Share -->
|
||||
<li class="uk-text-center">
|
||||
<a (click)="openAddThisModal()" [title]="'Share this organization in your social networks'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="share" visuallyHidden="share"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="share" visuallyHidden="share"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<!-- Download -->
|
||||
<li class="uk-text-center"
|
||||
[title]="'Download reports'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="buildFunderOptions(); openDownloadReportsModal()">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="download" visuallyHidden="download"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
[title]="'Download reports'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="buildFunderOptions(); openDownloadReportsModal()">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="download" visuallyHidden="download"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- center/right column -->
|
||||
<div class="uk-width-expand uk-padding-remove uk-background-default">
|
||||
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-flex-middle">
|
||||
|
|
@ -76,6 +76,25 @@
|
|||
[URL]="properties.domain + properties.baseLink+this.properties.searchLinkToOrganization+organizationInfo.relcanId"
|
||||
type="organization">
|
||||
</schema2jsonld>
|
||||
<!-- Actions for mobile viewport -->
|
||||
<div class="uk-flex uk-flex-right uk-margin-medium-bottom uk-hidden@s">
|
||||
<div class="uk-margin-small-right">
|
||||
<a (click)="openAddThisModal()" [title]="'Share this organization in your social networks'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="share" visuallyHidden="share"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div [title]="'Download reports'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="buildFunderOptions(); openDownloadReportsModal()">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="download" visuallyHidden="download"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Helper -->
|
||||
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
|
||||
[texts]="pageContents['top']"></helper>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<div *ngIf="!showFeedback" class="uk-grid">
|
||||
|
||||
<!-- left box - actions -->
|
||||
<div *ngIf="projectInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color">
|
||||
<div *ngIf="projectInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color uk-visible@s">
|
||||
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center landing-sidebar-height uk-sticky"
|
||||
uk-sticky="bottom: true" [attr.offset]="offset">
|
||||
<div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
|
||||
|
|
@ -113,8 +113,57 @@
|
|||
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
||||
<!-- schema.org-->
|
||||
<schema2jsonld [data]=projectInfo
|
||||
[URL]="properties.domain+properties.baseLink+properties.searchLinkToProject+projectId"
|
||||
type="project"></schema2jsonld>
|
||||
[URL]="properties.domain+properties.baseLink+properties.searchLinkToProject+projectId"
|
||||
type="project"></schema2jsonld>
|
||||
<!-- Actions for mobile viewport -->
|
||||
<div class="uk-flex uk-flex-right uk-margin-medium-bottom uk-hidden@s">
|
||||
<div class="uk-margin-small-right">
|
||||
<a (click)="openAddThisModal()"
|
||||
[title]="'Share this project in your social networks'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="share" visuallyHidden="share"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-margin-small-right"
|
||||
[title]="'<span class=\'uk-flex uk-flex-middle\'>Link this project to '+openaireEntities.RESULTS+'<span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[projectId, 'project','result'])"
|
||||
routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="link" visuallyHidden="link"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div *ngIf="isRouteAvailable('participate/deposit/learn-how')" class="uk-margin-small-right"
|
||||
[title]="'<span class=\'uk-flex uk-flex-middle\'>Deposit your research <span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<a routerLinkActive="router-link-active" routerLink="/participate/deposit/learn-how">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="upload" visuallyHidden="upload"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="uk-margin-small-right"
|
||||
[title]="'Embed results'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openEmbedResultsModal()">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="code_off" visuallyHidden="code"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class=""
|
||||
[title]="'Download report'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadReportModal()">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="download" visuallyHidden="download"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
|
||||
[texts]="pageContents['top']"></helper>
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<div *ngIf="!showFeedback" class="uk-grid">
|
||||
|
||||
<!-- left box - actions -->
|
||||
<div *ngIf="resultLandingInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color">
|
||||
<div *ngIf="resultLandingInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color uk-visible@s">
|
||||
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center landing-sidebar-height uk-sticky"
|
||||
uk-sticky="bottom: true" [attr.offset]="offset">
|
||||
<div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
|
||||
|
|
@ -112,7 +112,54 @@
|
|||
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
||||
<!-- schema.org-->
|
||||
<schema2jsonld *ngIf="resultLandingInfo.record" [data]=resultLandingInfo.record
|
||||
[URL]="canonicalUrl"></schema2jsonld>
|
||||
[URL]="canonicalUrl"></schema2jsonld>
|
||||
<!-- Actions for mobile viewport -->
|
||||
<div class="uk-flex uk-flex-right uk-margin-medium-bottom uk-hidden@s">
|
||||
<!-- Share -->
|
||||
<div class="uk-margin-small-right">
|
||||
<a (click)="openAddThisModal()"
|
||||
[title]="'Share this '+getTypeName() + ' in your social networks'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="share" visuallyHidden="share"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- Link to -->
|
||||
<div *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-margin-small-right"
|
||||
[title]="'<span class=\'uk-flex uk-flex-middle\'>Link this '+getTypeName()+' to ...<span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])"
|
||||
routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="link" visuallyHidden="link"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- Cite this -->
|
||||
<div class="uk-margin-small-right">
|
||||
<a (click)="openCiteModal()"
|
||||
[title]="'Cite this '+getTypeName()"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="quotes" visuallyHidden="cite"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- ORCID -->
|
||||
<div *ngIf="properties.adminToolsPortalType == 'explore' || properties.adminToolsPortalType == 'community'"
|
||||
class="uk-margin-small-right">
|
||||
<orcid-work [resultId]="id" [resultTitle]="resultLandingInfo.title" [resultLandingInfo]="resultLandingInfo"
|
||||
[pids]="pidsArrayString" [pageType]="'landing'">
|
||||
</orcid-work>
|
||||
</div>
|
||||
<div *ngIf=" properties.enableEoscDataTransfer && resultLandingInfo.resultType == 'dataset' &&
|
||||
resultLandingInfo.identifiers && resultLandingInfo.identifiers.get('doi') &&
|
||||
resultLandingInfo.identifiers.get('doi').join('').indexOf('zenodo.')!=-1"
|
||||
class="">
|
||||
<egi-transfer-data [dois]="resultLandingInfo.identifiers.get('doi')" [isOpen]="egiTransferModalOpen"></egi-transfer-data>
|
||||
</div>
|
||||
</div>
|
||||
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
|
||||
[texts]="pageContents['top']"></helper>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue