From 3c5af931bd0e64ed255804f85c741970ee697631 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Igor=20Ste=CC=A8pien=CC=81?= <igor@istepien.dev>
Date: Fri, 6 Oct 2023 01:24:35 +0200
Subject: [PATCH] Migration to new bs5 utils classes

---
 .../views/templates/widget/contactform.tpl           |  2 +-
 .../views/templates/hook/empty-product-comment.tpl   |  2 +-
 .../views/templates/hook/post-comment-modal.tpl      |  2 +-
 .../views/templates/hook/product-additional-info.tpl |  2 +-
 .../hook/product-comment-item-prototype.tpl          | 12 ++++++------
 .../views/templates/hook/product-comments-list.tpl   | 10 +++++-----
 .../templates/front/mailalerts-account-line.tpl      |  2 +-
 .../templates/hook/ps_emailsubscription-column.tpl   |  2 +-
 .../views/templates/front/catalog/active-filters.tpl |  2 +-
 .../views/templates/front/catalog/facets.tpl         |  4 ++--
 .../views/templates/hook/hookDisplayFooter.tpl       |  2 +-
 templates/_partials/form-fields.tpl                  |  2 +-
 templates/_partials/password-policy-template.tpl     |  4 ++--
 .../miniatures/_partials/product-prices.tpl          |  4 ++--
 .../catalog/_partials/miniatures/pack-product.tpl    |  2 +-
 templates/catalog/_partials/product-add-to-cart.tpl  |  2 +-
 .../catalog/_partials/product-customization.tpl      |  6 +++---
 templates/catalog/_partials/product-details.tpl      |  6 +++---
 templates/catalog/_partials/product-prices.tpl       |  2 +-
 templates/catalog/_partials/products-top.tpl         |  4 ++--
 templates/catalog/_partials/products.tpl             |  2 +-
 templates/checkout/_partials/address-form.tpl        |  4 ++--
 .../checkout/_partials/address-selector-block.tpl    |  4 ++--
 .../_partials/cart-detailed-product-line.tpl         |  4 ++--
 templates/checkout/_partials/cart-voucher.tpl        |  2 +-
 templates/checkout/_partials/customer-form.tpl       |  2 +-
 templates/checkout/_partials/header.tpl              |  2 +-
 templates/checkout/_partials/login-form.tpl          |  2 +-
 templates/checkout/_partials/steps/addresses.tpl     |  2 +-
 templates/checkout/_partials/steps/checkout-step.tpl |  4 ++--
 .../_partials/steps/personal-information.tpl         |  2 +-
 templates/checkout/_partials/steps/shipping.tpl      |  4 ++--
 templates/checkout/cart.tpl                          |  2 +-
 templates/checkout/order-confirmation.tpl            |  2 +-
 templates/cms/stores.tpl                             |  6 +++---
 templates/components/featured-products.tpl           |  4 ++--
 templates/customer/_partials/block-address.tpl       |  4 ++--
 .../customer/_partials/order-detail-no-return.tpl    |  2 +-
 templates/customer/_partials/order-detail-return.tpl |  2 +-
 templates/customer/discount.tpl                      |  2 +-
 templates/customer/history.tpl                       |  2 +-
 templates/customer/order-detail.tpl                  |  2 +-
 templates/customer/order-follow.tpl                  |  2 +-
 templates/customer/order-slip.tpl                    |  4 ++--
 templates/customer/page.tpl                          |  2 +-
 45 files changed, 72 insertions(+), 72 deletions(-)

diff --git a/modules/contactform/views/templates/widget/contactform.tpl b/modules/contactform/views/templates/widget/contactform.tpl
index b1ed2dd5..702a5809 100644
--- a/modules/contactform/views/templates/widget/contactform.tpl
+++ b/modules/contactform/views/templates/widget/contactform.tpl
@@ -113,7 +113,7 @@
 
         </section>
 
