From 9cb44622a5437e8980b36c78f905d573bfc47624 Mon Sep 17 00:00:00 2001
From: Yuri Kuznetsov <yurikuzn@users.noreply.github.com>
Date: Tue, 7 Nov 2023 15:27:18 +0200
Subject: [PATCH] btn change

---
 client/res/templates/header.tpl          |  2 ++
 client/src/view-helper.js                |  4 ++--
 client/src/views/modal.js                |  2 +-
 frontend/less/espo/custom.less           | 13 +++----------
 frontend/less/espo/elements/buttons.less |  9 +++++++++
 5 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/client/res/templates/header.tpl b/client/res/templates/header.tpl
index 874dcb9be0..9e2d3b136f 100644
--- a/client/res/templates/header.tpl
+++ b/client/res/templates/header.tpl
@@ -21,7 +21,9 @@
                         <span class="{{iconClass}}"></span>
                     {{/if}}
                 {{/if}}
+                <span>
                 {{#if html}}{{{html}}}{{else}}{{#if text}}{{text}}{{else}}{{translate label scope=../scope}}{{/if}}{{/if}}
+                </span>
                 </a>
             {{/each}}
 
diff --git a/client/src/view-helper.js b/client/src/view-helper.js
index 5a58a421dd..2d705fd9b3 100644
--- a/client/src/view-helper.js
+++ b/client/src/view-helper.js
@@ -450,12 +450,12 @@ class ViewHelper {
             }
 
             if (iconHtml) {
-                html = iconHtml + ' ' + html;
+                html = iconHtml + ' ' + '<span>' + html + '</span>';
             }
             else if (iconClass) {
                 const iconHtml = $('<span>').addClass(iconClass).get(0).outerHTML;
 
-                html = iconHtml + ' ' + html;
+                html = iconHtml + ' ' + '<span>' + html + '</span>';
             }
 
             const tag = link ? '<a>' : '<button>';
diff --git a/client/src/views/modal.js b/client/src/views/modal.js
index fd2c970d15..448ea5a545 100644
--- a/client/src/views/modal.js
+++ b/client/src/views/modal.js
@@ -466,7 +466,7 @@ class ModalView extends View {
             }
 
             if (o.iconHtml && !o.html) {
-                o.html = o.iconHtml + ' ' + this.getHelper().escapeString(o.text);
+                o.html = o.iconHtml + ' <span>' + this.getHelper().escapeString(o.text) + '</span>';
             }
 
             o.onClick = o.onClick || ((d, e) => {
diff --git a/frontend/less/espo/custom.less b/frontend/less/espo/custom.less
index 267c8e7e60..6ded648fe3 100644
--- a/frontend/less/espo/custom.less
+++ b/frontend/less/espo/custom.less
@@ -3214,20 +3214,13 @@ a.field-info > span.fa-info-circle {
 .btn-default > .fa-sm.fa-rss {
     position: relative;
     top: -1px;
-    padding-right: 3px;
+    padding-right: 1px;
 }
 
-.header-buttons > .btn {
-    > .fas,
-    > .far {
-        padding-right: 2px;
-    }
-}
-
-.header-buttons > .btn > .fa-plus.fa-sm {
+.btn:not(.btn-icon) > .fa-plus.fa-sm:first-child {
     position: relative;
     top: -1px;
-    padding-right: 3px;
+    padding-right: 1px;
 }
 
 .transform-flip,
diff --git a/frontend/less/espo/elements/buttons.less b/frontend/less/espo/elements/buttons.less
index 25f3e6c02d..c6c009869f 100644
--- a/frontend/less/espo/elements/buttons.less
+++ b/frontend/less/espo/elements/buttons.less
@@ -244,6 +244,15 @@ a.btn {
     }
 }
 
+.btn:not(.btn-icon) {
+    > .fas,
+    > .far {
+        &:first-child + span {
+            padding-left: 2px;
+        }
+    }
+}
+
 .btn-text {
     color: var(--btn-text-color);
     //border-radius: 0;