finish explore homepage - need to check some things with aristotelis and remove old code frm comments
This commit is contained in:
parent
104256eefb
commit
ddb189303b
|
|
@ -5,6 +5,37 @@
|
|||
background-image: url('~src/assets/explore-assets/home/graph.svg');
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.link-actions img {
|
||||
width: 17px;
|
||||
}
|
||||
.trello-button-blue {
|
||||
background-color: #0076BA;
|
||||
color: white;
|
||||
}
|
||||
.trello-button-blue:hover {
|
||||
background-color: var(--secondary-color);
|
||||
}
|
||||
.home-logo img {
|
||||
-webkit-filter: grayscale(1);
|
||||
filter: grayscale(1);
|
||||
transition-duration: 0.3s;
|
||||
}
|
||||
.home-logo:hover img {
|
||||
-webkit-filter: grayscale(0);
|
||||
filter: grayscale(0);
|
||||
transition-duration: 0.3s;
|
||||
}
|
||||
#custom-links icon {
|
||||
color: var(--primary-color);
|
||||
/* transition: all 0.3s ease; */
|
||||
}
|
||||
#custom-links a:hover .link-title {
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
/* #custom-links a:hover icon {
|
||||
transform: translateX(7px);
|
||||
transition: all 0.3s ease;
|
||||
} */
|
||||
@media only screen and (min-width: 960px){
|
||||
.explore-dark-logo-background {
|
||||
background-image: url("~src/assets/explore-assets/home/explore-dark-logo.svg");
|
||||
|
|
|
|||
|
|
@ -10,7 +10,6 @@
|
|||
<div>
|
||||
<div class="uk-section uk-padding-remove-bottom uk-overflow-hidden home-background">
|
||||
<div class="uk-container uk-container-large" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200">
|
||||
<!-- first grid with search and mask -->
|
||||
<div class="uk-grid uk-flex-middle" uk-grid>
|
||||
<div class="uk-width-3-5 uk-margin-large-bottom">
|
||||
<h1 class="uk-h2" uk-scrollspy-class>
|
||||
|
|
@ -28,6 +27,27 @@
|
|||
[onChangeNavigate]="false"></entities-selection>
|
||||
<div input placeholder="Scholary works" [hint]="'Search in OpenAIRE'" [(value)]="keyword"></div>
|
||||
</advanced-search-input>
|
||||
<div class="uk-padding-small uk-flex uk-flex-middle">
|
||||
<div class="uk-text-bold uk-margin-right">
|
||||
Try:
|
||||
</div>
|
||||
<div class="link-actions uk-flex uk-flex-middle">
|
||||
<a class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text uk-margin-right"
|
||||
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">Browse by 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-hero-img.svg" alt="FOS logo" loading="lazy">
|
||||
<span class="uk-margin-small-left">Browse by FOS</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="selectedEntity === 'result' && !entities.input.focused" class="uk-dropdown uk-display-block uk-margin-top uk-width-auto">
|
||||
<div class="uk-padding-small">
|
||||
<quick-selections [resultTypes]="resultTypes" [quickFilter]="resultsQuickFilter"></quick-selections>
|
||||
|
|
@ -37,21 +57,23 @@
|
|||
</div>
|
||||
<div class="uk-visible@m uk-width-expand" uk-scrollspy-class>
|
||||
<div class="uk-position-relative">
|
||||
<img style="padding: 1px" src="assets/explore-assets/home/explore.jpg" uk-parallax="y: 300">
|
||||
<img class="uk-position-top-left" src="assets/explore-assets/home/mask.svg">
|
||||
<img src="assets/explore-assets/home/explore.jpg" uk-parallax="y: 300">
|
||||
<img class="uk-position-bottom-left" src="assets/explore-assets/home/mask.svg">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- logos carousel -->
|
||||
<div class="uk-padding-large uk-padding-remove-horizontal uk-margin-large-top uk-margin-large-bottom">
|
||||
<div uk-slider="autoplay: false; autoplay-interval: 2500" class="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-section uk-section-large uk-padding-remove-top home-background">
|
||||
<div class="uk-container uk-container-large uk-width-1-2">
|
||||
<div uk-slider="autoplay: true; autoplay-interval: 2500" class="">
|
||||
<div class="uk-position-relative">
|
||||
<div class="uk-slider-container">
|
||||
<ul class="uk-slider-items" uk-height-match="target: > li > div > div > .logo1; row: false;">
|
||||
<ng-container *ngFor="let type of getKeys(logos)">
|
||||
<li *ngFor="let range of createRange(logos[type].length) let j=index"
|
||||
class="uk-width-1-1 home-logo">
|
||||
<h1 class="uk-text-center uk-margin-bottom portal-color uk-h3">
|
||||
<h1 class="uk-text-center uk-margin-large-bottom uk-text-primary uk-h4">
|
||||
<span *ngIf="type=='publication' && showPublications && numbers?.publicationsSize">
|
||||
<span
|
||||
class="uk-text-bold">{{numbers.publicationsSize.number|number}}{{numbers.publicationsSize.size}}
|
||||
|
|
@ -109,23 +131,28 @@
|
|||
|
||||
<div class="uk-hidden@s">
|
||||
<a class="uk-position-center-left uk-position-small" href="#" uk-slidenav-previous
|
||||
uk-slider-item="previous"><span class="visually-hidden">prev</span></a>
|
||||
uk-slider-item="previous">
|
||||
<span class="visually-hidden">prev</span>
|
||||
</a>
|
||||
<a class="uk-position-center-right uk-position-small" href="#" uk-slidenav-next
|
||||
uk-slider-item="next"><span class="visually-hidden">next</span></a>
|
||||
uk-slider-item="next">
|
||||
<span class="visually-hidden">next</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="uk-visible@s">
|
||||
<a class="uk-position-center-left-out uk-position-small" href="#" uk-slidenav-previous
|
||||
uk-slider-item="previous"><span class="visually-hidden">prev</span></a>
|
||||
uk-slider-item="previous">
|
||||
<span class="visually-hidden">prev</span>
|
||||
</a>
|
||||
<a class="uk-position-center-right-out uk-position-small" href="#" uk-slidenav-next
|
||||
uk-slider-item="next"><span class="visually-hidden">next</span></a>
|
||||
uk-slider-item="next">
|
||||
<span class="visually-hidden">next</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
|
||||
[texts]="pageContents['top']"></helper>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ng-template #scrolling_text let-position_class="position_class">
|
||||
|
|
@ -158,7 +185,7 @@
|
|||
<div class="uk-width-1-1">
|
||||
<h2 class="uk-h1 uk-margin-remove-top">Lorem ipsum lorem<span class="uk-text-primary">.</span></h2>
|
||||
</div>
|
||||
<div id="js-sticky-parallax-images-all" style="min-height: 300vh">
|
||||
<div id="js-sticky-parallax-images-all" style="min-height: 200vh">
|
||||
<div class="uk-visible@m uk-height-viewport explore-dark-logo-background uk-sticky" uk-sticky="bottom: #js-sticky-parallax-images-all; target-offset: true">
|
||||
<div class="uk-grid" uk-grid>
|
||||
<div class="uk-width-expand uk-first-column">
|
||||
|
|
@ -197,16 +224,17 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="uk-section">
|
||||
<!-- Not yet! -->
|
||||
<!-- <div class="uk-section">
|
||||
<div class="uk-container uk-container-large">
|
||||
<h2 class="uk-h1 uk-text-center">
|
||||
New sources in <br> OpenAIRE<span class="uk-text-primary">.</span>
|
||||
</h2>
|
||||
<div class="cards-on-slider">
|
||||
TODO: content?
|
||||
</div>
|
||||
TODO: Repositories content
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="uk-background-muted">
|
||||
<div class="graph-background uk-background-top-right">
|
||||
|
|
@ -226,46 +254,69 @@
|
|||
</div>
|
||||
<div class="uk-section uk-padding-remove-top">
|
||||
<div class="uk-container uk-container-large">
|
||||
<!-- TODO: add href links -->
|
||||
<div class="uk-width-1-2@m uk-margin-auto uk-margin-medium-top">
|
||||
<div class="uk-width-1-2@m uk-margin-auto uk-margin-medium-top uk-text-small">
|
||||
<div>
|
||||
You can provide feedback via Trello or via opening a ticket in the OpenAIRE Helpdesk under the category OpenAIRE Services with the subject “OpenAIRE Research Graph: ”. The graph can be explored and tested via this portal or via data dumps made available in Zenodo.org.
|
||||
You can provide feedback via <a href="https://trello.com/b/o1tEJ3rN/openaire-research-graph" target="_blank">Trello</a> or via opening a ticket in the <a href="https://www.openaire.eu/support/helpdesk" target="_blank">OpenAIRE Helpdesk</a> under the category OpenAIRE Services with the subject “OpenAIRE Research Graph: ”. The graph can be explored and tested via this portal or via data dumps made available in <a href="https://zenodo.org/communities/openaire-research-graph?page=1&size=20" target="_blank">Zenodo.org</a>.
|
||||
</div>
|
||||
<div>
|
||||
Find information about the OpenAIRE Research Graph, how to test it and contribute to improving it on our blog. You can also write to Paolo Manghi, the OpenAIRE Technical Director, for additional details.
|
||||
<div class="uk-margin-top">
|
||||
Find information about the OpenAIRE Research Graph, how to test it and contribute to improving it on our <a href="https://www.openaire.eu/blogs/the-openaire-research-graph" target="_blank">blog</a>. You can also write to <a href="mailto:paolo.manghi@isti.cnr.it">Paolo Manghi</a>, the OpenAIRE Technical Director, for additional details.
|
||||
</div>
|
||||
<div class="uk-margin-medium-top uk-flex uk-flex-middle uk-flex-between uk-text-uppercase">
|
||||
<a href="" class="">Instructions on providing feedback</a>
|
||||
<a href="">Go to Trello</a>
|
||||
<a href="https://www.openaire.eu/blogs/the-openaire-research-graph" target="_blank" class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text">
|
||||
Instructions on providing feedback
|
||||
</a>
|
||||
<a href="https://trello.com/b/o1tEJ3rN/openaire-research-graph" target="_blank"
|
||||
class="uk-button trello-button-blue uk-text-uppercase">
|
||||
<img src="../../assets/explore-assets/trello.svg" alt="Trello logo" loading="lazy" class="uk-margin-small-top uk-margin-small-bottom">
|
||||
<span class="uk-margin-small-left">Go to Trello</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="uk-section">
|
||||
<div class="uk-section uk-section-large">
|
||||
<div class="uk-container uk-container-large">
|
||||
<h2 class="uk-h1">
|
||||
<h2 class="uk-h1 uk-margin-medium-bottom">
|
||||
Have more questions<span class="uk-text-primary">?</span>
|
||||
</h2>
|
||||
<div class="uk-grid uk-child-width-1-2@m" uk-grid>
|
||||
<div id="custom-links" class="uk-padding uk-grid uk-child-width-1-2@m uk-text-bold" uk-grid uk-height-match="target: .link-title;">
|
||||
<div>
|
||||
<a href="https://www.openaire.eu/os-primers" target="_blank">Open science policies and how to align</a>
|
||||
<div class="uk-width-3-4 uk-margin-auto uk-padding uk-padding-remove-horizontal" style="border-bottom: 1px solid rgba(0,0,0,0.1)">
|
||||
<a href="https://www.openaire.eu/os-primers" target="_blank" class="uk-link-reset uk-text-large uk-flex uk-flex-middle uk-flex-between">
|
||||
<span class="link-title">Open science policies and how to align</span>
|
||||
<icon name="east" ratio="1.5"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://www.openaire.eu/rdm-handbook" target="_blank">How to manage your data in the open science era</a>
|
||||
<div class="uk-width-3-4 uk-margin-auto uk-padding uk-padding-remove-horizontal" style="border-bottom: 1px solid rgba(0,0,0,0.1)">
|
||||
<a href="https://www.openaire.eu/rdm-handbook" target="_blank" class="uk-link-reset uk-text-large uk-flex uk-flex-middle uk-flex-between">
|
||||
<span class="link-title">How to manage your data in the open <br> science era</span>
|
||||
<icon name="east" ratio="1.5"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://www.openaire.eu/guides" target="_blank">how to use OpenAIRE to best serve your needs</a>
|
||||
<div class="uk-width-3-4 uk-margin-auto uk-padding uk-padding-remove-horizontal" style="border-bottom: 1px solid rgba(0,0,0,0.1)">
|
||||
<a href="https://www.openaire.eu/guides" target="_blank" class="uk-link-reset uk-text-large uk-flex uk-flex-middle uk-flex-between">
|
||||
<span class="link-title">How to use OpenAIRE to best serve <br> your needs</span>
|
||||
<icon name="east" ratio="1.5"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://www.openaire.eu/frontpage/webinars" target="_blank">Training material on a variety of related topics</a>
|
||||
<div class="uk-width-3-4 uk-margin-auto uk-padding uk-padding-remove-horizontal" style="border-bottom: 1px solid rgba(0,0,0,0.1)">
|
||||
<a href="https://www.openaire.eu/frontpage/webinars" target="_blank" class="uk-link-reset uk-text-large uk-flex-middle uk-flex uk-flex-between">
|
||||
<span class="link-title">Training material on a variety of <br> related topics</span>
|
||||
<icon name="east" ratio="1.5"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <helper *ngIf="pageContents && pageContents['left'] && pageContents['left'].length > 0"
|
||||
[texts]="pageContents['left']"></helper> -->
|
||||
|
||||
<div class="uk-section">
|
||||
<div class="uk-container uk-container-large uk-margin-large-bottom uk-text-center">
|
||||
|
|
@ -273,7 +324,7 @@
|
|||
Need more information? <br> Get in touch and let us help you<span class="uk-text-primary">.</span>
|
||||
</h3>
|
||||
<a class="uk-button uk-button-primary uk-text-uppercase uk-margin-medium-top uk-margin-medium-bottom"
|
||||
routerLink="/contact-us">Contact us</a>
|
||||
href="https://www.openaire.eu/contact-us" target="_blank">Contact us</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -282,7 +333,7 @@
|
|||
|
||||
|
||||
|
||||
<ng-template #_logos let-logo="logo" let-class="class">
|
||||
<!-- <ng-template #_logos let-logo="logo" let-class="class">
|
||||
<div *ngIf="logo" [class]="'uk-flex uk-flex-middle uk-flex-center uk-padding-remove-horizontal '+class">
|
||||
<div class="">
|
||||
<img src="assets/ExploreLogos/{{logo}}" alt="{{logo}} logo" loading="lazy" width="112px" height="44px">
|
||||
|
|
@ -453,4 +504,4 @@
|
|||
<div class="uk-container uk-container-large">
|
||||
<other-portals portal="explore" [properties]="properties"></other-portals>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
|
|
|||
|
|
@ -189,7 +189,6 @@ export class HomeComponent {
|
|||
|
||||
private getPageContents() {
|
||||
this.subs.push(this.helper.getPageHelpContents(this.properties, 'openaire', this._router.url).subscribe(contents => {
|
||||
console.log(contents);
|
||||
this.pageContents = contents;
|
||||
}));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
Subproject commit 8b7143c8cb05552d097211ab0dddb9bdbd4ce384
|
||||
Subproject commit fc2fbb5ba008712b856a60d28e341dc1475fab80
|
||||
Loading…
Reference in New Issue