From 8f81085727c4a67215462bbbdcfb64b3e65bb29b Mon Sep 17 00:00:00 2001
From: Dinesh Salunke <dineshsalunke@consultbop.com>
Date: Fri, 3 Nov 2023 11:04:56 +0530
Subject: [PATCH] refactor: simplify the pagination by removing icons and
 spacer

---
 templates/_partials/pagination.tpl | 18 ++++++------------
 1 file changed, 6 insertions(+), 12 deletions(-)

diff --git a/templates/_partials/pagination.tpl b/templates/_partials/pagination.tpl
index 717115e..144e121 100644
--- a/templates/_partials/pagination.tpl
+++ b/templates/_partials/pagination.tpl
@@ -22,8 +22,8 @@
  * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
  * International Registered Trademark & Property of PrestaShop SA
  *}
-<nav class="pagination">
-  <div class="col-md-4">
+<nav class="pagination flex justify-between">
+  <div class="flex">
     {block name='pagination_summary'}
       {l s='Showing %from%-%to% of %total% item(s)' d='Shop.Theme.Catalog' sprintf=['%from%' => $pagination.items_shown_from ,'%to%' => $pagination.items_shown_to, '%total%' => $pagination.total_items]}
     {/block}
@@ -32,28 +32,22 @@
   <div class="col-md-6 offset-md-2 pr-0">
     {block name='pagination_page_list'}
      {if $pagination.should_be_displayed}
-        <ul class="page-list clearfix text-sm-center">
+        <ul class="flex gap-4">
           {foreach from=$pagination.pages item="page"}
-
-
             <li {if $page.current} class="current" {/if}>
-              {if $page.type === 'spacer'}
-                <span class="spacer">&hellip;</span>
-              {else}
                 <a
                   rel="{if $page.type === 'previous'}prev{elseif $page.type === 'next'}next{else}nofollow{/if}"
                   href="{$page.url}"
-                  class="{if $page.type === 'previous'}previous {elseif $page.type === 'next'}next {/if}{['disabled' => !$page.clickable, 'js-search-link' => true]|classnames}"
+                  class="flex items-center {if $page.type === 'previous'}previous {elseif $page.type === 'next'}next {/if}{['disabled' => !$page.clickable, 'js-search-link' => true]|classnames}"
                 >
                   {if $page.type === 'previous'}
-                    <i class="material-icons">&#xE314;</i>{l s='Previous' d='Shop.Theme.Actions'}
+                    {l s='Previous' d='Shop.Theme.Actions'}
                   {elseif $page.type === 'next'}
-                    {l s='Next' d='Shop.Theme.Actions'}<i class="material-icons">&#xE315;</i>
+                    {l s='Next' d='Shop.Theme.Actions'}
                   {else}
                     {$page.page}
                   {/if}
                 </a>
-              {/if}
             </li>
           {/foreach}
         </ul>