Production release November 2023 #20
|
@ -17,7 +17,7 @@ export class SliderColumnComponent implements AfterContentInit, OnDestroy {
|
|||
@Input()
|
||||
type: 'slider' | 'nav' = null;
|
||||
@Input()
|
||||
animation = 'uk-animation-fade';
|
||||
animation = null;
|
||||
@ContentChildren(SliderItemComponent) items: QueryList<SliderItemComponent>;
|
||||
@ContentChildren(SliderNavItemComponent) navItems: QueryList<SliderNavItemComponent>;
|
||||
public isMobile: boolean;
|
||||
|
@ -35,12 +35,14 @@ export class SliderColumnComponent implements AfterContentInit, OnDestroy {
|
|||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
this.slides.forEach(slide => {
|
||||
slide.init(this.animation);
|
||||
});
|
||||
this.navItems.forEach(slide => {
|
||||
slide.init(this.animation);
|
||||
});
|
||||
if (this.animation) {
|
||||
this.slides.forEach(slide => {
|
||||
slide.init(this.animation);
|
||||
});
|
||||
this.navItems.forEach(slide => {
|
||||
slide.init(this.animation);
|
||||
});
|
||||
}
|
||||
this.subscriptions.push(this.layoutService.isMobile.subscribe(isMobile => {
|
||||
this.isMobile = isMobile;
|
||||
}));
|
||||
|
@ -56,9 +58,7 @@ export class SliderColumnComponent implements AfterContentInit, OnDestroy {
|
|||
if (this.type === 'nav') {
|
||||
let slides = this.navItems;
|
||||
for (let i = 0; i < slides.length; i++) {
|
||||
if (this.isMobile) {
|
||||
slides.get(i).setActive(slides.get(i).start <= time && (!slides.get(i + 1) || slides.get(i + 1).start > time));
|
||||
}
|
||||
slides.get(i).setActive(!this.isMobile || (slides.get(i).start <= time && (!slides.get(i + 1) || slides.get(i + 1).start > time)));
|
||||
slides.get(i).active = slides.get(i).start <= time && (!slides.get(i + 1) || slides.get(i + 1).start > time);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -18,7 +18,7 @@ export class Stage {
|
|||
@Component({
|
||||
selector: 'slider-container',
|
||||
template: `
|
||||
<div class="uk-grid uk-grid-large uk-flex uk-flex-middle uk-child-width-1-1" [ngClass]="'uk-child-width-1-' + sliders?.length + '@s'" uk-grid>
|
||||
<div class="uk-grid uk-grid-large uk-flex uk-flex-middle uk-flex-between uk-child-width-1-1" [ngClass]="'uk-child-width-1-' + sliders?.length + '@m'" uk-grid>
|
||||
<ng-content></ng-content>
|
||||
</div>
|
||||
<div *ngIf="navigation === 'progress' && stages.length > 0" class="uk-flex uk-flex-center uk-margin-large-top">
|
||||
|
|
Loading…
Reference in New Issue