-        <footer class="form-footer text-right">
+        <footer class="form-footer text-end">
           <style>
             input[name=url] {
               display: none !important;
diff --git a/modules/productcomments/views/templates/hook/empty-product-comment.tpl b/modules/productcomments/views/templates/hook/empty-product-comment.tpl
index 7f0e5a20..9c262c1a 100644
--- a/modules/productcomments/views/templates/hook/empty-product-comment.tpl
+++ b/modules/productcomments/views/templates/hook/empty-product-comment.tpl
@@ -27,7 +27,7 @@
   {if $post_allowed}
     <div class="text-center">
       <button class="btn btn-primary js-post-product-comment">
-        <i class="material-icons btn-icon mr-1">edit</i>
+        <i class="material-icons btn-icon me-1">edit</i>
         {l s='Be the first to write your review' d='Modules.Productcomments.Shop'}
       </button>
     </div>
diff --git a/modules/productcomments/views/templates/hook/post-comment-modal.tpl b/modules/productcomments/views/templates/hook/post-comment-modal.tpl
index 46ba9385..7811cc5a 100644
--- a/modules/productcomments/views/templates/hook/post-comment-modal.tpl
+++ b/modules/productcomments/views/templates/hook/post-comment-modal.tpl
@@ -43,7 +43,7 @@
               {foreach from=$criterions item='criterion'}
                 <li>
                   <div class="criterion-rating d-flex">
-                    <label class="mb-0 mr-1">{$criterion.name|escape:'html':'UTF-8'}:</label>
+                    <label class="mb-0 me-1">{$criterion.name|escape:'html':'UTF-8'}:</label>
                     <div
                       class="grade-stars"
                       data-grade="3"
diff --git a/modules/productcomments/views/templates/hook/product-additional-info.tpl b/modules/productcomments/views/templates/hook/product-additional-info.tpl
index 67273a45..b9c62837 100644
--- a/modules/productcomments/views/templates/hook/product-additional-info.tpl
+++ b/modules/productcomments/views/templates/hook/product-additional-info.tpl
@@ -36,7 +36,7 @@
       {include file='module:productcomments/views/templates/hook/average-grade-stars.tpl' grade=$average_grade}
       <div class="additional-links">
         {if $post_allowed}
-          <a class="btn btn-text js-post-product-comment ml-2" href="#product-comments-list-header">
+          <a class="btn btn-text js-post-product-comment ms-2" href="#product-comments-list-header">
             <i class="material-icons btn-icon">edit</i>
             {l s='Write your review' d='Modules.Productcomments.Shop'}
           </a>
diff --git a/modules/productcomments/views/templates/hook/product-comment-item-prototype.tpl b/modules/productcomments/views/templates/hook/product-comment-item-prototype.tpl
index 5b9d76fa..3104ebfb 100644
--- a/modules/productcomments/views/templates/hook/product-comment-item-prototype.tpl
+++ b/modules/productcomments/views/templates/hook/product-comment-item-prototype.tpl
@@ -28,10 +28,10 @@
     <div class="font-weight-bold">
       @CUSTOMER_NAME@
     </div>
-    {* <div class="text-muted font-sm ml-2">
+    {* <div class="text-muted font-sm ms-2">
       @COMMENT_DATE@
     </div> *}
-    <div class="grade-stars flex-shrink-0 flex-grow-0 ml-auto"></div>
+    <div class="grade-stars flex-shrink-0 flex-grow-0 ms-auto"></div>
   </div>
 
   <div class="comment-content">
@@ -39,19 +39,19 @@
     <p class="font-sm">@COMMENT_COMMENT@</p>
     <div class="d-flex">
       {if $usefulness_enabled}
-        <div class="mr-2">
+        <div class="me-2">
           <a href="#" role="button" class="btn btn-text btn-sm d-inline-flex align-items-center font-lg js-useful-review">
             <i class="material-icons text-reset font-reset thumb_up"></i>
-            <span class="js-useful-review-value font-sm ml-1">@COMMENT_USEFUL_ADVICES@</span>
+            <span class="js-useful-review-value font-sm ms-1">@COMMENT_USEFUL_ADVICES@</span>
           </a>
           <a href="#" role="button" class="btn btn-text btn-sm d-inline-flex align-items-center font-lg js-not-useful-review">
             <i class="material-icons text-reset font-reset thumb_down"></i>
-            <span class="js-not-useful-review-value font-sm ml-1">@COMMENT_NOT_USEFUL_ADVICES@</span>
+            <span class="js-not-useful-review-value font-sm ms-1">@COMMENT_NOT_USEFUL_ADVICES@</span>
           </a>
         </div>
       {/if}
 
-      <div class="ml-auto">
+      <div class="ms-auto">
         <a href="#" role="button" class="btn btn-text btn-sm d-inline-flex align-items-center font-lg js-report-abuse" title="{l s='Report abuse' d='Modules.Productcomments.Shop'}">
           <i class="material-icons text-reset font-reset outlined_flag"></i>
         </a>
diff --git a/modules/productcomments/views/templates/hook/product-comments-list.tpl b/modules/productcomments/views/templates/hook/product-comments-list.tpl
index 6c3376f9..85973566 100644
--- a/modules/productcomments/views/templates/hook/product-comments-list.tpl
+++ b/modules/productcomments/views/templates/hook/product-comments-list.tpl
@@ -29,11 +29,11 @@
 
 <div class="mb-4">
   <div class="d-flex my-4" id="product-comments-list-header">
-    <div class="comments-nb h3 d-flex align-items-center mr-3 mb-0">
-      <i class="material-icons mr-2">chat</i>
+    <div class="comments-nb h3 d-flex align-items-center me-3 mb-0">
+      <i class="material-icons me-2">chat</i>
       {l s='Comments' d='Modules.Productcomments.Shop'} ({$nb_comments})
     </div>
-    <div class="ml-auto">
+    <div class="ms-auto">
       {include file='module:productcomments/views/templates/hook/average-grade-stars.tpl' grade=$average_grade}
     </div>
   </div>
@@ -51,11 +51,11 @@
   </div>
 
   <div class="flex-column flex-sm-row d-flex align-items-center" id="product-comments-list-footer">
-    <div id="product-comments-list-pagination" class="comments-pagination ml-sm-auto order-sm-1"></div>
+    <div id="product-comments-list-pagination" class="comments-pagination ms-sm-auto order-sm-1"></div>
     {if $post_allowed && $nb_comments != 0}
       <div class="my-sm-2 mt-3">
         <button class="btn btn-primary js-post-product-comment">
-          <i class="material-icons btn-icon mr-1">edit</i>
+          <i class="material-icons btn-icon me-1">edit</i>
           {l s='Write your review' d='Modules.Productcomments.Shop'}
         </button>
       </div>
diff --git a/modules/ps_emailalerts/views/templates/front/mailalerts-account-line.tpl b/modules/ps_emailalerts/views/templates/front/mailalerts-account-line.tpl
index e3cc9b32..c142763c 100644
--- a/modules/ps_emailalerts/views/templates/front/mailalerts-account-line.tpl
+++ b/modules/ps_emailalerts/views/templates/front/mailalerts-account-line.tpl
@@ -24,7 +24,7 @@
 *}
 
 <div class="card overflow-hidden">
-  <div class="row no-gutters flex-nowrap align-items-center">
+  <div class="row g-0 flex-nowrap align-items-center">
     <div class="col-auto">
       <a href="{$mailAlert.link}">
         <img src="{$mailAlert.cover_url}" alt=""/>
diff --git a/modules/ps_emailsubscription/views/templates/hook/ps_emailsubscription-column.tpl b/modules/ps_emailsubscription/views/templates/hook/ps_emailsubscription-column.tpl
index 7a4dd7fb..e39ae98e 100644
--- a/modules/ps_emailsubscription/views/templates/hook/ps_emailsubscription-column.tpl
+++ b/modules/ps_emailsubscription/views/templates/hook/ps_emailsubscription-column.tpl
@@ -29,7 +29,7 @@
       <p id="block-newsletter-label" class="col-12">{l s='Get our latest news and special sales' d='Shop.Theme.Global'}</p>
       <div class="col-12 mb-1">
         <input
-          class="btn btn-primary float-right"
+          class="btn btn-primary float-end"
           name="submitNewsletter"
           type="submit"
           value="{l s='OK' d='Shop.Theme.Actions'}"
diff --git a/modules/ps_facetedsearch/views/templates/front/catalog/active-filters.tpl b/modules/ps_facetedsearch/views/templates/front/catalog/active-filters.tpl
index 39bb79ce..0db6b871 100644
--- a/modules/ps_facetedsearch/views/templates/front/catalog/active-filters.tpl
+++ b/modules/ps_facetedsearch/views/templates/front/catalog/active-filters.tpl
@@ -36,7 +36,7 @@
             {block name='active_filters_item'}
               <li class="col flex-grow-0 flex-shrink-0 p-1">
                 <a class="text-nowrap btn btn-outline-secondary btn-sm js-search-link d-flex align-items-center" href="{$filter.nextEncodedFacetsURL}" rel="nofollow">
-                  {l s='%1$s:' d='Shop.Theme.Catalog' sprintf=[$filter.facetLabel]} {$filter.label} <i class="material-icons font-reset ml-1 align-middle">&#xE14C;</i>
+                  {l s='%1$s:' d='Shop.Theme.Catalog' sprintf=[$filter.facetLabel]} {$filter.label} <i class="material-icons font-reset ms-1 align-middle">&#xE14C;</i>
                 </a>
               </li>
             {/block}
diff --git a/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl b/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl
index 59953320..fcdba1f0 100644
--- a/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl
+++ b/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl
@@ -37,7 +37,7 @@
             <div class="clear-all-wrapper card-body">
               <button data-search-url="{$clear_all_link}"
                 class="btn btn-sm btn-block btn-outline-secondary btn-sm js-search-filters-clear-all">
-                <i class="material-icons font-reset mr-1 align-middle">&#xE14C;</i>
+                <i class="material-icons font-reset me-1 align-middle">&#xE14C;</i>
                 {l s='Clear all' d='Shop.Theme.Actions'}
               </button>
             </div>
@@ -143,7 +143,7 @@
                               data-action="range-from"
                               >
                           </div>
-                          <div class="px-2 ml-auto search-filters__input-group">
+                          <div class="px-2 ms-auto search-filters__input-group">
                             <input
                               class="js-input-range-slider form-control form-control-sm text-center search-filters__input"
                               type="text"
diff --git a/modules/ps_legalcompliance/views/templates/hook/hookDisplayFooter.tpl b/modules/ps_legalcompliance/views/templates/hook/hookDisplayFooter.tpl
index e32a2897..80a08f1c 100644
--- a/modules/ps_legalcompliance/views/templates/hook/hookDisplayFooter.tpl
+++ b/modules/ps_legalcompliance/views/templates/hook/hookDisplayFooter.tpl
@@ -27,7 +27,7 @@
   <h3 class="hidden-sm-down">{l s='Information' d='Modules.Legalcompliance.Shop'}</h3>
   <div class="title clearfix hidden-md-up" data-target="#footer_eu_about_us_list" data-toggle="collapse">
     <span class="h3">{l s='Information' d='Modules.Legalcompliance.Shop'}</span>
-    <span class="float-right">
+    <span class="float-end">
       <span class="navbar-toggler collapse-icons">
         <i class="add">add</i>
         <i class="remove">remove</i>
diff --git a/templates/_partials/form-fields.tpl b/templates/_partials/form-fields.tpl
index 3840bd38..ced77e53 100644
--- a/templates/_partials/form-fields.tpl
+++ b/templates/_partials/form-fields.tpl
@@ -48,7 +48,7 @@
   <div class="form-group js-input-column">
     {if $field.type == 'checkbox' || $field.type == 'radio-buttons'}
       {if $field.type == 'radio-buttons'}
-        <div class="form-label label mr-3">{$field.label}</div>
+        <div class="form-label label me-3">{$field.label}</div>
       {/if}
     {else}
       <label class="form-label {if $field.required}required{/if}" for="f-{$field.name}_{$uniqId}">
diff --git a/templates/_partials/password-policy-template.tpl b/templates/_partials/password-policy-template.tpl
index 03a00585..8ca1844b 100644
--- a/templates/_partials/password-policy-template.tpl
+++ b/templates/_partials/password-policy-template.tpl
@@ -17,11 +17,11 @@
     <div class="js-password-strength-text password-strength-text"></div>
     <div class="password-requirements">
       <p class="js-password-requirements-length password-requirements-length font-sm d-flex align-items-center my-2" data-translation="{l s='Enter a password between %s and %s characters' d='Shop.Theme.Customeraccount'}">
-        <i class="material-icons mr-1 font-size-lg">check_circle</i>
+        <i class="material-icons me-1 font-size-lg">check_circle</i>
         <span></span>
       </p>
       <p class="js-password-requirements-score password-requirements-score font-sm d-flex align-items-center my-2" data-translation="{l s='The minimum score must be: %s' d='Shop.Theme.Customeraccount'}">
-        <i class="material-icons mr-1 font-size-lg">check_circle</i>
+        <i class="material-icons me-1 font-size-lg">check_circle</i>
         <span></span>
       </p>
     </div>
diff --git a/templates/catalog/_partials/miniatures/_partials/product-prices.tpl b/templates/catalog/_partials/miniatures/_partials/product-prices.tpl
index 01ea9df5..5018d470 100644
--- a/templates/catalog/_partials/miniatures/_partials/product-prices.tpl
+++ b/templates/catalog/_partials/miniatures/_partials/product-prices.tpl
@@ -1,9 +1,9 @@
 {block name='product_price_and_shipping'}
   {if $product.show_price}
-    <div class="product-miniature__pricing text-right">
+    <div class="product-miniature__pricing text-end">
       {if $product.has_discount}
         {hook h='displayProductPriceBlock' product=$product type="old_price"}
-        <span class="price price--regular mr-1" aria-label="{l s='Regular price' d='Shop.Theme.Catalog'}">{$product.regular_price}</span>
+        <span class="price price--regular me-1" aria-label="{l s='Regular price' d='Shop.Theme.Catalog'}">{$product.regular_price}</span>
       {/if}
 
       {hook h='displayProductPriceBlock' product=$product type="before_price"}
diff --git a/templates/catalog/_partials/miniatures/pack-product.tpl b/templates/catalog/_partials/miniatures/pack-product.tpl
index ca8dfbdf..8c2e7b7a 100644
--- a/templates/catalog/_partials/miniatures/pack-product.tpl
+++ b/templates/catalog/_partials/miniatures/pack-product.tpl
@@ -24,7 +24,7 @@
  *}
 {block name='pack_miniature_item'}
   <div class="card overflow-hidden">
