From 8579ecce3647a194897d3a4be61bc553229cc654 Mon Sep 17 00:00:00 2001
From: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Date: Mon, 16 Sep 2024 17:18:21 +0100
Subject: [PATCH] Bug 10190: Update for bootstrap 5

---
 .../CirculationTriggersFormAdd.vue            | 17 +++++++----------
 .../CirculationTriggersList.vue               | 19 +++++++++++++------
 .../Admin/CirculationTriggers/Main.vue        |  4 ++--
 3 files changed, 22 insertions(+), 18 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormAdd.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormAdd.vue
index 998d3dcd8dd..02d87716d59 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormAdd.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormAdd.vue
@@ -1,7 +1,4 @@
 <template>
-    <router-link :to="{ name: 'CirculationTriggersList' }" class="close_modal">
-        <i class="fa fa-fw fa-close"></i>
-    </router-link>
     <div v-if="initialized" class="modal-content">
         <form @submit="addCircRule($event)">
             <div class="modal-header">
@@ -11,6 +8,13 @@
                 <h1 class="modal-title" v-else>
                     {{ $__("Edit circulation trigger") }}
                 </h1>
+                <router-link
+                    class="btn-close"
+                    type="button"
+                    :to="{
+                        name: 'CirculationTriggersList',
+                    }"
+                ></router-link>
             </div>
             <div class="modal-body">
                 <div class="page-section bg-info" v-if="circRules.length">
@@ -750,13 +754,6 @@ export default {
 </script>
 
 <style scoped>
-.close_modal {
-    position: absolute;
-    top: 0.5rem;
-    right: 0.5rem;
-    font-size: 2rem;
-}
-
 form li {
     display: flex;
     align-items: center;
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersList.vue
index ac339cfe939..cdc2c5a4f2a 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersList.vue
@@ -65,15 +65,17 @@
             <ul class="nav nav-tabs" role="tablist">
                 <li
                     v-for="(number, i) in numberOfTabs"
+                    class="nav-item"
                     role="presentation"
-                    v-bind:class="
-                        tabSelected === `Notice ${number}` ? 'active' : ''
-                    "
                     :key="`noticeTab${i}`"
                 >
                     <a
                         href="#"
+                        class="nav-link"
                         role="tab"
+                        v-bind:class="
+                            tabSelected === `Notice ${number}` ? 'active' : ''
+                        "
                         @click="changeTabContent"
                         :data-content="`Notice ${number}`"
                         >{{ $__("Trigger") + " " + number }}</a
@@ -81,9 +83,14 @@
                 </li>
             </ul>
         </div>
-        <div class="tab_content">
+        <div class="tab-content">
             <template v-for="(number, i) in numberOfTabs">
                 <div
+                    class="tab-pane"
+                    role="tabpanel"
+                    v-bind:class="
+                        tabSelected === `Notice ${number}` ? 'show active' : ''
+                    "
                     v-if="tabSelected === `Notice ${number}`"
                     :key="`noticeTabContent${i}`"
                 >
@@ -98,7 +105,7 @@
             </template>
         </div>
     </div>
-    <div v-if="showModal" class="modal_centered">
+    <div v-if="showModal" class="modal" role="dialog">
         <div
             class="modal-dialog modal-dialog-centered modal-lg"
             role="document"
@@ -244,7 +251,7 @@ export default {
     margin-bottom: 0;
 }
 
-.modal_centered {
+.modal {
     position: fixed;
     z-index: 9998;
     display: table;
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/Main.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/Main.vue
index 2010cedbc62..00cdcde95af 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/Main.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/Main.vue
@@ -6,14 +6,14 @@
         </div>
         <div class="main container-fluid">
             <div class="row">
-                <div class="col-sm-10 col-sm-push-2">
+                <div class="col-md-10 order-md-2 order-sm-1">
                     <main>
                         <Dialog />
                         <router-view />
                     </main>
                 </div>
 
-                <div class="col-sm-2 col-sm-pull-10"></div>
+                <div class="col-md-2 order-sm-2 order-md-1"></div>
             </div>
         </div>
     </div>
-- 
2.47.0