From 899c9dcb747da1dbef7f5d87994822b19ee9cd43 Mon Sep 17 00:00:00 2001
From: Yuri Kuznetsov <yurikuzn@users.noreply.github.com>
Date: Wed, 3 Aug 2022 11:00:30 +0300
Subject: [PATCH] focus color

---
 client/src/views/fields/wysiwyg.js               | 10 ++++++++--
 frontend/less/espo/custom.less                   |  4 ----
 frontend/less/espo/elements/form.less            | 16 ++++++++++++++++
 .../misc/selectize/selectize.bootstrap3.less     |  6 +++---
 4 files changed, 27 insertions(+), 9 deletions(-)

diff --git a/client/src/views/fields/wysiwyg.js b/client/src/views/fields/wysiwyg.js
index f015bebeb3..b85b115b9d 100644
--- a/client/src/views/fields/wysiwyg.js
+++ b/client/src/views/fields/wysiwyg.js
@@ -151,6 +151,12 @@ define('views/fields/wysiwyg', ['views/fields/text', 'lib!Summernote'], function
             'click .note-editable': function () {
                 this.fixPopovers();
             },
+            'focus .note-editable': function () {
+                this.$noteEditor.addClass('in-focus');
+            },
+            'blur .note-editable': function () {
+                this.$noteEditor.removeClass('in-focus');
+            },
         },
 
         setupToolbar: function () {
@@ -224,7 +230,6 @@ define('views/fields/wysiwyg', ['views/fields/text', 'lib!Summernote'], function
             return value || '';
         },
 
-
         sanitizeHtmlLight: function (value) {
            return this.getHelper().moderateSanitizeHtml(value);
         },
@@ -244,7 +249,6 @@ define('views/fields/wysiwyg', ['views/fields/text', 'lib!Summernote'], function
 
             if (this.isEditMode()) {
                 this.$summernote = this.$el.find('.summernote');
-                this.$noteEditor = this.$el.find('> .note-editor');
             }
 
             var language = this.getConfig().get('language');
@@ -260,6 +264,8 @@ define('views/fields/wysiwyg', ['views/fields/text', 'lib!Summernote'], function
                 else {
                     this.$element.removeClass('hidden');
                 }
+
+                this.$noteEditor = this.$el.find('> .note-editor');
             }
 
             if (this.isReadMode()) {
diff --git a/frontend/less/espo/custom.less b/frontend/less/espo/custom.less
index 187a531780..d2d36409db 100644
--- a/frontend/less/espo/custom.less
+++ b/frontend/less/espo/custom.less
@@ -1649,10 +1649,6 @@ table.less-padding td.cell[data-name="buttons"] > .btn-group {
 }
 
 .panel.note-editor {
-    border: var(--input-border-width) solid var(--input-border);
-    border-width: var(--input-border-width);
-    border-radius: var(--border-radius);
-
     .note-toolbar {
         border-bottom: 0 !important;
         background-color: transparent;
diff --git a/frontend/less/espo/elements/form.less b/frontend/less/espo/elements/form.less
index 61ca29b3b5..91c68a75ce 100644
--- a/frontend/less/espo/elements/form.less
+++ b/frontend/less/espo/elements/form.less
@@ -20,6 +20,8 @@
     border-radius: var(--border-radius);
     box-shadow: var(--input-box-shadow);
 
+    .form-control-focus-espo();
+
     &.dropdown-active {
         border-color: var(--input-border-focus-rgba);
         border-radius: var(--border-radius);
@@ -28,6 +30,20 @@
     .transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s");
 }
 
+.note-editor.note-frame {
+    border: var(--input-border-width) solid var(--input-border);
+    border-width: var(--input-border-width);
+    border-radius: var(--border-radius);
+
+    &.in-focus {
+        border-color: var(--input-border-focus-rgba);
+        outline: 0;
+        .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px var(--input-border-focus-rgba)");
+    }
+
+    .transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s");
+}
+
 .input-group > .input-group-btn:not(:first-child) > .btn:first-child {
     border-top-left-radius: 0 !important;
     border-bottom-left-radius: 0 !important;
diff --git a/frontend/less/espo/misc/selectize/selectize.bootstrap3.less b/frontend/less/espo/misc/selectize/selectize.bootstrap3.less
index d7db2c9dcc..673b9e4586 100644
--- a/frontend/less/espo/misc/selectize/selectize.bootstrap3.less
+++ b/frontend/less/espo/misc/selectize/selectize.bootstrap3.less
@@ -117,10 +117,10 @@
 		display: none;
 	}
 	&.focus {
-		@color: @input-border-focus;
+		//@color: @input-border-focus;
 		@color-rgba: var(--input-border-focus-rgba);
-		border-color: @color;
-		outline: 0;
+		//border-color: @color;
+		//outline: 0;
 		.selectize-box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
 	}
 }