Change scroll section with slider in home page of connect.
This commit is contained in:
parent
0de04c4017
commit
48f04f313d
|
@ -1,302 +1,287 @@
|
|||
<div>
|
||||
<div class="uk-overflow-hidden uk-tile-default">
|
||||
<div class="uk-section uk-padding-remove-bottom uk-background-norepeat hero-background">
|
||||
<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">
|
||||
<h1 class="uk-heading-large" uk-scrollspy-class>
|
||||
Build a <span class="uk-text-primary">Gateway</span>
|
||||
for your Community<span class="uk-text-primary">.</span>
|
||||
</h1>
|
||||
<div class="uk-text-large uk-margin-medium-top" uk-scrollspy-class>
|
||||
<div>Turn Open Science into Practice.</div>
|
||||
<div>It takes your open and linked {{entities.RESULTS | lowercase}}.</div>
|
||||
<div>A service customized to your needs.</div>
|
||||
</div>
|
||||
<div class="uk-margin-medium-top" uk-scrollspy-class>
|
||||
<a class="uk-button uk-button-primary uk-text-uppercase" routerLink="/about/learn-how">Learn More</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-expand uk-visible@m" uk-scrollspy-class>
|
||||
<div class="uk-position-relative">
|
||||
<img style="padding: 1px" src="assets/connect-assets/home/connect-hero.jpg" uk-parallax="y: 300">
|
||||
<img class="uk-position-top-left" src="assets/connect-assets/home/connect-hero-mask.svg">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ng-template #scrolling_text let-position_class="position_class">
|
||||
<div #scrolling_element [class]="position_class" uk-parallax="target: #js-sticky-parallax-images-all; start: 15%; end: 100% + 100vh - 150vh; opacity: 0,1 20%,1 99%,0">
|
||||
<h3 class="uk-h2">
|
||||
<span class="uk-text-primary">Find a repository to deposit </span>
|
||||
<span>your {{entities.RESULT | lowercase}}</span>
|
||||
<span class="uk-text-primary">.</span>
|
||||
</h3>
|
||||
</div>
|
||||
<div #scrolling_element [class]="position_class" uk-parallax="target: #js-sticky-parallax-images-all; start: 150vh; end: 100% + 100vh - 200vh; opacity: 0,1 20%,1 99%,0">
|
||||
<h3 class="uk-h2">
|
||||
<span class="uk-text-primary">Link your {{entities.RESULT | lowercase}} </span>
|
||||
<span>with your community, funding, and other {{entities.RESULTS | lowercase}}</span>
|
||||
<span class="uk-text-primary">.</span>
|
||||
</h3>
|
||||
</div>
|
||||
<div #scrolling_element [class]="position_class" uk-parallax="target: #js-sticky-parallax-images-all; start: 200vh; end: 100% + 100vh - 250vh; opacity: 0,1 20%,1 99%,0">
|
||||
<h3 class="uk-h2">
|
||||
<span>View community's </span>
|
||||
<span class="uk-text-primary">overview at a glance.</span>
|
||||
</h3>
|
||||
</div>
|
||||
<div #scrolling_element [class]="position_class" uk-parallax="target: #js-sticky-parallax-images-all; start: 250vh; end: 100% + 100vh - 300vh; opacity: 0,1 20%,1">
|
||||
<h3 class="uk-h2">
|
||||
<span class="uk-text-primary">Search & browse </span>
|
||||
<span>your community's {{entities.RESULTS | lowercase}}</span>
|
||||
<span class="uk-text-primary">.</span>
|
||||
</h3>
|
||||
</div>
|
||||
<!-- <div #scrolling_element [class]="position_class" uk-parallax="target: #js-sticky-parallax-images-all; start: 300vh; end: 100% + 100vh - 350vh; opacity: 0,1 20%,1">
|
||||
<h3 class="uk-h2">
|
||||
<span class="uk-text-primary">View statistics </span>
|
||||
<span>for your community's {{entities.RESULTS | lowercase}}</span>
|
||||
<span class="uk-text-primary">.</span>
|
||||
</h3>
|
||||
</div> -->
|
||||
</ng-template>
|
||||
<div class="uk-section uk-section-secondary">
|
||||
<div class="uk-container uk-container-large">
|
||||
<div class="uk-width-1-1">
|
||||
<span class="uk-h6 uk-text-primary">Benefits.</span>
|
||||
<h2 class="uk-h1 uk-margin-remove-top uk-width-1-2@m">
|
||||
Find the best for your community<span class="uk-text-primary">.</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div id="js-sticky-parallax-images-all" style="min-height: 400vh">
|
||||
<div class="uk-visible@m uk-height-viewport connect-dark-logo-background uk-sticky" uk-sticky="end: #js-sticky-parallax-images-all; target-offset: true">
|
||||
<div class="uk-grid" uk-grid style="height: 100vh;">
|
||||
<div class="uk-width-expand uk-first-column uk-position-relative uk-height-1-1">
|
||||
<div class="connect-dark-logo-background">
|
||||
<div uk-parallax="target: #js-sticky-parallax-images-all;">
|
||||
<img class="uk-position-center uk-position-z-index" src="assets/connect-assets/home/tablet.png" alt="ipad" loading="lazy"
|
||||
style="width: 100%;">
|
||||
<img class="uk-position-center" src="assets/connect-assets/home/1.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all; start: 100vh; end: 100% + 100vh - 160vh; opacity: 1,1 99%,0; easing:0"
|
||||
style="width: 100%;">
|
||||
<img class="uk-position-center" src="assets/connect-assets/home/2.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all; start: 150vh; end: 100% + 100vh - 210vh; opacity: 0,1 20%,1 99%,0; easing:0"
|
||||
style="width: 100%;">
|
||||
<img class="uk-position-center" src="assets/connect-assets/home/3.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all; start: 200vh; end: 100% + 100vh - 260vh; opacity: 0,1 20%,1 99%,0; easing:0"
|
||||
style="width: 100%;">
|
||||
<img class="uk-position-center" src="assets/connect-assets/home/4.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all; start: 250vh; end: 100% + 100vh - 310vh; opacity: 0,1 20%,1; easing:0"
|
||||
style="width: 100%;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-inline uk-width-expand uk-height-1-1 uk-margin-large-left">
|
||||
<div class="uk-width-3-4@l">
|
||||
<div uk-parallax="target: #js-sticky-parallax-images-all; y: 55vh, 40vh;">
|
||||
<ng-container *ngTemplateOutlet="scrolling_text; context: {position_class: 'uk-position-center-left'}"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-hidden@m uk-height-viewport connect-dark-logo-background" uk-sticky="end: #js-sticky-parallax-images-all">
|
||||
<div class="uk-flex uk-flex-column uk-flex-middle">
|
||||
<div class="connect-dark-logo-background uk-inline uk-width-1-1" style="height: 40vh;">
|
||||
<img class="uk-position-center uk-position-z-index" src="assets/connect-assets/home/tablet.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all;" style="width: 70%;">
|
||||
<img class="uk-position-center" src="assets/connect-assets/home/1.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all; start: 100vh; end: 100% + 100vh - 160vh; opacity: 1,1 99%,0; easing:0" style="width: 70%;">
|
||||
<img class="uk-position-center" src="assets/connect-assets/home/2.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all; start: 150vh; end: 100% + 100vh - 210vh; opacity: 0,1 20%,1 99%,0; easing:0" style="width: 70%;">
|
||||
<img class="uk-position-center" src="assets/connect-assets/home/3.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all; start: 200vh; end: 100% + 100vh - 260vh; opacity: 0,1 20%,1 99%,0; easing:0" style="width: 70%;">
|
||||
<img class="uk-position-center" src="assets/connect-assets/home/4.png" alt="ipad" loading="lazy"
|
||||
uk-parallax="target: #js-sticky-parallax-images-all; start: 250vh; end: 100% + 100vh - 310vh; opacity: 0,1 20%,1; easing:0" style="width: 70%;">
|
||||
<div class="uk-overflow-hidden uk-tile-default">
|
||||
<div class="uk-section uk-padding-remove-bottom uk-background-norepeat hero-background">
|
||||
<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">
|
||||
<h1 class="uk-heading-large" uk-scrollspy-class>
|
||||
Build a <span class="uk-text-primary">Gateway</span>
|
||||
for your Community<span class="uk-text-primary">.</span>
|
||||
</h1>
|
||||
<div class="uk-text-large uk-margin-medium-top" uk-scrollspy-class>
|
||||
<div>Turn Open Science into Practice.</div>
|
||||
<div>It takes your open and linked {{entities.RESULTS | lowercase}}.</div>
|
||||
<div>A service customized to your needs.</div>
|
||||
</div>
|
||||
<div class="uk-margin-medium-top" uk-scrollspy-class>
|
||||
<a class="uk-button uk-button-primary uk-text-uppercase" routerLink="/about/learn-how">Learn
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-expand uk-visible@m" uk-scrollspy-class>
|
||||
<div class="uk-position-relative">
|
||||
<img style="padding: 1px" src="assets/connect-assets/home/connect-hero.jpg"
|
||||
uk-parallax="y: 300">
|
||||
<img class="uk-position-top-left" src="assets/connect-assets/home/connect-hero-mask.svg">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-inline uk-width-2-3">
|
||||
<ng-container *ngTemplateOutlet="scrolling_text; context: {position_class: 'uk-position-top-center'}"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div #parent class="uk-section uk-section-secondary">
|
||||
<div class="uk-container uk-container-large">
|
||||
<div class="uk-width-1-1 uk-margin-medium-bottom">
|
||||
<span class="uk-h6 uk-text-primary">Benefits.</span>
|
||||
<h2 class="uk-margin-remove-top uk-width-1-2@m">
|
||||
Find the best for your community<span class="uk-text-primary">.</span>
|
||||
</h2>
|
||||
</div>
|
||||
<slider-container [total]="4" [navigation]="'progress'" [parent]="parent">
|
||||
<slider-column type="slider">
|
||||
<slider-item type="static">
|
||||
<img class="uk-position-center uk-position-z-index" src="assets/connect-assets/home/tablet.png"
|
||||
alt="ipad" loading="lazy">
|
||||
</slider-item>
|
||||
<slider-item type="slide" [start]="0">
|
||||
<img src="assets/connect-assets/home/1.png" alt="ipad" loading="lazy">
|
||||
</slider-item>
|
||||
<slider-item type="slide" [start]="1">
|
||||
<img src="assets/connect-assets/home/2.png" alt="ipad" loading="lazy">
|
||||
</slider-item>
|
||||
<slider-item type="slide" [start]="2">
|
||||
<img src="assets/connect-assets/home/3.png" alt="ipad" loading="lazy">
|
||||
</slider-item>
|
||||
<slider-item type="slide" [start]="3">
|
||||
<img src="assets/connect-assets/home/4.png" alt="ipad" loading="lazy">
|
||||
</slider-item>
|
||||
</slider-column>
|
||||
<slider-column type="nav">
|
||||
<slider-nav-item [start]="0">
|
||||
<h6 class="uk-margin-remove">
|
||||
<i class="uk-text-primary">Find a repository </i>
|
||||
<span>to deposit your {{entities.RESULT | lowercase}}</span>
|
||||
<span class="uk-text-primary">.</span>
|
||||
</h6>
|
||||
</slider-nav-item>
|
||||
<slider-nav-item [start]="1">
|
||||
<h6 class="uk-margin-remove">
|
||||
<i class="uk-text-primary">Link your {{entities.RESULT | lowercase}} </i>
|
||||
<span>with your community, funding, and other {{entities.RESULTS | lowercase}}</span>
|
||||
<span class="uk-text-primary">.</span>
|
||||
</h6>
|
||||
</slider-nav-item>
|
||||
<slider-nav-item [start]="2">
|
||||
<h6 class="uk-margin-remove">
|
||||
<span>View community's </span>
|
||||
<i class="uk-text-primary">overview at a glance.</i>
|
||||
</h6>
|
||||
</slider-nav-item>
|
||||
<slider-nav-item [start]="3">
|
||||
<h6 class="uk-margin-remove">
|
||||
<i class="uk-text-primary">Search & browse </i>
|
||||
<span>your community's {{entities.RESULTS | lowercase}}</span>
|
||||
<span class="uk-text-primary">.</span>
|
||||
</h6>
|
||||
</slider-nav-item>
|
||||
</slider-column>
|
||||
</slider-container>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="uk-section uk-section-large uk-container uk-container-large">
|
||||
<div class="uk-margin-medium-top">
|
||||
<h2 class="uk-h1">
|
||||
Our mission for an Open and FAIR science<span class="uk-text-primary">.</span>
|
||||
</h2>
|
||||
<div class="uk-margin-large-top">
|
||||
<div class="uk-child-width-1-3@m uk-child-width-1-1@s uk-grid-large uk-grid-match uk-grid" uk-grid=""
|
||||
uk-height-match=".target">
|
||||
<div class="uk-first-column">
|
||||
<div class="uk-card uk-card-default uk-padding">
|
||||
<div class="uk-card-media-top uk-flex uk-flex-middle uk-flex-center
|
||||
<div class="uk-section uk-section-large uk-container uk-container-large">
|
||||
<div class="uk-margin-medium-top">
|
||||
<h2 class="uk-h1">
|
||||
Our mission for an Open and FAIR science<span class="uk-text-primary">.</span>
|
||||
</h2>
|
||||
<div class="uk-margin-large-top">
|
||||
<div class="uk-child-width-1-3@m uk-child-width-1-1@s uk-grid-large uk-grid-match uk-grid" uk-grid=""
|
||||
uk-height-match=".target">
|
||||
<div class="uk-first-column">
|
||||
<div class="uk-card uk-card-default uk-padding">
|
||||
<div class="uk-card-media-top uk-flex uk-flex-middle uk-flex-center
|
||||
uk-padding-small uk-padding-remove-vertical uk-margin-top uk-margin-bottom">
|
||||
<div>
|
||||
<img src="assets/connect-assets/home/virtual.svg" alt="A Virtual Research Environment" style="height:60px; width:67px"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-card-body uk-padding-remove uk-margin-small-bottom">
|
||||
<div class="target uk-text-center">
|
||||
<h3 class="uk-6 uk-card-title uk-margin-small-bottom">A Virtual Research Environment</h3>
|
||||
<div>An overlay platform making it easy to share, link, disseminate and monitor all your {{entities.PUBLICATIONS | lowercase}},
|
||||
{{entities.DATASETS | lowercase}}, {{entities.SOFTWARE | lowercase}}, methods. In one place.
|
||||
</div>
|
||||
</div>
|
||||
<hr/>
|
||||
<div>
|
||||
<ul class="uk-list uk-text-small">
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Access to OpenAIRE research graph
|
||||
</li>
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Moderated, front-end linking
|
||||
</li>
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Cross-platform search
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="uk-card uk-card-default uk-padding">
|
||||
<div class="uk-card-media-top uk-flex uk-flex-middle uk-flex-center
|
||||
<div>
|
||||
<img src="assets/connect-assets/home/virtual.svg"
|
||||
alt="A Virtual Research Environment" style="height:60px; width:67px"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-card-body uk-padding-remove uk-margin-small-bottom">
|
||||
<div class="target uk-text-center">
|
||||
<h3 class="uk-6 uk-card-title uk-margin-small-bottom">A Virtual Research
|
||||
Environment</h3>
|
||||
<div>An overlay platform making it easy to share, link, disseminate and monitor all
|
||||
your {{entities.PUBLICATIONS | lowercase}},
|
||||
{{entities.DATASETS | lowercase}}, {{entities.SOFTWARE | lowercase}}, methods.
|
||||
In one place.
|
||||
</div>
|
||||
</div>
|
||||
<hr/>
|
||||
<div>
|
||||
<ul class="uk-list uk-text-small">
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85"
|
||||
flex="true"></icon>
|
||||
Access to OpenAIRE research graph
|
||||
</li>
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85"
|
||||
flex="true"></icon>
|
||||
Moderated, front-end linking
|
||||
</li>
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85"
|
||||
flex="true"></icon>
|
||||
Cross-platform search
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="uk-card uk-card-default uk-padding">
|
||||
<div class="uk-card-media-top uk-flex uk-flex-middle uk-flex-center
|
||||
uk-padding-small uk-padding-remove-vertical uk-margin-top uk-margin-bottom">
|
||||
<div>
|
||||
<img src="assets/connect-assets/home/open_science.svg" alt="Open science in action" style="height:60px; width:67px"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-card-body uk-padding-remove uk-margin-small-bottom">
|
||||
<div class="target uk-text-center" style="">
|
||||
<h3 class="uk-h6 uk-card-title uk-margin-small-bottom">Open Science in action</h3>
|
||||
<div>A time-saving bundle of services for researchers to effortlessly practice open science. An integral
|
||||
part of the European Open Science Cloud.
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div>
|
||||
<ul class="uk-list uk-text-small">
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Use of OpenAIRE Guidelines
|
||||
</li>
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Publish and get DOIs with Zenodo
|
||||
</li>
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
EOSC Single Sign-On
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="uk-card uk-card-default uk-padding">
|
||||
<div class="uk-card-media-top uk-flex uk-flex-middle uk-flex-center
|
||||
<div>
|
||||
<img src="assets/connect-assets/home/open_science.svg" alt="Open science in action"
|
||||
style="height:60px; width:67px"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-card-body uk-padding-remove uk-margin-small-bottom">
|
||||
<div class="target uk-text-center" style="">
|
||||
<h3 class="uk-h6 uk-card-title uk-margin-small-bottom">Open Science in action</h3>
|
||||
<div>A time-saving bundle of services for researchers to effortlessly practice open
|
||||
science. An integral
|
||||
part of the European Open Science Cloud.
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div>
|
||||
<ul class="uk-list uk-text-small">
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85"
|
||||
flex="true"></icon>
|
||||
Use of OpenAIRE Guidelines
|
||||
</li>
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85"
|
||||
flex="true"></icon>
|
||||
Publish and get DOIs with Zenodo
|
||||
</li>
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85"
|
||||
flex="true"></icon>
|
||||
EOSC Single Sign-On
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="uk-card uk-card-default uk-padding">
|
||||
<div class="uk-card-media-top uk-flex uk-flex-middle uk-flex-center
|
||||
uk-padding-small uk-padding-remove-vertical uk-margin-top uk-margin-bottom">
|
||||
<div>
|
||||
<img src="assets/connect-assets/home/customize.svg" alt="Customized to your needs" style="height:60px; width:67px"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-card-body uk-padding-remove uk-margin-small-bottom">
|
||||
<div class="target uk-text-center" style="">
|
||||
<h3 class="uk-h6 uk-card-title uk-margin-small-bottom">Customized to your needs</h3>
|
||||
<div>A Gateway with your own brand, rules for aggregation, text & data mining, and presentation. Run
|
||||
by you via a simple, yet powerful backend administration tool.
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div>
|
||||
<ul class="uk-list uk-text-small">
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Access control
|
||||
</li>
|
||||
<!--<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Analytics: rich set of indicators
|
||||
</li>-->
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Look & feel to match your brand
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src="assets/connect-assets/home/customize.svg" alt="Customized to your needs"
|
||||
style="height:60px; width:67px"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-card-body uk-padding-remove uk-margin-small-bottom">
|
||||
<div class="target uk-text-center" style="">
|
||||
<h3 class="uk-h6 uk-card-title uk-margin-small-bottom">Customized to your needs</h3>
|
||||
<div>A Gateway with your own brand, rules for aggregation, text & data mining,
|
||||
and presentation. Run
|
||||
by you via a simple, yet powerful backend administration tool.
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div>
|
||||
<ul class="uk-list uk-text-small">
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85"
|
||||
flex="true"></icon>
|
||||
Access control
|
||||
</li>
|
||||
<!--<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85" flex="true"></icon>
|
||||
Analytics: rich set of indicators
|
||||
</li>-->
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<icon class="uk-margin-small-right uk-text-primary" name="done" ratio="0.85"
|
||||
flex="true"></icon>
|
||||
Look & feel to match your brand
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="researchCommunities.length === 0" class="uk-container uk-container-large uk-margin-large-bottom">
|
||||
<errorMessages [status]="[status]" [type]="'communities'"></errorMessages>
|
||||
</div>
|
||||
<div *ngIf="!loading && researchCommunities.length > 0" class="uk-section uk-container uk-container-large">
|
||||
<h2 class="uk-h1">Community Gateways already in action<span class="uk-text-primary">.</span></h2>
|
||||
<div class="uk-margin-large-top uk-margin-large-bottom">
|
||||
<div class="uk-visible@xl">
|
||||
<div class="uk-grid-match uk-grid-medium uk-child-width-1-4 uk-flex-center uk-text-center" uk-grid>
|
||||
<div *ngFor="let community of researchCommunities.slice(0, 4); let i = index">
|
||||
<div class="uk-card uk-card-default uk-card-hover" [class.uk-disabled]="!hasPermission(community)">
|
||||
<browse-community [community]=community></browse-community>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-medium-top">
|
||||
<a *ngIf="researchCommunities.length > 4"
|
||||
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
|
||||
routerLinkActive="router-link-active" routerLink="/search/find/communities">
|
||||
<div *ngIf="researchCommunities.length === 0" class="uk-container uk-container-large uk-margin-large-bottom">
|
||||
<errorMessages [status]="[status]" [type]="'communities'"></errorMessages>
|
||||
</div>
|
||||
<div *ngIf="!loading && researchCommunities.length > 0" class="uk-section uk-container uk-container-large">
|
||||
<h2 class="uk-h1">Community Gateways already in action<span class="uk-text-primary">.</span></h2>
|
||||
<div class="uk-margin-large-top uk-margin-large-bottom">
|
||||
<div class="uk-visible@xl">
|
||||
<div class="uk-grid-match uk-grid-medium uk-child-width-1-4 uk-flex-center uk-text-center" uk-grid>
|
||||
<div *ngFor="let community of researchCommunities.slice(0, 4); let i = index">
|
||||
<div class="uk-card uk-card-default uk-card-hover"
|
||||
[class.uk-disabled]="!hasPermission(community)">
|
||||
<browse-community [community]=community></browse-community>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-medium-top">
|
||||
<a *ngIf="researchCommunities.length > 4"
|
||||
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
|
||||
routerLinkActive="router-link-active" routerLink="/search/find/communities">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
<span>View All</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="uk-hidden@xl">
|
||||
<div class="uk-grid-match uk-grid-medium uk-child-width-1-3@m uk-child-width-1-1 uk-flex-center uk-text-center" uk-grid>
|
||||
<div *ngFor="let community of researchCommunities.slice(0, 3); let i = index">
|
||||
<div class="uk-card uk-card-default uk-card-hover">
|
||||
<browse-community [community]=community></browse-community>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-medium-top">
|
||||
<a *ngIf="researchCommunities.length > 3"
|
||||
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
|
||||
routerLinkActive="router-link-active" routerLink="/search/find/communities">
|
||||
<div class="uk-hidden@xl">
|
||||
<div class="uk-grid-match uk-grid-medium uk-child-width-1-3@m uk-child-width-1-1 uk-flex-center uk-text-center"
|
||||
uk-grid>
|
||||
<div *ngFor="let community of researchCommunities.slice(0, 3); let i = index">
|
||||
<div class="uk-card uk-card-default uk-card-hover"
|
||||
[class.uk-disabled]="!hasPermission(community)">
|
||||
<browse-community [community]=community></browse-community>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-medium-top">
|
||||
<a *ngIf="researchCommunities.length > 3"
|
||||
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
|
||||
routerLinkActive="router-link-active" routerLink="/search/find/communities">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
<span>View All</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div #contact class="uk-section uk-container uk-container-large uk-margin-large-bottom uk-flex uk-flex-middle uk-flex-column">
|
||||
<h2 class="uk-text-center uk-width-3-4@m">
|
||||
<div>Let us Help you Develop a Collaborative Science Gateway<span class="uk-text-primary">.</span></div>
|
||||
<div>It is fast<span class="uk-text-primary">.</span> It is reliable<span class="uk-text-primary">.</span></div>
|
||||
</h2>
|
||||
<a class="uk-button uk-button-primary uk-margin-medium-top uk-margin-medium-bottom" routerLink="/contact-us">Contact us</a>
|
||||
</div>
|
||||
<div #contact
|
||||
class="uk-section uk-container uk-container-large uk-margin-large-bottom uk-flex uk-flex-middle uk-flex-column">
|
||||
<h2 class="uk-text-center uk-width-3-4@m">
|
||||
<div>Let us Help you Develop a Collaborative Science Gateway<span class="uk-text-primary">.</span></div>
|
||||
<div>It is fast<span class="uk-text-primary">.</span> It is reliable<span class="uk-text-primary">.</span>
|
||||
</div>
|
||||
</h2>
|
||||
<a class="uk-button uk-button-primary uk-margin-medium-top uk-margin-medium-bottom" routerLink="/contact-us">Contact
|
||||
us</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -14,19 +14,19 @@ import {ErrorMessagesModule} from '../openaireLibrary/utils/errorMessages.m
|
|||
import {SearchFormModule} from '../openaireLibrary/searchPages/searchUtils/searchForm.module';
|
||||
import {BrowseCommunityModule} from './browseCommunity/browse-community.module';
|
||||
import {HelperModule} from "../openaireLibrary/utils/helper/helper.module";
|
||||
import {GifSliderModule} from "../openaireLibrary/utils/gif-slider/gif-slider.module";
|
||||
import {OtherPortalsModule} from "../openaireLibrary/sharedComponents/other-portals/other-portals.module";
|
||||
import {SEOServiceModule} from "../openaireLibrary/sharedComponents/SEO/SEOService.module";
|
||||
import {IsRouteEnabled} from "../openaireLibrary/error/isRouteEnabled.guard";
|
||||
import {SectionScrollModule} from "../openaireLibrary/utils/section-scroll/section-scroll.module";
|
||||
import {IconsModule} from "../openaireLibrary/utils/icons/icons.module";
|
||||
import {SliderUtilsModule} from "../openaireLibrary/sharedComponents/slider-utils/slider-utils.module";
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule, FormsModule, RouterModule,
|
||||
ManageModule, ErrorMessagesModule,
|
||||
SearchFormModule, BrowseCommunityModule, GifSliderModule, OtherPortalsModule,
|
||||
HelperModule, SEOServiceModule, SectionScrollModule, IconsModule
|
||||
SearchFormModule, BrowseCommunityModule, OtherPortalsModule,
|
||||
HelperModule, SEOServiceModule, SectionScrollModule, IconsModule, SliderUtilsModule
|
||||
],
|
||||
declarations: [
|
||||
CommunitiesComponent
|
||||
|
|
|
@ -7,7 +7,6 @@ import {PiwikService} from '../openaireLibrary/utils/piwik/piwik.servic
|
|||
|
||||
import {LearnHowComponent} from "./learn-how.component";
|
||||
import {LearnHowRoutingModule} from "./learn-how-routing.module";
|
||||
import {GifSliderModule} from "../openaireLibrary/utils/gif-slider/gif-slider.module";
|
||||
import {HelperModule} from "../openaireLibrary/utils/helper/helper.module";
|
||||
import {IsRouteEnabled} from "../openaireLibrary/error/isRouteEnabled.guard";
|
||||
import {Schema2jsonldModule} from "../openaireLibrary/sharedComponents/schema2jsonld/schema2jsonld.module";
|
||||
|
@ -20,7 +19,7 @@ import {TabsModule} from '../openaireLibrary/utils/tabs/tabs.module';
|
|||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule, RouterModule, LearnHowRoutingModule, GifSliderModule, HelperModule,
|
||||
CommonModule, RouterModule, LearnHowRoutingModule, HelperModule,
|
||||
Schema2jsonldModule, SEOServiceModule, BreadcrumbsModule, HtmlPagesModule, IconsModule, TabsModule
|
||||
],
|
||||
declarations: [
|
||||
|
|
|
@ -1 +1 @@
|
|||
Subproject commit 6d7f6eca720d18fe694f13e380c1ede1f46303a8
|
||||
Subproject commit cfdd7b2e55e26bdde855d1eb0ba2980918e37771
|
|
@ -1 +1 @@
|
|||
Subproject commit 5feca2d8457324999557feb662b4355d8cf0df4b
|
||||
Subproject commit 51ac1b254b39b3c2d9124f191091fc926f9535fe
|
Loading…
Reference in New Issue