-    <div class="row no-gutters flex-nowrap">
+    <div class="row g-0 flex-nowrap">
       <div class="col-4 col-md-3 col-xl-2">
         <a href="{$product.url}" title="{$product.name}">
           {images_block webpEnabled=$webpEnabled}
diff --git a/templates/catalog/_partials/product-add-to-cart.tpl b/templates/catalog/_partials/product-add-to-cart.tpl
index acadc8b8..e332cee0 100644
--- a/templates/catalog/_partials/product-add-to-cart.tpl
+++ b/templates/catalog/_partials/product-add-to-cart.tpl
@@ -28,7 +28,7 @@
     {block name='product_quantity'}
       <div class="product-quantity row mb-1 mx-n1 mt-n2 align-items-center">
         <div class="qty col-12 col-sm-auto mx-auto mt-2 px-1">
-          <div class="js-product-qty-spinner row no-gutters">
+          <div class="js-product-qty-spinner row g-0">
             <div class="col-auto">
               <a href="#" class="js-custom-qty-btn-down">
                 -
diff --git a/templates/catalog/_partials/product-customization.tpl b/templates/catalog/_partials/product-customization.tpl
index 9ad4f7dc..64a7d4f3 100644
--- a/templates/catalog/_partials/product-customization.tpl
+++ b/templates/catalog/_partials/product-customization.tpl
@@ -40,7 +40,7 @@
                   <label class="customization-label">{$field.label}</label>
                   {if $field.type == 'text'}
                     <textarea placeholder="{l s='Your message here' d='Shop.Forms.Help'}" class="product-message" maxlength="250" {if $field.required} required {/if} name="{$field.input_name}"></textarea>
