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"}[];
|
||
}
|