From dce6e17ea18db1f0ff55982fac1eb0a12d85fbd6 Mon Sep 17 00:00:00 2001
From: "k.triantafyllou" <k.triantafyllou@di.uoa.gr>
Date: Tue, 10 Oct 2023 17:12:37 +0300
Subject: [PATCH] Remove animtation from slider and fix active for nav items on
 resize.

---
 .../slider-utils/slider-column.component.ts   | 20 +++++++++----------
 .../slider-container.component.ts             |  2 +-
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/sharedComponents/slider-utils/slider-column.component.ts b/sharedComponents/slider-utils/slider-column.component.ts
index d3bb22a4..8929bb25 100644
--- a/sharedComponents/slider-utils/slider-column.component.ts
+++ b/sharedComponents/slider-utils/slider-column.component.ts
@@ -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);
       }
     }
diff --git a/sharedComponents/slider-utils/slider-container.component.ts b/sharedComponents/slider-utils/slider-container.component.ts
index 4731405c..1fd18467 100644
--- a/sharedComponents/slider-utils/slider-container.component.ts
+++ b/sharedComponents/slider-utils/slider-container.component.ts
@@ -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">