-                    <small class="float-right">{l s='250 char. max' d='Shop.Forms.Help'}</small>
+                    <small class="float-end">{l s='250 char. max' d='Shop.Forms.Help'}</small>
                     {if $field.text !== ''}
                         <h6 class="customization-message">{l s='Your customization:' d='Shop.Theme.Catalog'}
                             <label>{$field.text}</label>
@@ -58,13 +58,13 @@
                       <button class="btn btn-primary">{l s='Choose file' d='Shop.Theme.Actions'}</button>
                     </span>
                     {assign var=authExtensions value=' .'|implode:constant('ImageManager::EXTENSIONS_SUPPORTED')}
-                    <small class="float-xs-right">.{$authExtensions}</small>
+                    <small class="float-end">.{$authExtensions}</small>
                   {/if}
                 </li>
               {/foreach}
             </ul>
             <div class="clearfix">
-              <button class="btn btn-primary float-right" type="submit" name="submitCustomizedData">{l s='Save Customization' d='Shop.Theme.Actions'}</button>
+              <button class="btn btn-primary float-end" type="submit" name="submitCustomizedData">{l s='Save Customization' d='Shop.Theme.Actions'}</button>
             </div>
           </form>
         {/block}
diff --git a/templates/catalog/_partials/product-details.tpl b/templates/catalog/_partials/product-details.tpl
index c01ddfff..34632513 100644
--- a/templates/catalog/_partials/product-details.tpl
+++ b/templates/catalog/_partials/product-details.tpl
@@ -56,9 +56,9 @@
     {if $product.grouped_features}
       <section class="product-features my-3">
         <p class="h6">{l s='Data sheet' d='Shop.Theme.Catalog'}</p>
-        <dl class="row no-gutters mb-0">
+        <dl class="row g-0 mb-0">
           {foreach from=$product.grouped_features item=feature}
-            <dt class="col-4 pr-3 {if !$feature@last}pb-2 mb-2 border-bottom{/if}">{$feature.name}</dt>
+            <dt class="col-4 pe-3 {if !$feature@last}pb-2 mb-2 border-bottom{/if}">{$feature.name}</dt>
             <dd class="col-8 {if !$feature@last}pb-2 mb-2 border-bottom{/if}">{$feature.value|escape:'htmlall'|nl2br nofilter}</dd>
           {/foreach}
         </dl>
@@ -73,7 +73,7 @@
         <p class="h6">{l s='Specific References' d='Shop.Theme.Catalog'}</p>
           <dl class="row">
             {foreach from=$product.specific_references item=reference key=key}
