🆙 Fixed and no bugs anymore 🆙

Updated_Cms/resources/themes/atom/js/app.js

@@ -1,9 +1,8 @@
 import "./bootstrap";
 import "./external/flowbite";
 
-import 'swiper/css';
-import 'swiper/css/pagination';
-
+import "swiper/css";
+import "swiper/css/pagination";
 
 import Alpine from "alpinejs";
 import Focus from "@alpinejs/focus";

Updated_Cms/resources/themes/atom/js/components/AtomSliders.js

@@ -1,17 +1,27 @@
 import Swiper from 'swiper';
 import { Autoplay, Pagination } from 'swiper/modules';
 
-export default () => ({
+const AtomSliders = {
     init() {
-        const swiper = new Swiper('.swiper', {
-            modules: [Autoplay, Pagination],
-            autoplay: {
-                delay: 3000,
-            },
-            pagination: {
-                el: '.swiper-pagination',
-            },
-            // andere opties...
+        const swipers = document.querySelectorAll('.swiper');
+        
+        swipers.forEach((swiperEl) => {
+            new Swiper(swiperEl, {
+                modules: [Autoplay, Pagination],
+                autoplay: {
+                    delay: 3000,
+                    disableOnInteraction: false,
+                },
+                pagination: {
+                    el: '.swiper-pagination',
+                    clickable: true,
+                },
+                loop: true,
+                slidesPerView: 1,
+                spaceBetween: 30,
+            });
         });
     }
-});
+};
+
+export default AtomSliders;

Updated_Cms/resources/themes/atom/vite.config.js

@@ -49,7 +49,6 @@ export default defineConfig({
     build: {
         rollupOptions: {
             onwarn(warning, warn) {
-                // Negeer INVALID_ANNOTATION warnings van flowbite
                 if (warning.code === 'INVALID_ANNOTATION') return;
                 warn(warning);
             }