From a2c13377ed9642c4418100e1a2364f80b4f318ba Mon Sep 17 00:00:00 2001
From: Pedro Amorim <pedro.amorim@openfifth.co.uk>
Date: Mon, 12 Jan 2026 12:42:55 -0100
Subject: [PATCH] Bug 37762: VueJS framework: Toolbarbutton spacing to consider
 different css classes

There's no spacing currently, but it's not obvious as the current style
has the same background color as the body.
This adds spacing so even if some buttons have different colors (e.g.
primary or danger) all buttons are spaced correctly.

Signed-off-by: Jason Robb <jrobb@sekls.org>
Signed-off-by: Lisette Scheer <lisette@bywatersolutions.com>
Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
---
 .../prog/js/vue/components/ToolbarButton.vue          | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ToolbarButton.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ToolbarButton.vue
index ee4cca7409..82b04730fd 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ToolbarButton.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ToolbarButton.vue
@@ -1,6 +1,8 @@
 <template>
-    <ButtonSubmit v-if="action === 'submit'" v-bind="$props" />
-    <Link v-else v-bind="$props" />
+    <div class="toolbar-button-wrapper">
+        <ButtonSubmit v-if="action === 'submit'" v-bind="$props" />
+        <Link v-else v-bind="$props" />
+    </div>
 </template>
 
 <script>
@@ -39,3 +41,8 @@ export default {
     name: "Toolbar",
 };
 </script>
+<style scoped>
+.toolbar-button-wrapper {
+    margin-right: 5px;
+}
+</style>