-              <dt class="col-4 pr-3 {if !$reference@last}pb-2 mb-2 border-bottom{/if}">{$key}</dt>
+              <dt class="col-4 pe-3 {if !$reference@last}pb-2 mb-2 border-bottom{/if}">{$key}</dt>
               <dd class="col-8 {if !$reference@last}pb-2 mb-2 border-bottom{/if}">{$reference}</dd>
             {/foreach}
           </dl>
diff --git a/templates/catalog/_partials/product-prices.tpl b/templates/catalog/_partials/product-prices.tpl
index fd88a992..dc90b9cf 100644
--- a/templates/catalog/_partials/product-prices.tpl
+++ b/templates/catalog/_partials/product-prices.tpl
@@ -48,7 +48,7 @@
           </span>
           {block name='product_discount'}
             {if $product.has_discount}
-              <span class="ml-2 price price--regular">{$product.regular_price}</span>
+              <span class="ms-2 price price--regular">{$product.regular_price}</span>
             {/if}
           {/block}
           {hook h='displayProductPriceBlock' product=$product type="old_price"}
diff --git a/templates/catalog/_partials/products-top.tpl b/templates/catalog/_partials/products-top.tpl
index f45b6a75..e3b29359 100644
--- a/templates/catalog/_partials/products-top.tpl
+++ b/templates/catalog/_partials/products-top.tpl
@@ -35,7 +35,7 @@
     {/block}
   </div>
 
-  <div class="col-sm-auto col-12 mt-2 d-md-none ml-auto">
+  <div class="col-sm-auto col-12 mt-2 d-md-none ms-auto">
     {if !empty($listing.rendered_facets)}
       <button data-target="#mobile_filters" data-toggle="modal" class="btn btn-secondary d-sm-inline-block d-none">
         {l s='Filter' d='Shop.Theme.Actions'}
@@ -46,7 +46,7 @@
     {/if}
   </div>
 
-  <div class="col-auto d-none d-lg-block ml-auto mt-2">
+  <div class="col-auto d-none d-lg-block ms-auto mt-2">
     <ul class="display-toggle d-flex align-items-center mx-n1 m-0">
       <li class="display-toggle__elem px-1">
         <a href="#" data-toggle-listing data-display-type="grid" class="display-toggle__link d-inline-block {if $listingDisplayType == 'grid'}active{/if}">
diff --git a/templates/catalog/_partials/products.tpl b/templates/catalog/_partials/products.tpl
index 19e13aa9..eae7fc60 100644
--- a/templates/catalog/_partials/products.tpl
+++ b/templates/catalog/_partials/products.tpl
@@ -30,7 +30,7 @@
     {include file='_partials/pagination.tpl' pagination=$listing.pagination}
   {/block}
 
-  <div class="hidden-md-up text-xs-right up">
+  <div class="hidden-md-up text-end up">
     <a href="#header" class="btn btn-secondary">
       {l s='Back to top' d='Shop.Theme.Actions'}
     </a>
diff --git a/templates/checkout/_partials/address-form.tpl b/templates/checkout/_partials/address-form.tpl
index 102b16b0..68c162bf 100644
--- a/templates/checkout/_partials/address-form.tpl
+++ b/templates/checkout/_partials/address-form.tpl
@@ -31,14 +31,14 @@
 {block name='form_buttons'}
   {if !$form_has_continue_button}
     <div class="d-flex align-items-center justify-content-end">
-      <a class="js-cancel-address cancel-address btn btn-link mr-auto" href="{url entity='order' params=['cancelAddress' => {$type}]}">{l s='Cancel' d='Shop.Theme.Actions'}</a>
+      <a class="js-cancel-address cancel-address btn btn-link me-auto" href="{url entity='order' params=['cancelAddress' => {$type}]}">{l s='Cancel' d='Shop.Theme.Actions'}</a>
       <button type="submit" class="btn btn-primary">{l s='Save' d='Shop.Theme.Actions'}</button>
     </div>
 
   {else}
     <div class="d-flex align-items-center justify-content-end">
       {if $customer.addresses|count > 0}
-        <a class="js-cancel-address cancel-address btn btn-link mr-auto" href="{url entity='order' params=['cancelAddress' => {$type}]}">{l s='Cancel' d='Shop.Theme.Actions'}</a>
+        <a class="js-cancel-address cancel-address btn btn-link me-auto" href="{url entity='order' params=['cancelAddress' => {$type}]}">{l s='Cancel' d='Shop.Theme.Actions'}</a>
       {/if}
       <button type="submit" class="continue btn btn-primary" name="confirm-addresses" value="1">
           {l s='Continue' d='Shop.Theme.Actions'}
diff --git a/templates/checkout/_partials/address-selector-block.tpl b/templates/checkout/_partials/address-selector-block.tpl
index b7a3d223..0cb8b5dc 100644
--- a/templates/checkout/_partials/address-selector-block.tpl
+++ b/templates/checkout/_partials/address-selector-block.tpl
@@ -41,11 +41,11 @@
 
             <a class="edit-address js-edit-address d-flex justify-content-center align-items-center" data-link-action="edit-address"
               href="{url entity='order' params=['id_address' => $address.id, 'editAddress' => $type, 'token' => $token]}">
-              <i class="material-icons mr-1">&#xE254;</i>{l s='Edit' d='Shop.Theme.Actions'}
+              <i class="material-icons me-1">&#xE254;</i>{l s='Edit' d='Shop.Theme.Actions'}
             </a>
             <a class="delete-address js-delete-address d-flex justify-content-center align-items-center" data-link-action="delete-address"
               href="{url entity='order' params=['id_address' => $address.id, 'deleteAddress' => true, 'token' => $token]}">
