Fixed bug in pagination on mobile device

sass/pagination.scss

@@ -55,12 +55,12 @@
         }
     }
 
-    .pagination-previous {
+    .pagination-previous-next {
         order: 2;
     }
-    .pagination-next {
-        order: 3;
-    }
+    // .pagination-next {
+    //     order: 3;
+    // }
 
     .pagination-link {
         &.is-current {
@@ -80,4 +80,13 @@
         justify-content: flex-start;
         order: 1;
     }
+
+    @include respond-to("small") {
+        flex-direction: column;
+
+        .pagination-previous-next {
+            margin-bottom: 1rem;
+            order: 1;
+        }
+    }
 }

views/pages/mon-compte/ma-collection.ejs

@@ -76,8 +76,10 @@
         <strong>Nombre total d'éléments : </strong>{{total}}
     </div>
     <nav class="pagination" role="navigation" aria-label="Pagination">
+        <div class="pagination-previous-next">
             <a class="pagination-previous" :class="{'is-disabled': page === 1}" @click="previous">Précédent</a>
             <a class="pagination-next" :class="{'is-disabled': !total || (page*limit) >= total}" @click="next">Suivant</a>
+        </div>
         <ul class="pagination-list">
             <template v-for="p in Array.from({length: totalPages}, (v, i) => (i+1))">
                 <template v-if="p < 4 || p > (totalPages - 3) || (page - 3) <= p && page + 3 >= p">