Merge pull request #1232 from ONLYOFFICE/feature/Fix-red-mark

Fix red mark

apps/common/main/lib/view/Plugins.js

@@ -62,7 +62,7 @@ define([
             '<div id="current-plugin-box" class="layout-ct vbox hidden">',
                 '<div id="current-plugin-header">',
                     '<label></label>',
-                    '<div id="id-plugin-close" class="plugin-close img-commonctrl"></div>',
+                    '<div id="id-plugin-close" class="tool close"></div>',
                 '</div>',
                 '<div id="current-plugin-frame" class="">',
                 '</div>',

apps/common/main/resources/less/plugins.less

@@ -11,6 +11,7 @@
         font-weight: bold;
         margin-top: 10px;
         margin-left: 12px;
+
     }
 
     #plugins-list {
@@ -97,16 +98,16 @@
         }
     }
 
-    .plugin-close {
+    .tool {
         position: absolute;
         top: 9px;
         right: 7px;
-        width: 16px;
+        margin: 0;
-        height: 16px;
+        /*&:before, &:after {
-        background-position: -26px -150px;
+            width: 2px;
-        cursor: pointer;
+            width: @scaled-two-px-value;
+        }*/
     }
-
     #current-plugin-frame {
         width: 100%;
         height: 100%;

apps/common/main/resources/less/window.less

@@ -22,6 +22,50 @@
         opacity: 0.6;
     }
 }
+.tool {
+    float: right;
+    width: 16px;
+    height: 16px;
+    cursor: pointer;
+    overflow: hidden;
+    padding: 0px;
+    margin: 4px 3px 0px 0px;
+
+    &.close {
+        position: relative;
+        opacity: 0.7;
+
+        &:hover {
+            opacity: 1;
+        }
+
+        &.disabled {
+            cursor: default;
+        }
+
+        &:before, &:after {
+            content: ' ';
+            position: absolute;
+            left: 7px;
+            left: calc(7px / @pixel-ratio-factor);
+            top: @scaled-one-px-value-ie;
+            top: @scaled-one-px-value;
+            height: 14px;
+            width: @scaled-one-px-value-ie;
+            width: @scaled-one-px-value;
+            background-color: @icon-normal-ie;
+            background-color: @icon-normal;
+        }
+
+        &:before {
+            transform: rotate(45deg);
+        }
+
+        &:after {
+            transform: rotate(-45deg);
+        }
+    }
+}
 
 .asc-window {
     min-height: 50px;
@@ -73,51 +117,7 @@
             padding-right: 6px;
         }
 
-        .tool {
+        .tool.help {
-            float: right;
-            width: 16px;
-            height: 16px;
-            cursor: pointer;
-            overflow: hidden;
-            padding: 0px;
-            margin: 4px 3px 0px 0px;
-
-            &.close {
-                position: relative;
-                opacity: 0.7;
-
-                &:hover {
-                    opacity: 1;
-                }
-
-                &.disabled {
-                    cursor: default;
-                }
-
-                &:before, &:after {
-                    content: ' ';
-                    position: absolute;
-                    left: 7px;
-                    left: calc(7px/@pixel-ratio-factor);
-                    top: @scaled-one-px-value-ie;
-                    top: @scaled-one-px-value;
-                    height: 14px;
-                    width: @scaled-one-px-value-ie;
-                    width: @scaled-one-px-value;
-                    background-color: @icon-normal-ie;
-                    background-color: @icon-normal;
-                }
-
-                &:before {
-                    transform: rotate(45deg);
-                }
-
-                &:after {
-                    transform: rotate(-45deg);
-                }
-            }
-
-            &.help {
             width: 20px;
             margin-right:0;
             line-height: 14px;
@@ -136,7 +136,7 @@
                 cursor: default;
             }
         }
-        }
+
 
         &.resizing {
             cursor: inherit !important;