From a79b404c37cf17b4550f7a4564634031d97df718 Mon Sep 17 00:00:00 2001 From: Maxim Kadushkin Date: Mon, 21 Oct 2019 17:05:50 +0300 Subject: [PATCH] [all] doesn't inject images in css --- apps/common/main/resources/less/about.less | 14 +- .../main/resources/less/asc-mixins.less | 127 +++++++++++++----- apps/common/main/resources/less/buttons.less | 4 +- .../main/resources/less/dropdown-menu.less | 2 +- apps/common/main/resources/less/plugins.less | 2 +- apps/common/main/resources/less/scroller.less | 13 +- apps/common/main/resources/less/toolbar.less | 9 +- .../resources/less/advanced-settings.less | 6 +- .../main/resources/less/filemenu.less | 3 +- .../main/resources/less/rightmenu.less | 16 ++- .../main/resources/less/toolbar.less | 9 +- .../main/resources/less/leftmenu.less | 3 +- .../main/resources/less/rightmenu.less | 2 +- .../main/resources/less/toolbar.less | 4 +- .../main/resources/less/leftmenu.less | 3 +- .../main/resources/less/rightmenu.less | 2 +- .../main/resources/less/toolbar.less | 4 +- 17 files changed, 146 insertions(+), 77 deletions(-) diff --git a/apps/common/main/resources/less/about.less b/apps/common/main/resources/less/about.less index b1b2d6ed9..fd7e1ab7d 100644 --- a/apps/common/main/resources/less/about.less +++ b/apps/common/main/resources/less/about.less @@ -4,13 +4,15 @@ margin-bottom: 5px; &:before { - content: data-uri('@{common-image-path}/about/logo.png'); + content: if(@icon-src-base64, data-uri(%("%s",'@{common-image-path}/about/logo.png')), ~"url('@{common-image-const-path}/about/logo.png')"); - @media - only screen and (-webkit-min-device-pixel-ratio: 2), - only screen and (min-resolution: 2dppx), - only screen and (min-resolution: 192dpi) { - content: data-uri('@{common-image-path}/about/logo@2x.png'); + @media only screen { + @media (-webkit-min-device-pixel-ratio: 2), + (min-resolution: 2dppx), + (min-resolution: 192dpi) + { + content: ~"url('@{common-image-const-path}/about/logo@2x.png')"; + } } } } diff --git a/apps/common/main/resources/less/asc-mixins.less b/apps/common/main/resources/less/asc-mixins.less index fe5257b7a..d0c948a50 100644 --- a/apps/common/main/resources/less/asc-mixins.less +++ b/apps/common/main/resources/less/asc-mixins.less @@ -149,8 +149,18 @@ } } -.background-ximage-v2(@image, @w: auto, @h: auto, @repeat: no-repeat, @usedatauri: true) { - background-image: if(@usedatauri, data-uri(%("%s",@image)), ~"url(@{image})"); +.choose-image-path(@fromcommon) when (@fromcommon = false) { + @path: if(@icon-src-base64, @app-image-path, @app-image-const-path); +}; + +.choose-image-path(@fromcommon) when (@fromcommon = true) { + @path: if(@icon-src-base64, @common-image-path, @common-image-const-path); +} + +.background-ximage-v2(@image, @w: auto, @h: auto, @repeat: no-repeat, @commonimage: true) { + .choose-image-path(@commonimage); + + background-image: if(@icon-src-base64, data-uri(%("%s",'@{path}/@{image}')), ~"url(@{path}/@{image})"); background-repeat: @repeat; @1d5ximage: replace(@image, '\.png$', '@1.5x.png'); @@ -180,59 +190,108 @@ @common-controls-width: 100px; .img-commonctrl, .theme-colorpalette .color-transparent, .palette-color-ext .color-transparent, .dropdown-menu li .checked:before, .input-error:before, - .btn-toolbar .icon.img-commonctrl, .list-item div.checked:before { - background-image: data-uri(%("%s",'@{common-image-path}/@{common-controls}')); + .btn-toolbar .icon.img-commonctrl, .list-item div.checked:before +{ + 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; - @media - only screen and (-webkit-min-device-pixel-ratio: 2), - only screen and (min-resolution: 2dppx), - only screen and (min-resolution: 192dpi) { - background-image: data-uri(%("%s",'@{common-image-path}/@{common-controls2x}')); - background-size: @common-controls-width auto; + @1d5ximage: replace(@common-controls, '\.png$', '@1.5x.png'); + @2ximage: replace(@common-controls, '\.png$', '@2x.png'); + + @media only screen { + @media (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.9), + (min-resolution: 1.5dppx) and (max-resolution: 1.9dppx), + (min-resolution: 144dpi) and (max-resolution: 191dpi) + { + background-image: ~"url(@{common-image-const-path}/@{1d5ximage})"; + background-size: @common-controls-width auto; + } + + @media (-webkit-min-device-pixel-ratio: 2), + (min-resolution: 2dppx), + (min-resolution: 192dpi) + { + background-image: ~"url(@{common-image-const-path}/@{2ximage})"; + background-size: @common-controls-width auto; + } } } -@img-toolbarmenu-width: 60px; +@toolbarmenu-sprite-width: 60px; .img-toolbarmenu { - background: data-uri(%("%s",'@{app-image-path}/toolbar-menu.png')) no-repeat; + background-image: if(@icon-src-base64, data-uri(%("%s",'@{app-image-path}/toolbar-menu.png')), ~"url(@{app-image-const-path}/toolbar-menu.png)"); + background-repeat: no-repeat; - @media - only screen and (-webkit-min-device-pixel-ratio: 2), - only screen and (min-resolution: 2dppx), - only screen and (min-resolution: 192dpi) { - background-image: data-uri(%("%s",'@{app-image-path}/toolbar-menu@2x.png')); - background-size: @img-toolbarmenu-width auto; + @media only screen { + @media (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.9), + (min-resolution: 1.5dppx) and (max-resolution: 1.9dppx), + (min-resolution: 144dpi) and (max-resolution: 191dpi) + { + background-image: ~"url(@{app-image-const-path}/toolbar-menu@1.5x.png)"; + background-size: @toolbarmenu-sprite-width auto; + } + + @media (-webkit-min-device-pixel-ratio: 2), + (min-resolution: 2dppx), + (min-resolution: 192dpi) + { + background-image: ~"url(@{app-image-const-path}/toolbar-menu@2x.png)"; + background-size: @toolbarmenu-sprite-width auto; + } } } @img-colorpicker-width: 205px; .img-colorpicker, - .color-transparent, .hsb-colorpicker .empty-color:before { - background: data-uri(%("%s",'@{common-image-path}/hsbcolorpicker/hsb-colorpicker.png')) no-repeat; + .color-transparent, .hsb-colorpicker .empty-color:before +{ + background-image: if(@icon-src-base64, data-uri(%("%s",'@{common-image-path}/hsbcolorpicker/hsb-colorpicker.png')), ~"url(@{common-image-const-path}/hsbcolorpicker/hsb-colorpicker.png)"); + background-repeat: no-repeat; - @media - only screen and (-webkit-min-device-pixel-ratio: 2), - only screen and (min-resolution: 2dppx), - only screen and (min-resolution: 192dpi) { - background-image: data-uri(%("%s",'@{common-image-path}/hsbcolorpicker/hsb-colorpicker@2x.png')); - background-size: @img-colorpicker-width auto; + @media only screen { + @media (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.9), + (min-resolution: 1.5dppx) and (max-resolution: 1.9dppx), + (min-resolution: 144dpi) and (max-resolution: 191dpi) + { + background-image: ~"url(@{common-image-const-path}/hsbcolorpicker/hsb-colorpicker@1.5x.png)"; + background-size: @img-colorpicker-width auto; + } + + @media (-webkit-min-device-pixel-ratio: 2), + (min-resolution: 2dppx), + (min-resolution: 192dpi) + { + background-image: ~"url(@{common-image-const-path}/hsbcolorpicker/hsb-colorpicker@2x.png)"; + background-size: @img-colorpicker-width auto; + } } } -@img-flags-width: 48px; .icon.lang-flag { + @img-flags-width: 48px; + width: 16px; height: 12px; - background-image: data-uri(%("%s",'@{common-image-path}/controls/flags.png')); + + background-image: if(@icon-src-base64, data-uri(%("%s",'@{common-image-path}/controls/flags.png')), ~"url(@{common-image-const-path}/controls/flags.png)"); background-repeat: no-repeat; - @media - only screen and (-webkit-min-device-pixel-ratio: 2), - only screen and (min-resolution: 2dppx), - only screen and (min-resolution: 192dpi) { - background-image: data-uri(%("%s",'@{common-image-path}/controls/flags@2x.png')); - background-size: @img-flags-width auto; + @media only screen { + @media (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.9), + (min-resolution: 1.5dppx) and (max-resolution: 1.9dppx), + (min-resolution: 144dpi) and (max-resolution: 191dpi) + { + background-image: ~"url(@{common-image-const-path}/controls/flags@1.5x.png)"; + background-size: @img-flags-width auto; + } + + @media (-webkit-min-device-pixel-ratio: 2), + (min-resolution: 2dppx), + (min-resolution: 192dpi) + { + background-image: ~"url(@{common-image-const-path}/controls/flags@2x.png)"; + background-size: @img-flags-width auto; + } } } \ No newline at end of file diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index c6a50c30b..5d9654e57 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -249,7 +249,7 @@ line-height: 20px; &:not(svg) { - .background-ximage-v2('@{app-image-const-path}/toolbar-menu.png', 60px, @usedatauri: false); + .background-ximage-v2('toolbar-menu.png', @toolbarmenu-sprite-width, @commonimage: false); } } @@ -266,7 +266,7 @@ &.x-huge, .btn-group.x-huge > & { :not(svg).icon { - .background-ximage-v2('@{common-image-const-path}/controls/toolbarbig.png', 78px, @usedatauri: false); + .background-ximage-v2('controls/toolbarbig.png', 78px); } } diff --git a/apps/common/main/resources/less/dropdown-menu.less b/apps/common/main/resources/less/dropdown-menu.less index 9a210ba81..0c6a49ffb 100644 --- a/apps/common/main/resources/less/dropdown-menu.less +++ b/apps/common/main/resources/less/dropdown-menu.less @@ -74,7 +74,7 @@ width: 22px; height: 22px; margin: -3px 5px 0 -15px; - .background-ximage('@{app-image-path}/popupmenu-btns.png', '@{app-image-path}/popupmenu-btns@2x.png', 66px); + .background-ximage-v2('popupmenu-btns.png', 66px, @commonimage: false); background-repeat: no-repeat; } } diff --git a/apps/common/main/resources/less/plugins.less b/apps/common/main/resources/less/plugins.less index d52478df3..bf665caba 100644 --- a/apps/common/main/resources/less/plugins.less +++ b/apps/common/main/resources/less/plugins.less @@ -54,7 +54,7 @@ margin-right: 10px; margin-top: -1px; - .background-ximage('@{common-image-path}/plugin/icon_add_on_default.png', '@{common-image-path}/plugin/icon_add_on_default@2x.png', 40px); + .background-ximage-v2('plugin/icon_add_on_default.png', 40px); } .plugin-caret { diff --git a/apps/common/main/resources/less/scroller.less b/apps/common/main/resources/less/scroller.less index afb0c60b2..c7bb8398d 100644 --- a/apps/common/main/resources/less/scroller.less +++ b/apps/common/main/resources/less/scroller.less @@ -18,10 +18,17 @@ height: 9px; background-color: @gray-light; - .background-ximage('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAOCAYAAAD0f5bSAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAuSURBVChTY6AfOH/+/H9SaSYQg1RAlqZhCT5+/AgOSlJoOgY50DqSNZJhEwMDACkvNZLpune5AAAAAElFTkSuQmCC', - 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAcCAMAAABIzV/hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMAUExURQAAAAEBAQICAgMDAwQEBAUFBQYGBgcHBwgICAkJCQoKCgsLCwwMDA0NDQ4ODg8PDxAQEBERERISEhMTExQUFBUVFRYWFhcXFxgYGBkZGRoaGhsbGxwcHB0dHR4eHh8fHyAgICEhISIiIiMjIyQkJCUlJSYmJicnJygoKCkpKSoqKisrKywsLC0tLS4uLi8vLzAwMDExMTIyMjMzMzQ0NDU1NTY2Njc3Nzg4ODk5OTo6Ojs7Ozw8PD09PT4+Pj8/P0BAQEFBQUJCQkNDQ0REREVFRUZGRkdHR0hISElJSUpKSktLS0xMTE1NTU5OTk9PT1BQUFFRUVJSUlNTU1RUVFVVVVZWVldXV1hYWFlZWVpaWltbW1xcXF1dXV5eXl9fX2BgYGFhYWJiYmNjY2RkZGVlZWZmZmdnZ2hoaGlpaWpqamtra2xsbG1tbW5ubm9vb3BwcHFxcXJycnNzc3R0dHV1dXZ2dnd3d3h4eHl5eXp6ent7e3x8fH19fX5+fn9/f4CAgIGBgYKCgoODg4SEhIWFhYaGhoeHh4iIiImJiYqKiouLi4yMjI2NjY6Ojo+Pj5CQkJGRkZKSkpOTk5SUlJWVlZaWlpeXl5iYmJmZmZqampubm5ycnJ2dnZ6enp+fn6CgoKGhoaKioqOjo6SkpKWlpaampqenp6ioqKmpqaqqqqurq6ysrK2tra6urq+vr7CwsLGxsbKysrOzs7S0tLW1tba2tre3t7i4uLm5ubq6uru7u7y8vL29vb6+vr+/v8DAwMHBwcLCwsPDw8TExMXFxcbGxsfHx8jIyMnJycrKysvLy8zMzM3Nzc7Ozs/Pz9DQ0NHR0dLS0tPT09TU1NXV1dbW1tfX19jY2NnZ2dra2tvb29zc3N3d3d7e3t/f3+Dg4OHh4eLi4uPj4+Tk5OXl5ebm5ufn5+jo6Onp6erq6uvr6+zs7O3t7e7u7u/v7/Dw8PHx8fLy8vPz8/T09PX19fb29vf39/j4+Pn5+fr6+vv7+/z8/P39/f7+/v///+KwXX0AAAABdFJOUwBA5thmAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAANklEQVQoU93IoREAQAjEwOu/OWqhg1dBBYv4zKxJLqtayYIsyIIsyBqf1r2SBVmQBVmQNa5KHuCckwGi77ddAAAAAElFTkSuQmCC', auto, 14px); - + background-image: data-uri('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAOCAYAAAD0f5bSAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAuSURBVChTY6AfOH/+/H9SaSYQg1RAlqZhCT5+/AgOSlJoOgY50DqSNZJhEwMDACkvNZLpune5AAAAAElFTkSuQmCC'); background-repeat: no-repeat; + + @media + only screen and (-webkit-min-device-pixel-ratio: 2), + only screen and (min-resolution: 2dppx), + only screen and (min-resolution: 192dpi) { + background-image: data-uri('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAcCAMAAABIzV/hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMAUExURQAAAAEBAQICAgMDAwQEBAUFBQYGBgcHBwgICAkJCQoKCgsLCwwMDA0NDQ4ODg8PDxAQEBERERISEhMTExQUFBUVFRYWFhcXFxgYGBkZGRoaGhsbGxwcHB0dHR4eHh8fHyAgICEhISIiIiMjIyQkJCUlJSYmJicnJygoKCkpKSoqKisrKywsLC0tLS4uLi8vLzAwMDExMTIyMjMzMzQ0NDU1NTY2Njc3Nzg4ODk5OTo6Ojs7Ozw8PD09PT4+Pj8/P0BAQEFBQUJCQkNDQ0REREVFRUZGRkdHR0hISElJSUpKSktLS0xMTE1NTU5OTk9PT1BQUFFRUVJSUlNTU1RUVFVVVVZWVldXV1hYWFlZWVpaWltbW1xcXF1dXV5eXl9fX2BgYGFhYWJiYmNjY2RkZGVlZWZmZmdnZ2hoaGlpaWpqamtra2xsbG1tbW5ubm9vb3BwcHFxcXJycnNzc3R0dHV1dXZ2dnd3d3h4eHl5eXp6ent7e3x8fH19fX5+fn9/f4CAgIGBgYKCgoODg4SEhIWFhYaGhoeHh4iIiImJiYqKiouLi4yMjI2NjY6Ojo+Pj5CQkJGRkZKSkpOTk5SUlJWVlZaWlpeXl5iYmJmZmZqampubm5ycnJ2dnZ6enp+fn6CgoKGhoaKioqOjo6SkpKWlpaampqenp6ioqKmpqaqqqqurq6ysrK2tra6urq+vr7CwsLGxsbKysrOzs7S0tLW1tba2tre3t7i4uLm5ubq6uru7u7y8vL29vb6+vr+/v8DAwMHBwcLCwsPDw8TExMXFxcbGxsfHx8jIyMnJycrKysvLy8zMzM3Nzc7Ozs/Pz9DQ0NHR0dLS0tPT09TU1NXV1dbW1tfX19jY2NnZ2dra2tvb29zc3N3d3d7e3t/f3+Dg4OHh4eLi4uPj4+Tk5OXl5ebm5ufn5+jo6Onp6erq6uvr6+zs7O3t7e7u7u/v7/Dw8PHx8fLy8vPz8/T09PX19fb29vf39/j4+Pn5+fr6+vv7+/z8/P39/f7+/v///+KwXX0AAAABdFJOUwBA5thmAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAANklEQVQoU93IoREAQAjEwOu/OWqhg1dBBYv4zKxJLqtayYIsyIIsyBqf1r2SBVmQBVmQNa5KHuCckwGi77ddAAAAAElFTkSuQmCC'); + background-size: auto 14px; + } + background-position: center 0; .border-radius(2px); border: 1px solid @gray; diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index 90034f236..c859507d1 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -362,7 +362,7 @@ .extra { #header-logo { i { - .background-ximage('@{common-image-path}/header/dark-logo.png', '@{common-image-path}/header/dark-logo@2x.png', 86px); + .background-ximage-v2('header/dark-logo.png', 86px); } } } @@ -537,15 +537,16 @@ .btn-toolbar { &:not(.x-huge) { .icon:not(svg) { - &.btn-bold, &.btn-italic, &.btn-strikeout, &.btn-underline, &.btn-ic-docspell, &.btn-sort-down, &.btn-sort-up, &.btn-currency-style { - .background-ximage('@{common-image-path}/controls/toolbar-menu-ru.png', '@{common-image-path}/controls/toolbar-menu-ru@2x.png', 60px); + &.btn-bold, &.btn-italic, &.btn-strikeout, &.btn-underline, &.btn-ic-docspell, &.btn-sort-down, &.btn-sort-up, &.btn-currency-style + { + .background-ximage-v2('controls/toolbar-menu-ru.png', @toolbarmenu-sprite-width); } } } } .img-toolbarmenu.btn-ic-docspell { - .background-ximage('@{common-image-path}/controls/toolbar-menu-ru.png', '@{common-image-path}/controls/toolbar-menu-ru@2x.png', 60px); + .background-ximage-v2('controls/toolbar-menu-ru.png', @toolbarmenu-sprite-width); } .button-normal-icon(btn-notes, 77, @x-huge-btn-icon-size); diff --git a/apps/documenteditor/main/resources/less/advanced-settings.less b/apps/documenteditor/main/resources/less/advanced-settings.less index d2a0168ae..bd51ba904 100644 --- a/apps/documenteditor/main/resources/less/advanced-settings.less +++ b/apps/documenteditor/main/resources/less/advanced-settings.less @@ -1,5 +1,5 @@ .btn-borders-large { - .background-ximage('@{app-image-path}/right-panels/LargeBorders.png', '@{app-image-path}/right-panels/LargeBorders@2x.png', 124px); + .background-ximage-v2('right-panels/LargeBorders.png', 124px, @commonimage: false); } .button-normal-icon(btn-adv-paragraph-all, 0, 31px); @@ -28,7 +28,7 @@ .toolbar-btn-icon(advanced-btn-ratio, 52, 20px); .icon-advanced-wrap { - .background-ximage('@{app-image-path}/right-panels/right_panel_wrap_btns.png', '@{app-image-path}/right-panels/right_panel_wrap_btns@2x.png', 180px); + .background-ximage-v2('right-panels/right_panel_wrap_btns.png', 180px, @commonimage: false); } .button-normal-icon(btn-wrap-inline, 0, @x-huge-icon-size); @@ -67,7 +67,7 @@ } .img-arrows { - .background-ximage('@{common-image-path}/right-panels/Begin-EndStyle.png', '@{common-image-path}/right-panels/Begin-EndStyle@2x.png', 480px); + .background-ximage-v2('right-panels/Begin-EndStyle.png', 480px, @commonimage: true); } .item-arrow { diff --git a/apps/documenteditor/main/resources/less/filemenu.less b/apps/documenteditor/main/resources/less/filemenu.less index aad7cc050..d81b84a87 100644 --- a/apps/documenteditor/main/resources/less/filemenu.less +++ b/apps/documenteditor/main/resources/less/filemenu.less @@ -228,8 +228,7 @@ width: 35px; height: 45px; margin-right: 10px; - .background-ximage('@{app-image-path}/file-recent.png', '@{app-image-path}/file-recent@2x.png', 72px); - background-repeat: no-repeat; + .background-ximage-v2('file-recent.png', 72px, @commonimage: false); background-position: 0 0; } diff --git a/apps/documenteditor/main/resources/less/rightmenu.less b/apps/documenteditor/main/resources/less/rightmenu.less index 7c05cebd1..0718b0fcb 100644 --- a/apps/documenteditor/main/resources/less/rightmenu.less +++ b/apps/documenteditor/main/resources/less/rightmenu.less @@ -114,7 +114,7 @@ .button-otherstates-icon2(btn-category, @toolbar-icon-size); .icon-right-panel { - .background-ximage('@{app-image-path}/right-panels/RightPanelBigBtns.png', '@{app-image-path}/right-panels/RightPanelBigBtns@2x.png', 148px); + .background-ximage-v2('right-panels/RightPanelBigBtns.png', 148px, @commonimage: false); } .button-normal-icon(btn-colontitul-tl, 3, @huge-icon-size); @@ -138,11 +138,12 @@ .button-otherstates-icon(icon-right-panel, @huge-icon-size); .combo-wrap-item { - .background-ximage('@{app-image-path}/right-panels/right_panel_wrap_icons.png', '@{app-image-path}/right-panels/right_panel_wrap_icons@2x.png', 350px); + // TODO: dublicate .item-wrap + .background-ximage-v2('right-panels/right_panel_wrap_icons.png', 350px, @commonimage: false); } .item-wrap { - .background-ximage('@{app-image-path}/right-panels/right_panel_wrap_icons.png', '@{app-image-path}/right-panels/right_panel_wrap_icons@2x.png', 350px); + .background-ximage-v2('right-panels/right_panel_wrap_icons.png', 350px, @commonimage: false); width:50px; height:50px; background-size: cover !important; @@ -177,7 +178,7 @@ } .btn-toolbar:not(.x-huge) .icon:not(svg).btn-borders-small { - .background-ximage('@{common-image-path}/right-panels/SmallBorders.png', '@{common-image-path}/right-panels/SmallBorders@2x.png', 84px); + .background-ximage-v2('right-panels/SmallBorders.png', 84px); } .button-normal-icon(btn-position-all, 0, 21px); @@ -195,7 +196,7 @@ .btn-edit-table, .btn-change-shape { - .background-ximage('@{common-image-path}/right-panels/rowscols_icon.png', '@{common-image-path}/right-panels/rowscols_icon@2x.png', 84px); + .background-ximage-v2('right-panels/rowscols_icon.png', 84px); margin-right: 2px !important; margin-bottom: 1px !important; } @@ -213,7 +214,7 @@ button.active:not(.disabled) .btn-change-shape, button:active:not(.disabled) .btn-change-shape {background-position: -56px -16px;} .combo-pattern-item { - .background-ximage('@{common-image-path}/right-panels/patterns.png', '@{common-image-path}/right-panels/patterns@2x.png', 112px); + .background-ximage-v2('right-panels/patterns.png', 112px); } .combo-dataview-menu { @@ -229,7 +230,8 @@ button:active:not(.disabled) .btn-change-shape {background-position: -56px - } .item-gradient { - .background-ximage('@{common-image-path}/right-panels/gradients.png', '@{common-image-path}/right-panels/gradients@2x.png', 150px); + .background-ximage-v2('right-panels/gradients.png', 150px); + width:50px; height:50px; } diff --git a/apps/documenteditor/main/resources/less/toolbar.less b/apps/documenteditor/main/resources/less/toolbar.less index c4ab40396..87a829578 100644 --- a/apps/documenteditor/main/resources/less/toolbar.less +++ b/apps/documenteditor/main/resources/less/toolbar.less @@ -34,7 +34,7 @@ } .item-markerlist { - .background-ximage('@{common-image-path}/toolbar/bullets-and-numbering.png', '@{common-image-path}/toolbar/bullets-and-numbering@2x.png', 38px); + .background-ximage-v2('toolbar/bullets-and-numbering.png', 38px); width: 38px; height: 38px; } @@ -45,7 +45,7 @@ > li > a.item-contents { div { - .background-ximage('@{app-image-path}/toolbar/contents.png', '@{app-image-path}/toolbar/contents@2x.png', 246px); + .background-ximage-v2('toolbar/contents.png', 246px, @commonimage: false); width: 246px; height: @contents-menu-item-height; @@ -170,7 +170,8 @@ } .item-chartlist { - .background-ximage('@{common-image-path}/toolbar/charttypes.png', '@{common-image-path}/toolbar/charttypes@2x.png', 250px); + .background-ximage-v2('toolbar/charttypes.png', 250px); + width: 50px; height: 50px; } @@ -433,7 +434,7 @@ .item-equation { border: 1px solid @gray; - .background-ximage('@{common-image-path}/toolbar/math.png', '@{common-image-path}/toolbar/math@2x.png', 1500px); + .background-ximage-v2('toolbar/math.png', 1500px, @commonimage: true); } .save-style-container { diff --git a/apps/presentationeditor/main/resources/less/leftmenu.less b/apps/presentationeditor/main/resources/less/leftmenu.less index 9f099db75..6c1b47d5a 100644 --- a/apps/presentationeditor/main/resources/less/leftmenu.less +++ b/apps/presentationeditor/main/resources/less/leftmenu.less @@ -308,8 +308,7 @@ button.notify .btn-menu-comments {background-position: -0*@toolbar-icon-size -70 width: 35px; height: 45px; margin-right: 10px; - .background-ximage('@{app-image-path}/file-recent.png', '@{app-image-path}/file-recent@2x.png', 38px); - background-repeat: no-repeat; + .background-ximage-v2('file-recent.png', 38px, @commonimage: false); background-position: 0 0; } diff --git a/apps/presentationeditor/main/resources/less/rightmenu.less b/apps/presentationeditor/main/resources/less/rightmenu.less index f9ca627a5..d35ddfd16 100644 --- a/apps/presentationeditor/main/resources/less/rightmenu.less +++ b/apps/presentationeditor/main/resources/less/rightmenu.less @@ -109,7 +109,7 @@ } .btn-toolbar:not(.x-huge) .icon:not(svg).btn-borders-small { - .background-ximage('@{common-image-path}/right-panels/SmallBorders.png', '@{common-image-path}/right-panels/SmallBorders@2x.png', 84px); + .background-ximage-v2('right-panels/SmallBorders.png', 84px); } .button-normal-icon(btn-position-all, 0, 21px); diff --git a/apps/presentationeditor/main/resources/less/toolbar.less b/apps/presentationeditor/main/resources/less/toolbar.less index b75053b19..649d58319 100644 --- a/apps/presentationeditor/main/resources/less/toolbar.less +++ b/apps/presentationeditor/main/resources/less/toolbar.less @@ -46,7 +46,7 @@ } .item-markerlist { - .background-ximage('@{common-image-path}/toolbar/bullets-and-numbering.png', '@{common-image-path}/toolbar/bullets-and-numbering@2x.png', 38px); + .background-ximage-v2('toolbar/bullets-and-numbering.png', 38px); width: 38px; height: 38px; } @@ -330,7 +330,7 @@ .item-equation { border: 1px solid @gray; - .background-ximage('@{common-image-path}/toolbar/math.png', '@{common-image-path}/toolbar/math@2x.png', 1500px); + .background-ximage-v2('toolbar/math.png', 1500px); } #plugins-panel { diff --git a/apps/spreadsheeteditor/main/resources/less/leftmenu.less b/apps/spreadsheeteditor/main/resources/less/leftmenu.less index 8ceea12aa..93400f7d0 100644 --- a/apps/spreadsheeteditor/main/resources/less/leftmenu.less +++ b/apps/spreadsheeteditor/main/resources/less/leftmenu.less @@ -376,8 +376,7 @@ button.notify .btn-menu-comments {background-position: -0*@toolbar-icon-size -2* width: 35px; height: 45px; margin-right: 10px; - .background-ximage('@{app-image-path}/file-recent.png', '@{app-image-path}/file-recent@2x.png', 38px); - background-repeat: no-repeat; + .background-ximage-v2('file-recent.png', 38px, @commonimage: false); background-position: 0 0; } diff --git a/apps/spreadsheeteditor/main/resources/less/rightmenu.less b/apps/spreadsheeteditor/main/resources/less/rightmenu.less index 2d16d42e1..0b776c188 100644 --- a/apps/spreadsheeteditor/main/resources/less/rightmenu.less +++ b/apps/spreadsheeteditor/main/resources/less/rightmenu.less @@ -100,7 +100,7 @@ .button-otherstates-icon2(btn-category, @toolbar-icon-size); .btn-toolbar:not(.x-huge) .icon:not(svg).btn-borders-small { - .background-ximage('@{common-image-path}/right-panels/SmallBorders.png', '@{common-image-path}/right-panels/SmallBorders@2x.png', 84px); + .background-ximage-v2('right-panels/SmallBorders.png', 84px); } .button-normal-icon(btn-position-all, 0, 21px); diff --git a/apps/spreadsheeteditor/main/resources/less/toolbar.less b/apps/spreadsheeteditor/main/resources/less/toolbar.less index e407c9a57..cbd7195bd 100644 --- a/apps/spreadsheeteditor/main/resources/less/toolbar.less +++ b/apps/spreadsheeteditor/main/resources/less/toolbar.less @@ -255,7 +255,7 @@ .item-equation { border: 1px solid @gray; - .background-ximage('@{common-image-path}/toolbar/math.png', '@{common-image-path}/toolbar/math@2x.png', 1500px); + .background-ximage-v2('toolbar/math.png', 1500px); } #special-paste-container, @@ -275,7 +275,7 @@ } .item-markerlist { - .background-ximage('@{common-image-path}/toolbar/bullets-and-numbering.png', '@{common-image-path}/toolbar/bullets-and-numbering@2x.png', 38px); + .background-ximage-v2('toolbar/bullets-and-numbering.png', 38px); width: 38px; height: 38px; }