-              <i class="material-icons mr-1">&#xE872;</i>{l s='Delete' d='Shop.Theme.Actions'}
+              <i class="material-icons me-1">&#xE872;</i>{l s='Delete' d='Shop.Theme.Actions'}
             </a>
           </div>
 
diff --git a/templates/checkout/_partials/cart-detailed-product-line.tpl b/templates/checkout/_partials/cart-detailed-product-line.tpl
index 6248130e..1f2bcea6 100644
--- a/templates/checkout/_partials/cart-detailed-product-line.tpl
+++ b/templates/checkout/_partials/cart-detailed-product-line.tpl
@@ -55,7 +55,7 @@
       <div class="product-line-info product-price{if $product.has_discount} has-discount{/if}">
         <div class="current-price">
           {if $product.has_discount}
-            <span class="price price--regular mr-1">{$product.regular_price}</span>
+            <span class="price price--regular me-1">{$product.regular_price}</span>
           {/if}
           <span
             class="current-price-display price{if $product.has_discount} current-price-discount{/if}">{$product.price}</span>
@@ -117,7 +117,7 @@
       {if !empty($product.is_gift)}
         <span class="gift-quantity">{$product.quantity}</span>
       {else}
-          <div class="js-custom-cart-qty-spinner row no-gutters">
+          <div class="js-custom-cart-qty-spinner row g-0">
               <div class="col-auto">
                   <a href="#" class="js-custom-qty-btn-down">
                       -
diff --git a/templates/checkout/_partials/cart-voucher.tpl b/templates/checkout/_partials/cart-voucher.tpl
index 9deea9f6..a9188593 100644
--- a/templates/checkout/_partials/cart-voucher.tpl
+++ b/templates/checkout/_partials/cart-voucher.tpl
@@ -39,7 +39,7 @@
                             href="{$voucher.delete_url}"
                             data-link-action="remove-voucher"
                             data-id-discount="{$voucher.id_cart_rule}"
-                            class="text-danger ml-1 js-voucher-delete">
+                            class="text-danger ms-1 js-voucher-delete">
                           <span class="material-icons font-reset btn-icon">delete</span>
                         </a>
                       {/if}
diff --git a/templates/checkout/_partials/customer-form.tpl b/templates/checkout/_partials/customer-form.tpl
index 81b31646..0eff5f92 100644
--- a/templates/checkout/_partials/customer-form.tpl
+++ b/templates/checkout/_partials/customer-form.tpl
@@ -45,7 +45,7 @@
 {/block}
 
 {block "form_buttons"}
-  <div class="text-right">
+  <div class="text-end">
     <button
       class="continue btn btn-primary d-none d-md-inline-block"
       name="continue"
diff --git a/templates/checkout/_partials/header.tpl b/templates/checkout/_partials/header.tpl
index 6e65c48f..10766545 100644
--- a/templates/checkout/_partials/header.tpl
+++ b/templates/checkout/_partials/header.tpl
@@ -43,7 +43,7 @@
             {/images_block}
           </a>
         </div>
-        <div class="col d-none d-md-block text-right">
+        <div class="col d-none d-md-block text-end">
           {hook h='displayNav1'}
         </div>
       </div>
diff --git a/templates/checkout/_partials/login-form.tpl b/templates/checkout/_partials/login-form.tpl
index bc1e36d5..e5b7c005 100644
--- a/templates/checkout/_partials/login-form.tpl
+++ b/templates/checkout/_partials/login-form.tpl
@@ -25,7 +25,7 @@
 {extends file='customer/_partials/login-form.tpl'}
 
 {block name='form_buttons'}
-  <div class="text-right">
+  <div class="text-end">
     <button
       class="continue btn btn-primary d-none d-md-inline-block"
       name="continue"
diff --git a/templates/checkout/_partials/steps/addresses.tpl b/templates/checkout/_partials/steps/addresses.tpl
index 999e2088..145f1ded 100644
--- a/templates/checkout/_partials/steps/addresses.tpl
+++ b/templates/checkout/_partials/steps/addresses.tpl
@@ -123,7 +123,7 @@
       {/if}
 
       {if !$form_has_continue_button}
-        <div class="text-right">
+        <div class="text-end">
           <button type="submit" class="btn btn-primary continue d-none d-md-inline-block" name="confirm-addresses" value="1">
             {l s='Continue' d='Shop.Theme.Actions'}
           </button>
diff --git a/templates/checkout/_partials/steps/checkout-step.tpl b/templates/checkout/_partials/steps/checkout-step.tpl
index 0f749ebc..84b85bd0 100644
--- a/templates/checkout/_partials/steps/checkout-step.tpl
+++ b/templates/checkout/_partials/steps/checkout-step.tpl
@@ -51,10 +51,10 @@
         {if $step_is_reachable}
           <a
             href="#"
-            class="ml-auto checkout-step__edit-btn step-edit js-step-edit text-muted btn btn-sm btn-link py-0 stretched-link"
+            class="ms-auto checkout-step__edit-btn step-edit js-step-edit text-muted btn btn-sm btn-link py-0 stretched-link"
             data-target="#content-{$identifier}">
             <span class="d-inline-flex align-items-center">
-              <span class="material-icons font-sm mr-1 btn-icon">mode_edit</span>
+              <span class="material-icons font-sm me-1 btn-icon">mode_edit</span>
               {l s='Edit' d='Shop.Theme.Actions'}
             </span>
           </a>
diff --git a/templates/checkout/_partials/steps/personal-information.tpl b/templates/checkout/_partials/steps/personal-information.tpl
index 7e9d26b0..e147ea21 100644
--- a/templates/checkout/_partials/steps/personal-information.tpl
+++ b/templates/checkout/_partials/steps/personal-information.tpl
@@ -32,7 +32,7 @@
       <p><small>{l s='If you sign out now, your cart will be emptied.' d='Shop.Theme.Checkout'}</small></p>
     {/if}
 
