From 055e9587e34552960ec4f0950a7a1a03d0c6fdd2 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Wed, 19 Oct 2022 15:36:37 +0000
Subject: [PATCH] Bug 31861: Table controls on checkouts table are buttons

This patch updates the style of DataTables buttons (columns, export, and
configure), in cases where the buttons are the only control being
displayed (no page controls, filter, etc).

To test, apply the patch and rebuild the staff interface CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

- Go to Circulation and check an item out to a patron.
- If necessary, click the "Show checkouts" button to reveal the table of
  checkouts.
- The "Columns," "Export," and "Configure" controls should look the same
  as they do in other situations, with no button-style border.
- Go to Circulation -> Check in and check in the item. The table of
  checked-in items should show the same style controls.

Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
---
 .../intranet-tmpl/prog/css/src/_tables.scss   | 102 +++++++++---------
 .../prog/en/modules/circ/returns.tt           |   2 +-
 koha-tmpl/intranet-tmpl/prog/js/checkouts.js  |   4 +-
 3 files changed, 55 insertions(+), 53 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/_tables.scss b/koha-tmpl/intranet-tmpl/prog/css/src/_tables.scss
index 6bbb978496..c630cd1e57 100644
--- a/koha-tmpl/intranet-tmpl/prog/css/src/_tables.scss
+++ b/koha-tmpl/intranet-tmpl/prog/css/src/_tables.scss
@@ -548,72 +548,73 @@ tbody {
         }
     }
 
-    button,
-    div,
-    a {
-        &.dt-button {
-            background: transparent none;
-            border: 0;
-            color: #000;
-            font-size: 1em;
-            line-height: 1.7em;
-            margin: 3px 3px 0;
-            padding: 0 .5em;
-
-            &::before {
-                content: "";
-            }
+    input {
+        &[type="search"] {
+            border: 1px solid #CCC;
+        }
+    }
 
-            &.disabled {
-                color: #999;
-                cursor: default;
+    &:empty {
+        border: 0;
+        padding: 0;
+    }
+} /* /.pager */
 
-                a,
-                span {
-                    background: transparent none;
-                }
-            }
+button,
+div,
+a {
+    &.dt-button {
+        background: transparent none;
+        border: 0;
+        color: #000;
+        font-size: 1em;
+        line-height: 1.7em;
+        margin: 3px 3px 0;
+        padding: 0 .5em;
 
-            &:active,
-            &:focus {
-                background: transparent none;
-                border: 0;
-                box-shadow: none;
-                text-shadow: none;
+        &::before {
+            content: "";
+        }
 
-                &:not( .disabled ):hover:not( .disabled ) {
-                    background: transparent none;
-                    box-shadow: none;
-                }
-            }
+        &.disabled {
+            color: #999;
+            cursor: default;
 
-            &:hover {
+            a,
+            span {
                 background: transparent none;
-                border: 0;
-
-                &:not( .disabled ) {
-                    background: transparent none;
-                }
             }
+        }
+
+        &:active,
+        &:focus {
+            background: transparent none;
+            border: 0;
+            box-shadow: none;
+            text-shadow: none;
 
-            &.active:not( .disabled ):hover:not( .disabled ) {
+            &:not( .disabled ):hover:not( .disabled ) {
                 background: transparent none;
                 box-shadow: none;
             }
         }
-    }
 
-    input {
-        &[type="search"] {
-            border: 1px solid #CCC;
+        &:hover {
+            background: transparent none;
+            border: 0;
+
+            &:not( .disabled ) {
+                background: transparent none;
+                border: 0;
+            }
         }
-    }
 
-    &:empty {
-        border: 0;
-        padding: 0;
+        &.active:not( .disabled ):hover:not( .disabled ) {
+            background: transparent none;
+            box-shadow: none;
+        }
     }
-} /* /.pager */
+}
 
 .toptabs {
     .pager {
@@ -781,6 +782,7 @@ div {
     border-top: 1px solid #EEE;
     display: flex;
     flex-grow: 1;
+    justify-content: flex-end;
     margin-top: .5em;
     padding-top: .5em;
 }
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt
index 744b440823..6065db78b7 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt
@@ -1417,7 +1417,7 @@
                     "bPaginate":false,
                     "bInfo":false,
                     "bSort":false,
-                    "dom": 'B<"clearfix">t',
+                    "dom": '<"table_controls"B>rt',
                     }, table_settings);
 
             $("#exemptcheck").change(function () {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/checkouts.js b/koha-tmpl/intranet-tmpl/prog/js/checkouts.js
index 60afab6d2b..50349e3b9d 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/checkouts.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/checkouts.js
@@ -276,7 +276,7 @@ $(document).ready(function() {
                 "sProcessing": msg_loading,
             },
             "bAutoWidth": false,
-            "dom": 'B<"clearfix">rt',
+            "dom": '<"table_controls"B>rt',
             "aoColumns": [
                 {
                     "mDataProp": function( oObj ) {
@@ -708,7 +708,7 @@ $(document).ready(function() {
         if ( ! relativesIssuesTable ) {
             relativesIssuesTable = KohaTable("relatives-issues-table", {
                 "bAutoWidth": false,
-                "dom": 'B<"clearfix">rt',
+                "dom": '<"table_controls"B>rt',
                 "aaSorting": [],
                 "aoColumns": [
                     {
-- 
2.39.5