[SSE] Fix styles for protected ranges

ONLYOFFICE · Feb 21, 2024 · 814e20a · 814e20a
1 parent b660d90
commit 814e20a
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 20 deletions.
diff --git a/apps/spreadsheeteditor/main/app/view/ProtectedRangesEditDlg.js b/apps/spreadsheeteditor/main/app/view/ProtectedRangesEditDlg.js
@@ -461,16 +461,14 @@ define([
             if (rec && !rec.get('isCurrent')) {
                 this.listUser.store.remove(rec);
             }
+            var me = this;
+            setTimeout(function() {
+                me.listUser.focus();
+            }, 1);
         },
 
         onListUserClick: function(list, item, record, e) {
-            if (e) {
-                var btn = $(e.target);
-                if (btn && btn.hasClass('listitem-icon')) {
-                    this.onDeleteUser(record);
-                    return;
-                }
-            }
+
         },
 
         addControls: function(listView, itemView, item) {
@@ -527,6 +525,10 @@ define([
 
         onHideMenu: function() {
             this.listUser.enableKeyEvents = true;
+            var me = this;
+            setTimeout(function() {
+                me.listUser.focus();
+            }, 1);
         },
 
         txtProtect: 'Protect',

diff --git a/apps/spreadsheeteditor/main/resources/less/advanced-settings.less b/apps/spreadsheeteditor/main/resources/less/advanced-settings.less
@@ -528,18 +528,13 @@
             position: absolute;
             width: 20px;
             height: 20px;
-            right: 12px;
+            right: 16px;
             top: 4px;
             .rtl & {
                 right: auto;
-                left: 12px;
+                left: 16px;
             }
         }
-        //&:hover {
-        //    .listitem-icon {
-        //        display: block;
-        //    }
-        //}
         .color {
             display: inline-block;
             width: 26px;
@@ -556,12 +551,34 @@
             color: #ffffff;
             font-weight: 700;
         }
-        //&.selected {
-        //    .listitem-icon {
-        //        background-position-x: -20px;
-        //        background-position-x: @button-small-active-icon-offset-x;
-        //    }
-        //}
+        .listitem-icon .btn-toolbar {
+            background-color: transparent !important;
+            box-shadow: none;
+        }
+        &.selected {
+            .listitem-icon {
+                .btn-toolbar .icon{
+                    background-position-x: -20px;
+                    background-position-x: @button-small-active-icon-offset-x !important;
+                }
+                .caret {
+                    border-color: @icon-normal-pressed-ie;
+                    border-color: @icon-normal-pressed;
+                }
+            }
+        }
+        &:not(.selected) {
+            .listitem-icon {
+                .btn-toolbar .icon{
+                    background-position-x: 0;
+                    background-position-x: @button-small-normal-icon-offset-x !important;
+                }
+                .caret {
+                    border-color: @icon-normal-ie;
+                    border-color: @icon-normal;
+                }
+            }
+        }
     }
 }