-    <div class="text-right">
+    <div class="text-end">
       <form method="GET" action="{$urls.pages.order}">
         <button
           class="continue btn btn-primary d-none d-md-inline-block"
diff --git a/templates/checkout/_partials/steps/shipping.tpl b/templates/checkout/_partials/steps/shipping.tpl
index 2d486a23..31038308 100644
--- a/templates/checkout/_partials/steps/shipping.tpl
+++ b/templates/checkout/_partials/steps/shipping.tpl
@@ -66,7 +66,7 @@
 
                               </div>
                               <div class="col-sm-auto col-12 checkout-option__col checkout-option__col--price mt-sm-0 mt-1">
-                                <div class="checkout-option__price price text-right">
+                                <div class="checkout-option__price price text-end">
                                   {$carrier.price}
                                 </div>
                               </div>
@@ -112,7 +112,7 @@
 
           </div>
         </div>
-        <div class="text-right mt-3">
+        <div class="text-end mt-3">
           <button type="submit" class="continue btn btn-primary d-none d-md-inline-block" name="confirmDeliveryOption" value="1">
             {l s='Continue' d='Shop.Theme.Actions'}
           </button>
diff --git a/templates/checkout/cart.tpl b/templates/checkout/cart.tpl
index 98903721..81115c35 100644
--- a/templates/checkout/cart.tpl
+++ b/templates/checkout/cart.tpl
@@ -45,7 +45,7 @@
         {block name='continue_shopping'}
           <div class="my-3">
             <a class="btn btn-outline-primary" href="{$urls.pages.index}">
-              <span class="material-icons btn-icon mr-1">keyboard_arrow_left</span>
+              <span class="material-icons btn-icon me-1">keyboard_arrow_left</span>
               {l s='Continue shopping' d='Shop.Theme.Actions'}
             </a>
           </div>
diff --git a/templates/checkout/order-confirmation.tpl b/templates/checkout/order-confirmation.tpl
index 466ab4a0..f0fb6faa 100644
--- a/templates/checkout/order-confirmation.tpl
+++ b/templates/checkout/order-confirmation.tpl
@@ -46,7 +46,7 @@
     {/block}
   </section>
 
-  <div class="row card-group no-gutters my-4">
+  <div class="row card-group g-0 my-4">
     {block name='order_details'}
       <div class="col-sm-6 col-12 card">
         <div class="card-header">
diff --git a/templates/cms/stores.tpl b/templates/cms/stores.tpl
index 1295b59f..c521a2e3 100644
--- a/templates/cms/stores.tpl
+++ b/templates/cms/stores.tpl
@@ -114,7 +114,7 @@
             <ul class="card-block mb-0 row">
               {if $store.phone}
                 <li class="col-md-4 d-flex align-items-center mt-1">
-                  <span class="material-icons mr-2 font-reset">
+                  <span class="material-icons me-2 font-reset">
                     call
                   </span>
                   <a href="tel:{$store.phone}">{$store.phone}</a>
@@ -122,7 +122,7 @@
               {/if}
               {if $store.fax}
                 <li class="col-md-4 d-flex align-items-center mt-1">
-                  <span class="material-icons mr-2 font-reset">
+                  <span class="material-icons me-2 font-reset">
                     local_printshop
                   </span>
                   <span>{$store.fax}</span>
@@ -130,7 +130,7 @@
               {/if}
               {if $store.email}
                 <li class="col-md-4 d-flex align-items-center mt-1">
-                  <span class="material-icons mr-2 font-reset">
+                  <span class="material-icons me-2 font-reset">
                     mail
                   </span>
                   <a href="mailto:{$store.email}">
diff --git a/templates/components/featured-products.tpl b/templates/components/featured-products.tpl
index cd6197b7..84c53aa4 100644
--- a/templates/components/featured-products.tpl
+++ b/templates/components/featured-products.tpl
@@ -8,7 +8,7 @@
             {$smarty.block.child}
           </p>
         {/block}
-        <div class="featured-products__navigation d-flex flex-grow-0 flex-shrink-0 ml-auto">
+        <div class="featured-products__navigation d-flex flex-grow-0 flex-shrink-0 ms-auto">
           <div class="swiper-button-prev swiper-button-custom position-static">
             <span class="sr-only">{l s='Previous' d='Shop.Theme.Actions'}</span>
             <span class="material-icons">keyboard_arrow_left</span>
@@ -49,7 +49,7 @@
     </div>
 
     {block name='featured_products_footer' hide}
-      <div class="featured-products__footer mt-4 text-right">
+      <div class="featured-products__footer mt-4 text-end">
         {$smarty.block.child}
       </div>
     {/block}
diff --git a/templates/customer/_partials/block-address.tpl b/templates/customer/_partials/block-address.tpl
index fec508c6..5c5aa693 100644
--- a/templates/customer/_partials/block-address.tpl
+++ b/templates/customer/_partials/block-address.tpl
@@ -32,11 +32,11 @@
     {block name='address_block_item_actions'}
       <div class="address__footer small card-footer">
         <a class="d-flex align-items-center justify-content-center" href="{url entity=address id=$address.id}" data-link-action="edit-address">
-          <i class="material-icons mr-1 font-reset">&#xE254;</i>
+          <i class="material-icons me-1 font-reset">&#xE254;</i>
           <span>{l s='Update' d='Shop.Theme.Actions'}</span>
         </a>
         <a class="d-flex align-items-center justify-content-center" href="{url entity=address id=$address.id params=['delete' => 1, 'token' => $token]}" data-link-action="delete-address">
