start to improve dynamic dots

src/app/shared/swiper/swiper.page.html

@@ -38,3 +38,17 @@
     </span>
   </div>
 </ion-footer>
+
+<!-- <ion-footer>
+  <div *ngIf="publicationList.Files.length > 1" class="dots-container">
+    <span *ngFor="let files of publicationList.Files; let k = index" 
+      [class.dotsSwiper]="true" 
+      [class.active-dot]="swiperIndex === k"
+      [class.preview-dot]="swiperIndex === k - 1 || (swiperIndex === 0 && k === publicationList.Files.length - 1)"
+      [class.next-dot]="swiperIndex === k + 1 || (swiperIndex === publicationList.Files.length - 1 && k === 0)"
+      [class.small-dot]="publicationList.Files.length > 4 && (k < swiperIndex - 1 || k > swiperIndex + 1)"
+      (click)="goToSlide(k)"
+      >
+    </span>
+  </div>
+</ion-footer> -->

src/app/shared/swiper/swiper.page.scss

@@ -332,6 +332,16 @@ swiper-slide video {
   margin-right: 5px;
 }
 
+.preview-dot, .next-dot {
+  width: 7px; /* Reduced size for preview and next dots */
+  height: 7px; /* Reduced size for preview and next dots */
+}
+
+.small-dot {
+  width: 5px; /* Smallest size for dots */
+  height: 5px; /* Smallest size for dots */
+}
+
 .play-button {
   position: absolute;
   top: 50%;

src/app/shared/swiper/swiper.page.ts

@@ -28,15 +28,11 @@ export class SwiperPage implements OnInit {
     public checkFileType: checkFileTypeService,
     public stopvideoService: StopvideoService,
   ) {
-    console.log('swieper', this.publicationList)
   }
 
   ngOnInit() {
-    console.log('swieper', this.publicationList)
-
   }
 
-
   onSlideChange() {
 
     console.log('onchage')