57 lines
2.9 KiB
TypeScript
57 lines
2.9 KiB
TypeScript
|
import {Component, Input} from '@angular/core';
|
|||
|
|
|
|||
|
|
@Component({
|
|||
|
|
selector: 'gif-slider',
|
|||
|
|
template: `
|
|||
|
|
<div class="uk-position-relative" tabindex="-1" uk-slidershow="animation: fade; autoplay: true; autoplay-interval: 6000">
|
|||
|
|
<ul class="uk-slideshow-items">
|
|||
|
|
<li>
|
|||
|
|
<div class="uk-flex uk-flex-middle uk-padding" uk-grid>
|
|||
|
|
<div class="uk-width-1-2">
|
|||
|
|
<img src="../../../../assets/Connect%20animations.gif">
|
|||
|
|
</div>
|
|||
|
|
<div class="uk-width-1-2">
|
|||
|
|
<h1 style="font-size: 28px">Research Community Dashboard 1</h1>
|
|||
|
|
<div class="uk-text-large">This is OpenAIRE’s key service for research communities, both established and emerging ones. Our service helps you reach out and engage all your researchers to practice open science out-of-the-box.</div>
|
|||
|
|
<div class="uk-inline uk-margin-large-top uk-margin-bottom">
|
|||
|
|
<a class="uk-button portal-button" routerLink="/learn-how" routerLinkActive="router-link-active"> LEARN MORE</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</li>
|
|||
|
|
<li>
|
|||
|
|
<div class="uk-flex uk-flex-middle uk-padding" uk-grid>
|
|||
|
|
<div class="uk-width-1-2">
|
|||
|
|
<img src="../../../../assets/Connect%20animations.gif">
|
|||
|
|
</div>
|
|||
|
|
<div class="uk-width-1-2">
|
|||
|
|
<h1 style="font-size: 28px">Research Community Dashboard 2</h1>
|
|||
|
|
<div class="uk-text-large">This is OpenAIRE’s key service for research communities, both established and emerging ones. Our service helps you reach out and engage all your researchers to practice open science out-of-the-box.</div>
|
|||
|
|
<div class="uk-inline uk-margin-large-top uk-margin-bottom">
|
|||
|
|
<a class="uk-button portal-button" routerLink="/learn-how" routerLinkActive="router-link-active"> LEARN MORE</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</li>
|
|||
|
|
<li>
|
|||
|
|
<div class="uk-flex uk-flex-middle uk-padding" uk-grid>
|
|||
|
|
<div class="uk-width-1-2">
|
|||
|
|
<img src="../../../../assets/Connect%20animations.gif">
|
|||
|
|
</div>
|
|||
|
|
<div class="uk-width-1-2">
|
|||
|
|
<h1 style="font-size: 28px">Research Community Dashboard 3</h1>
|
|||
|
|
<div class="uk-text-large">This is OpenAIRE’s key service for research communities, both established and emerging ones. Our service helps you reach out and engage all your researchers to practice open science out-of-the-box.</div>
|
|||
|
|
<div class="uk-inline uk-margin-large-top uk-margin-bottom">
|
|||
|
|
<a class="uk-button portal-button" routerLink="/learn-how" routerLinkActive="router-link-active"> LEARN MORE</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</li>
|
|||
|
|
</ul>
|
|||
|
|
</div>`
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
export class GifSliderComponent {
|
|||
|
|
@Input() gifs: {"gif": string, "header": string, "text"}[];
|
|||
|
|
}
|