-          <i class="material-icons mr-1 font-reset">&#xE872;</i>
+          <i class="material-icons me-1 font-reset">&#xE872;</i>
           <span>{l s='Delete' d='Shop.Theme.Actions'}</span>
         </a>
       </div>
diff --git a/templates/customer/_partials/order-detail-no-return.tpl b/templates/customer/_partials/order-detail-no-return.tpl
index d47aba3d..512ad6be 100644
--- a/templates/customer/_partials/order-detail-no-return.tpl
+++ b/templates/customer/_partials/order-detail-no-return.tpl
@@ -28,7 +28,7 @@
     {include file="customer/_partials/product-table.tpl" products=$order.products}
   </div>
 
-  <div class="row card-group no-gutters my-4">
+  <div class="row card-group g-0 my-4">
     {block name='order_details'}
       <div class="col-sm-6 col-12 card mb-sm-0 mb-4">
         <div class="card-header">
diff --git a/templates/customer/_partials/order-detail-return.tpl b/templates/customer/_partials/order-detail-return.tpl
index 7d0f03d4..755640c9 100644
--- a/templates/customer/_partials/order-detail-return.tpl
+++ b/templates/customer/_partials/order-detail-return.tpl
@@ -28,7 +28,7 @@
     {include file="customer/_partials/product-table.tpl" products=$order.products}
   </div>
 
-  <div class="row card-group no-gutters my-4">
+  <div class="row card-group g-0 my-4">
     {block name='order_details'}
       <div class="col-sm-6 col-12 card  mb-sm-0 mb-4">
         <div class="card-header">
diff --git a/templates/customer/discount.tpl b/templates/customer/discount.tpl
index ecf743da..b5990721 100644
--- a/templates/customer/discount.tpl
+++ b/templates/customer/discount.tpl
@@ -47,7 +47,7 @@
           <tr>
             <th scope="row" class="align-middle">{$cart_rule.code}</th>
             <td class="align-middle">{$cart_rule.name}</td>
-            <td class="text-xs-right">{$cart_rule.quantity_for_user}</td>
+            <td class="text-end">{$cart_rule.quantity_for_user}</td>
             <td class="align-middle">
               <span class="text-primary font-weight-bold text-lowercase align-middle">
                 {$cart_rule.value}
diff --git a/templates/customer/history.tpl b/templates/customer/history.tpl
index c0f2fdd7..10b06cff 100644
--- a/templates/customer/history.tpl
+++ b/templates/customer/history.tpl
@@ -52,7 +52,7 @@
                 {$order.details.order_date}
               </span>
             </td>
-            <td class="text-xs-right align-middle">
+            <td class="text-end align-middle">
               <span class="text-primary font-weight-bold text-lowercase">
                 {$order.totals.total.value}
               </span>
diff --git a/templates/customer/order-detail.tpl b/templates/customer/order-detail.tpl
index 251f3b8b..a1035020 100644
--- a/templates/customer/order-detail.tpl
+++ b/templates/customer/order-detail.tpl
@@ -65,7 +65,7 @@
       </ul>
 
       {if $order.details.reorder_url}
-        <div class="mt-2 text-right">
+        <div class="mt-2 text-end">
           <a href="{$order.details.reorder_url}" class="btn btn-outline-primary">{l s='Reorder' d='Shop.Theme.Actions'}</a>
         </div>
       {/if}
diff --git a/templates/customer/order-follow.tpl b/templates/customer/order-follow.tpl
index 172adfc3..d04a6749 100644
--- a/templates/customer/order-follow.tpl
+++ b/templates/customer/order-follow.tpl
@@ -57,7 +57,7 @@
             <td class="text-sm-center align-middle">
               {if $return.print_url}
                 <a href="{$return.print_url}" class="btn btn-primary btn-sm">
-                  <span class="material-icons btn-icon ml-1">file_download</span>
+                  <span class="material-icons btn-icon ms-1">file_download</span>
                   {l s='Print out' d='Shop.Theme.Actions'}
                 </a>
               {else}
diff --git a/templates/customer/order-slip.tpl b/templates/customer/order-slip.tpl
index 55dfa974..03c495c5 100644
--- a/templates/customer/order-slip.tpl
+++ b/templates/customer/order-slip.tpl
@@ -49,7 +49,7 @@
             <td class="align-middle">{$slip.credit_slip_date}</td>
             <td class="align-middle text-sm-center">
               <a href="{$slip.url}" class="btn btn-primary btn-sm">
-                <span class="material-icons btn-icon ml-1">file_download</span>
+                <span class="material-icons btn-icon ms-1">file_download</span>
                 {l s='Download' d='Shop.Theme.Catalog'}
               </a>
             </td>
@@ -79,7 +79,7 @@
           </div>
           <div class="card-footer">
             <a href="{$slip.url}" class="btn btn-primary btn-sm btn-block">
-              <span class="material-icons btn-icon ml-1">file_download</span>
+              <span class="material-icons btn-icon ms-1">file_download</span>
               {l s='View credit slip' d='Shop.Theme.Customeraccount'}
             </a>
           </div>
diff --git a/templates/customer/page.tpl b/templates/customer/page.tpl
index b5f433a6..38c5a60b 100644
--- a/templates/customer/page.tpl
+++ b/templates/customer/page.tpl
@@ -39,7 +39,7 @@
     <div class="col-lg-3 col-12">
      {include file='customer/customer-links.tpl'}
     </div>
-    <div class="pl-lg-5 col-lg-9 col-12">
+    <div class="ps-lg-5 col-lg-9 col-12">
       <section id="content" class="{block name='pageContentClass'}page-content {/block}page-content--{$page.page_name}">
         {$smarty.capture.acc_title nofilter}