Project

General

Profile

« Previous | Next » 

Revision 56251

Added by Argiro Kokogiannaki almost 5 years ago

[Library|newlinking]
Merging trunk|library into branch newlinking 56201:56242

View differences:

gif-slider.component.ts
3 3 
@Component({
4 4 
  selector: 'gif-slider',
5 5 
  template: `
6 
    <div class="uk-position-relative uk-height-max-large" tabindex="-1" uk-slideshow="animation: fade; autoplay: true; autoplay-interval: 4000; pause-on-hover: false">
7 
      <ul class="uk-slideshow-items">
8 
        <li *ngFor="let gif of gifs" >
9 
          <div class="uk-flex uk-flex-middle uk-padding" uk-grid>
10 
            <div class="uk-width-1-2 uk-height-medium">
11 
              <img [attr.src]="gif.gif">
6 
    <div tabindex="-1" [attr.uk-slider]="'velocity: ' + velocity +
7 
                                        ';autoplay: '+ autoplay +
8 
                                        ';autoplay-interval: ' + autoplayInterval +
9 
                                        ';pause-on-hover: ' + pauseOnHover +
10 
                                        ';center: ' + center">
11 
     <div class="uk-slider-container">
12 
      <ul class="uk-slider-items uk-child-width-1-1">
13 
        <li *ngFor="let gif of gifs">
14 
          <div class="uk-flex uk-flex-top uk-padding uk-child-width-1-2@m uk-child-width-1-1@s" uk-grid>
15 
            <div>
16 
              <img [attr.src]="gif.gif" class="uk-box-shadow-large uk-border-rounded">
12 17 
            </div>
13 
            <div class="uk-width-1-2 " [ngClass]="(gifRight)?'uk-flex-first':''">
14 
              <h1 style="font-size: 28px">{{gif.header}}</h1>
15 
              <div class="uk-text-large"> {{gif.text}}</div>
18 
            <div [ngClass]="(gifRight)?'uk-flex-first':''">
19 
              <h1>{{gif.header}}</h1>
20 
              <div > {{gif.text}}</div>
16 21 
              <div *ngIf="link" class="uk-inline uk-margin-large-top uk-margin-bottom">
17 22 
                <a class="uk-button portal-button uk-text-uppercase" [routerLink]="route" routerLinkActive="router-link-active">{{linkTitle}}</a>
18 23 
              </div>
......
20 25 
          </div>
21 26 
        </li>
22 27 
      </ul>
28 
      <ul class="uk-slider-nav uk-dotnav uk-flex-center uk-margin"></ul>
29 
     </div>
23 30 
    </div>`
24 31 
})
25 32 

  		




  ......




  29
  36
  
    
  @Input() route = null;


  		




  30
  37
  
    
  @Input() linkTitle = null;


  		




  31
  38
  
    
  @Input() gifRight = false;


  		




  
  39
  
    
  @Input() velocity = 0;


  		




  
  40
  
    
  @Input() autoplay = true;


  		




  
  41
  
    
  @Input() autoplayInterval = 4000;


  		




  
  42
  
    
  @Input() pauseOnHover = false;


  		




  
  43
  
    
  @Input() center = true;


  		




  
  44
  
    

  		




  32
  45
  
    
}


  		












Also available in:  Unified diff