[stylesheets] repaired stylesheets

apps/common/main/lib/component/Button.js

@@ -211,7 +211,7 @@ define([
                 '</div>' +
                 '<div class="inner-box-caption">' +
                     '<span class="caption"><%= caption %></span>' +
-                    '<i class="caret img-commonctrl"></i>' +
+                    '<i class="caret"></i>' +
                 '</div>' +
             '</button>' +
         '</div>';
@@ -226,7 +226,7 @@ define([
             '<button type="button" class="btn <%= cls %> inner-box-caption dropdown-toggle" data-toggle="dropdown">' +
                 '<span class="btn-fixflex-vcenter">' +
                     '<span class="caption"><%= caption %></span>' +
-                    '<i class="caret img-commonctrl"></i>' +
+                    '<i class="caret"></i>' +
                 '</span>' +
             '</button>' +
         '</div>';
@@ -271,7 +271,7 @@ define([
                         '<% applyicon() %>',
                         '<span class="caption"><%= caption %></span>',
                         '<span class="inner-box-caret">' +
-                            '<i class="caret img-commonctrl"></i>' +
+                            '<i class="caret"></i>' +
                         '</span>',
                     '</button>',
                 '</div>',
@@ -282,7 +282,7 @@ define([
                         '<span class="caption"><%= caption %></span>',
                     '</button>',
                     '<button type="button" class="btn <%= cls %> dropdown-toggle" data-toggle="dropdown">',
-                        '<i class="caret img-commonctrl"></i>',
+                        '<i class="caret"></i>',
                         '<span class="sr-only"></span>',
                     '</button>',
                 '</div>',

apps/common/main/lib/component/ColorButton.js

@@ -50,7 +50,9 @@ define([
             '<div class="btn-group" id="<%= id %>">',
                 '<button type="button" class="btn btn-color dropdown-toggle <%= cls %>" data-toggle="dropdown" style="<%= style %>">',
                     '<span>&nbsp;</span>',
-                    '<span class="inner-box-caret"><i class="caret img-commonctrl"></i></span>',
+                    '<span class="inner-box-caret">',
+                        '<i class="caret"></i>',
+                    '</span>',
                 '</button>',
             '</div>'
         ].join('')),

apps/common/main/lib/component/ComboBox.js

@@ -93,7 +93,9 @@ define([
             template: _.template([
                 '<span class="input-group combobox <%= cls %>" id="<%= id %>" style="<%= style %>">',
                     '<input type="text" class="form-control" spellcheck="false">',
-                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
+                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">',
+                        '<span class="caret"></span>',
+                    '</button>',
                     '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
                         '<% _.each(items, function(item) { %>',
                             '<li id="<%= item.id %>" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',

apps/common/main/lib/component/ComboBoxFonts.js

@@ -72,7 +72,7 @@ define([
                 '<div class="input-group combobox fonts <%= cls %>" id="<%= id %>" style="<%= style %>">',
                     '<input type="text" class="form-control" spellcheck="false"> ',
                     '<div style="display: table-cell;"></div>',
-                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret img-commonctrl"></span></button>',
+                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>',
                     '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
                         '<li class="divider">',
                     '<% _.each(items, function(item) { %>',

apps/common/main/resources/less/asc-mixins.less

@@ -207,6 +207,7 @@
 {
     background-image: if(@icon-src-base64, data-uri(%("%s",'@{common-image-path}/@{common-controls}')), ~"url(@{common-image-const-path}/@{common-controls})");
     background-repeat: no-repeat;
+    filter: @component-normal-icon-filer;
 
     @1d5ximage: replace(@common-controls, '\.png$', '@1.5x.png');
     @2ximage: replace(@common-controls, '\.png$', '@2x.png');

apps/common/main/resources/less/buttons.less

@@ -564,7 +564,7 @@
 
     .inner-box-caret {
         position: absolute;
-        right: 0;
+        right: 1px;
         top: 2px;
     }
 
@@ -594,7 +594,6 @@
     &:active:not(.disabled),
     &.active:not(.disabled) {
         .caret {
-            background-position: @arrow-small-offset-x @arrow-small-offset-y;
         }
     }
 }

apps/common/main/resources/less/colors-table-dark.less

@@ -74,5 +74,6 @@
         --modal-window-mask-opacity: 0.6;
         --image-border-types-filter: invert(100%) brightness(4);
         --image-border-types-filter-selected: invert(100%) brightness(4);
+        --component-normal-icon-filter: invert(100%);
     }
 }

apps/common/main/resources/less/colors-table.less

@@ -85,6 +85,7 @@
     --modal-window-mask-opacity: 0.2;
     --image-border-types-filter: none;
     --image-border-types-filter-selected: none;
+    --component-normal-icon-filter: none;
 }
 
 // Background
@@ -149,3 +150,5 @@
 
 @button-header-normal-icon-offset-x: var(--button-header-normal-icon-offset-x, -20px);
 @button-header-active-icon-offset-x: var(--button-header-active-icon-offset-x, -20px);
+
+@component-normal-icon-filer: var(--component-normal-icon-filter);

apps/common/main/resources/less/combobox.less

@@ -52,6 +52,7 @@
     &.open .dropdown-toggle.btn-default {
         background-color: @background-normal;
         border-color: @border-regular-control;
+        padding-right: 4px;
     }
 
     .btn-default.disabled:hover {

apps/common/main/resources/less/dropdown-menu.less

@@ -40,16 +40,25 @@
             }
 
             &.focus {
-                text-decoration: none;
+                //text-decoration: none;
-                color: @dropdown-link-hover-color;
+                //color: @dropdown-link-hover-color;
-                background-color: @dropdown-link-hover-bg;
+                //background-color: @dropdown-link-hover-bg;
+            }
+
+            &:hover {
+                color: @text-normal-pressed;
+                background-color: @highlight-button-hover;
             }
         }
 
         &.over > a {
             text-decoration: none;
-            color: @dropdown-link-hover-color;
+            color: @text-normal-pressed;
-            background-color: @dropdown-link-hover-bg;
+            background-color: @highlight-button-hover;
+
+            &:after {
+                border-left-color: @icon-normal-pressed;
+            }
         }
 
         .checked:not(.no-checkmark) {

apps/common/main/resources/less/dropdown-submenu.less

@@ -23,7 +23,7 @@
         border-color: transparent;
         border-style: solid;
         border-width: 3px 0 3px 3px;
-        border-left-color: @dropdown-link-color;
+        border-left-color: @icon-normal;
         margin-top: 5px;
         margin-right: -10px;
     }

apps/common/main/resources/less/language-dialog.less

@@ -12,7 +12,7 @@ li {
 
   &.selected, a.checked {
     .icon.spellcheck-lang {
-      background-position-x: -20px; --bgX: -20px;
+        background-position-x: @button-small-active-icon-offset-x;
     }
   }
 }
@@ -26,7 +26,7 @@ li {
       background-color: @highlight-button-pressed;
 
       &, &:hover, &:focus {
-        color: @dropdown-link-active-color;
+        color: @text-normal-pressed;
       }
     }
   }

apps/documenteditor/main/resources/less/rightmenu.less

@@ -78,7 +78,7 @@
         width: 100%;
         resize: none;
         margin-bottom: 5px;
-        border: 1px solid @border-toolbar;
+        //border: 1px solid @border-toolbar;
         height: 100%;
 
         &.disabled {

apps/presentationeditor/main/resources/less/rightmenu.less

@@ -70,7 +70,7 @@
         width: 100%;
         resize: none;
         margin-bottom: 5px;
-        border: 1px solid @border-toolbar;
+        //border: 1px solid @border-toolbar;
         height: 100%;
 
         &.disabled {

apps/spreadsheeteditor/main/resources/less/rightmenu.less

@@ -70,7 +70,7 @@
         width: 100%;
         resize: none;
         margin-bottom: 5px;
-        border: 1px solid @border-toolbar;
+        //border: 1px solid @border-toolbar;
         height: 100%;
 
         &.disabled {