diff --git a/apps/common/main/lib/component/Mixtbar.js b/apps/common/main/lib/component/Mixtbar.js index 4504b6445d..2547d2a61e 100644 --- a/apps/common/main/lib/component/Mixtbar.js +++ b/apps/common/main/lib/component/Mixtbar.js @@ -157,6 +157,10 @@ define([ Common.NotificationCenter.on('app:repaint', _.bind(function() { this.repaintMoreBtns(); }, this)); + Common.NotificationCenter.on('uitheme:changed', _.bind(function() { + this.clearActiveData(); + this.processPanelVisible(); + }, this)); }, afterRender: function() { @@ -333,6 +337,8 @@ define([ } if ( tab ) { + this.fireEvent('tab:active:before', [tab]); + me.$tabs.removeClass('active'); me.$panels.removeClass('active'); me.hideMoreBtns(); diff --git a/apps/common/main/lib/controller/Themes.js b/apps/common/main/lib/controller/Themes.js index dcd947a375..905db6ae2c 100644 --- a/apps/common/main/lib/controller/Themes.js +++ b/apps/common/main/lib/controller/Themes.js @@ -85,7 +85,7 @@ define([ --sk-background-toolbar-header-slide: #BE664F;; --sk-background-toolbar-header-cell: #40865c; --sk-background-toolbar-header-visio: #444796; --sk-background-toolbar: #f7f7f7; --sk-background-toolbar-controls: #f1f1f1; - --sk-background-toolbar-tab: rgba(255,255,255,.15); --sk-background-toolbar-button: #e0e0e0; + --sk-background-toolbar-tab: rgba(255,255,255,.15); --sk-background-toolbar-button: #d8dadc; --sk-layout-padding-toolbar-controls: 0 7px; --sk-layout-padding-header: 0 8px; --sk-canvas-background: #eee; --sk-canvas-content-background: #fff; --sk-canvas-page-border: #dde0e5; --sk-canvas-line: rgba(0,0,0,.05); diff --git a/apps/common/main/lib/util/themeinit.js b/apps/common/main/lib/util/themeinit.js index 33d17ba064..df33038745 100644 --- a/apps/common/main/lib/util/themeinit.js +++ b/apps/common/main/lib/util/themeinit.js @@ -88,7 +88,7 @@ } window.uitheme.apply_icons_from_url = function (themeid, url) { - // if ( !url ) return; + if ( !url ) return; let base_url = !url.endsWith('/') ? url + '/' : url; const sp_names = ['small', 'big', 'huge']; diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index 90df5d8e55..d6ff09fd6e 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -1315,7 +1315,10 @@ define([ updateAvatarEl: function(){ if(this.options.userAvatar){ - $btnUserName.css({'background-image': 'url('+ this.options.userAvatar +')'}); + $btnUserName.css({ + 'background-image': 'url('+ this.options.userAvatar +')', + 'background-color': 'transparent' + }); $btnUserName.text(''); } else { $btnUserName.text(Common.Utils.getUserInitials(this.options.userName)); diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index 6a785ed3f2..61705fffd3 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -301,6 +301,7 @@ //align-items: center; align-items: start; height: 24px; + height: calc((@font-size-base-app + 2px) * 2); .caption { max-width: 160px;//85px; @@ -308,7 +309,7 @@ text-overflow: ellipsis; white-space: pre; - line-height: 11px; + line-height: 1; padding: 0 2px; .caret { @@ -679,14 +680,6 @@ float: right; } - &:first-child:not(:last-child):not(.dropdown-toggle) { - .rtl & { - .border-radius(@border-radius-button-normal); - border-top-left-radius: 0; - border-bottom-left-radius: 0; - } - } - &.btn-toolbar { float: none; } @@ -702,11 +695,35 @@ } } - > .dropdown-toggle:not(first-child) { - .rtl & { - .border-radius(@border-radius-button-normal); - border-top-right-radius: 0; - border-bottom-right-radius: 0; + &:not(.x-huge) { + > .btn:first-child:not(:last-child):not(.dropdown-toggle) { + .rtl & { + &.btn-toolbar { + .border-radius(@border-radius-button-toolbar); + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + &:not(.btn-toolbar) { + .border-radius(@border-radius-button-normal); + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + } + } + + > .dropdown-toggle:not(:first-child) { + .rtl & { + &.btn-toolbar { + .border-radius(@border-radius-button-toolbar); + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + &:not(.btn-toolbar) { + .border-radius(@border-radius-button-normal); + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + } } } diff --git a/apps/common/main/resources/less/combobox.less b/apps/common/main/resources/less/combobox.less index 679c8c6fce..4e60c9aee9 100644 --- a/apps/common/main/resources/less/combobox.less +++ b/apps/common/main/resources/less/combobox.less @@ -74,8 +74,8 @@ //border-color: @border-regular-control-ie; //border-color: @border-regular-control; border-color: @border-fill-input; - //background-color: transparent; - background-color: @background-fill-input; + background-color: transparent; + //background-color: @background-fill-input; margin-left: -1px; position: absolute; top: 0; diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 9ee3368fb7..0edb12f2a0 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -337,6 +337,7 @@ height: @x-small-btn-icon-size; top: 50%; margin-top: -10px; + margin-top: calc(-1 * @font-size-base-app + 1px); fill: @icon-toolbar-header-ie; fill: @icon-toolbar-header; } @@ -346,6 +347,8 @@ cursor: pointer; .font-size-tiny(); margin-left: -18px; + margin-top: @scaled-one-px-value-ie; + margin-top: @scaled-one-px-value; width: 16px; text-align: center; overflow: hidden; diff --git a/apps/documenteditor/main/app/view/RightMenu.js b/apps/documenteditor/main/app/view/RightMenu.js index 95ecade771..80581cd346 100644 --- a/apps/documenteditor/main/app/view/RightMenu.js +++ b/apps/documenteditor/main/app/view/RightMenu.js @@ -38,6 +38,7 @@ var SCALE_MIN = 40; var MENU_SCALE_PART = 260; +var MENU_BASE_WIDTH = 220; define([ 'text!documenteditor/main/app/template/RightMenu.template', @@ -160,16 +161,22 @@ define([ this.defaultHideRightMenu = !(mode.customization && (mode.customization.hideRightMenu===false)); var open = !Common.localStorage.getBool("de-hide-right-settings", this.defaultHideRightMenu); Common.Utils.InternalSettings.set("de-hide-right-settings", !open); - this.$el.css('width', ((open) ? MENU_SCALE_PART : SCALE_MIN) + 'px'); - this.$el.show(); Common.NotificationCenter.on('app:repaint', _.bind(function() { this.$el.css('width', ((open) ? MENU_SCALE_PART : SCALE_MIN) + 'px'); }, this)); + Common.NotificationCenter.on('uitheme:changed', _.bind(function() { + this.updateWidth(); + Common.NotificationCenter.trigger('layout:changed', 'rightmenu'); + }, this)); + var $markup = $(this.template({scope: this})); this.$el.html($markup); + this.updateWidth(); + this.$el.show(); + this.btnMoreContainer = $markup.find('#slot-right-menu-more'); Common.UI.SideMenu.prototype.render.call(this); this.btnMore.menu.menuAlign = 'tr-tl'; @@ -381,6 +388,14 @@ define([ Common.UI.SideMenu.prototype.setButtons.apply(this, [allButtons]); }, + updateWidth: function() { + var pane = $(this.el).find('.right-panel'), + paddings = parseInt(pane.css('padding-left')) + parseInt(pane.css('padding-right')); + pane.css('width', MENU_BASE_WIDTH + paddings + 'px'); + MENU_SCALE_PART = SCALE_MIN + MENU_BASE_WIDTH + paddings; + this.$el.css('width', (!Common.Utils.InternalSettings.get("de-hide-right-settings") ? MENU_SCALE_PART : SCALE_MIN) + 'px'); + }, + txtParagraphSettings: 'Paragraph Settings', txtImageSettings: 'Image Settings', txtTableSettings: 'Table Settings', diff --git a/apps/documenteditor/main/index.html b/apps/documenteditor/main/index.html index 0a23b4f7f9..9ecfd295a5 100644 --- a/apps/documenteditor/main/index.html +++ b/apps/documenteditor/main/index.html @@ -135,16 +135,6 @@ opacity: 0.4; } - .loadmask > .brendpanel .circle { - vertical-align: middle; - width: 20px; - height: 20px; - border-radius: 20px; - /*margin: 0 10px;*/ - background: rgba(0,0,0,.15); - background: var(--sk-background-toolbar-tab); - } - .loadmask > .sktoolbar { background: #f1f1f1; /*height: 66px;*/ @@ -355,7 +345,6 @@
-
diff --git a/apps/documenteditor/main/index.html.deploy b/apps/documenteditor/main/index.html.deploy index 92f7a65dfb..d9cb6e2df7 100644 --- a/apps/documenteditor/main/index.html.deploy +++ b/apps/documenteditor/main/index.html.deploy @@ -86,15 +86,6 @@ opacity: 0.4; } - .loadmask > .brendpanel .circle { - vertical-align: middle; - width: 20px; - height: 20px; - border-radius: 20px; - background: rgba(0,0,0,.15); - background: var(--sk-background-toolbar-tab); - } - .loadmask > .sktoolbar { background: #f1f1f1; padding: 0; @@ -284,7 +275,7 @@ -
+
diff --git a/apps/pdfeditor/main/app/view/FormSettings.js b/apps/pdfeditor/main/app/view/FormSettings.js index ea83859726..0f5904388c 100644 --- a/apps/pdfeditor/main/app/view/FormSettings.js +++ b/apps/pdfeditor/main/app/view/FormSettings.js @@ -777,6 +777,7 @@ define([ }); this.sldrPreviewPositionX.on('change', _.bind(this.onImagePositionChange, this, 'x')); this.sldrPreviewPositionX.on('changecomplete', _.bind(this.onImagePositionChangeComplete, this, 'x')); + this.lockedControls.push(this.sldrPreviewPositionX); this.sldrPreviewPositionY = new Common.UI.SingleSlider({ el: $markup.findById('#form-img-slider-position-y'), @@ -788,6 +789,7 @@ define([ }); this.sldrPreviewPositionY.on('change', _.bind(this.onImagePositionChange, this, 'y')); this.sldrPreviewPositionY.on('changecomplete', _.bind(this.onImagePositionChangeComplete, this, 'y')); + this.lockedControls.push(this.sldrPreviewPositionY); var xValue = this.sldrPreviewPositionX.getValue(), yValue = this.sldrPreviewPositionY.getValue(); diff --git a/apps/pdfeditor/main/app/view/RightMenu.js b/apps/pdfeditor/main/app/view/RightMenu.js index 98474687e4..6e46271e56 100644 --- a/apps/pdfeditor/main/app/view/RightMenu.js +++ b/apps/pdfeditor/main/app/view/RightMenu.js @@ -38,6 +38,7 @@ var SCALE_MIN = 40; var MENU_SCALE_PART = 260; +var MENU_BASE_WIDTH = 220; define([ 'text!pdfeditor/main/app/template/RightMenu.template', @@ -148,16 +149,21 @@ define([ this.defaultHideRightMenu = !(mode.customization && (mode.customization.hideRightMenu===false)); var open = !Common.localStorage.getBool("pdfe-hide-right-settings", this.defaultHideRightMenu); Common.Utils.InternalSettings.set("pdfe-hide-right-settings", !open); - el.css('width', SCALE_MIN + 'px'); - // el.css('width', ((open) ? MENU_SCALE_PART : SCALE_MIN) + 'px'); - el.show(); Common.NotificationCenter.on('app:repaint', function() { el.css('width', SCALE_MIN + 'px'); }); + Common.NotificationCenter.on('uitheme:changed', _.bind(function() { + this.updateWidth(); + Common.NotificationCenter.trigger('layout:changed', 'rightmenu'); + }, this)); + el.html(this.template({scope: this})); + this.updateWidth(); + el.show(); + this.btnMoreContainer = $('#slot-right-menu-more'); Common.UI.SideMenu.prototype.render.call(this); this.btnMore.menu.menuAlign = 'tr-tl'; @@ -340,6 +346,14 @@ define([ Common.UI.SideMenu.prototype.setButtons.apply(this, [allButtons]); }, + updateWidth: function() { + var pane = $(this.el).find('.right-panel'), + paddings = parseInt(pane.css('padding-left')) + parseInt(pane.css('padding-right')); + pane.css('width', MENU_BASE_WIDTH + paddings + 'px'); + MENU_SCALE_PART = SCALE_MIN + MENU_BASE_WIDTH + paddings; + this.$el.css('width', (this.GetActivePane() ? MENU_SCALE_PART : SCALE_MIN) + 'px'); + }, + txtParagraphSettings: 'Text Settings', txtImageSettings: 'Image Settings', txtTableSettings: 'Table Settings', diff --git a/apps/pdfeditor/main/index.html b/apps/pdfeditor/main/index.html index 8b2ebcc005..4df5734c44 100644 --- a/apps/pdfeditor/main/index.html +++ b/apps/pdfeditor/main/index.html @@ -109,16 +109,6 @@ opacity: 0.4; } - .loadmask > .brendpanel .circle { - vertical-align: middle; - width: 20px; - height: 20px; - border-radius: 20px; - /* margin: 0 10px; */ - background: rgba(0,0,0,.15); - background: var(--sk-background-toolbar-tab); - } - .loadmask > .sktoolbar { background: #f1f1f1; /*height: 66px;*/ @@ -323,7 +313,6 @@
-
diff --git a/apps/pdfeditor/main/index.html.deploy b/apps/pdfeditor/main/index.html.deploy index 7aad664303..4a39349320 100644 --- a/apps/pdfeditor/main/index.html.deploy +++ b/apps/pdfeditor/main/index.html.deploy @@ -80,15 +80,6 @@ opacity: 0.4; } - .loadmask > .brendpanel .circle { - vertical-align: middle; - width: 20px; - height: 20px; - border-radius: 20px; - background: rgba(0,0,0,.15); - background: var(--sk-background-toolbar-tab); - } - .loadmask > .sktoolbar { background: #f1f1f1; padding: 0; @@ -272,7 +263,7 @@ -
+
-
+
diff --git a/apps/spreadsheeteditor/main/app/view/RightMenu.js b/apps/spreadsheeteditor/main/app/view/RightMenu.js index 03b8b3aa13..e590125378 100644 --- a/apps/spreadsheeteditor/main/app/view/RightMenu.js +++ b/apps/spreadsheeteditor/main/app/view/RightMenu.js @@ -38,6 +38,7 @@ var SCALE_MIN = 40; var MENU_SCALE_PART = 260; +var MENU_BASE_WIDTH = 220; define([ 'text!spreadsheeteditor/main/app/template/RightMenu.template', @@ -184,16 +185,22 @@ define([ this.defaultHideRightMenu = !(mode.customization && (mode.customization.hideRightMenu===false)); var open = !Common.localStorage.getBool("sse-hide-right-settings", this.defaultHideRightMenu); Common.Utils.InternalSettings.set("sse-hide-right-settings", !open); - el.css('width', ((open) ? MENU_SCALE_PART : SCALE_MIN) + 'px'); - el.css('z-index', 101); - el.show(); Common.NotificationCenter.on('app:repaint', function() { el.css('width', ((open) ? MENU_SCALE_PART : SCALE_MIN) + 'px'); }); + Common.NotificationCenter.on('uitheme:changed', _.bind(function() { + this.updateWidth(); + Common.NotificationCenter.trigger('layout:changed', 'rightmenu'); + }, this)); + el.html(this.template({scope: this})); + this.updateWidth(); + el.css('z-index', 101); + el.show(); + this.btnMoreContainer = $('#slot-right-menu-more'); Common.UI.SideMenu.prototype.render.call(this); this.btnMore.menu.menuAlign = 'tr-tl'; @@ -373,6 +380,14 @@ define([ Common.UI.SideMenu.prototype.setButtons.apply(this, [allButtons]); }, + updateWidth: function() { + var pane = $(this.el).find('.right-panel'), + paddings = parseInt(pane.css('padding-left')) + parseInt(pane.css('padding-right')); + pane.css('width', MENU_BASE_WIDTH + paddings + 'px'); + MENU_SCALE_PART = SCALE_MIN + MENU_BASE_WIDTH + paddings; + this.$el.css('width', (!Common.Utils.InternalSettings.get("sse-hide-right-settings") ? MENU_SCALE_PART : SCALE_MIN) + 'px'); + }, + txtParagraphSettings: 'Paragraph Settings', txtImageSettings: 'Image Settings', txtShapeSettings: 'Shape Settings', diff --git a/apps/spreadsheeteditor/main/index.html b/apps/spreadsheeteditor/main/index.html index 58d2d6c2b1..9d0cb43ee3 100644 --- a/apps/spreadsheeteditor/main/index.html +++ b/apps/spreadsheeteditor/main/index.html @@ -109,16 +109,6 @@ opacity: 0.4; } - .loadmask > .brendpanel .circle { - vertical-align: middle; - width: 20px; - height: 20px; - border-radius: 20px; - /* margin: 0 10px; */ - background: rgba(0,0,0,.15); - background: var(--sk-background-toolbar-tab); - } - .loadmask > .sktoolbar { background: #f1f1f1; padding: 0; @@ -381,7 +371,6 @@
-
diff --git a/apps/spreadsheeteditor/main/index.html.deploy b/apps/spreadsheeteditor/main/index.html.deploy index a8deaeb15e..2d5a5e60d8 100644 --- a/apps/spreadsheeteditor/main/index.html.deploy +++ b/apps/spreadsheeteditor/main/index.html.deploy @@ -86,15 +86,6 @@ opacity: 0.4; } - .loadmask > .brendpanel .circle { - vertical-align: middle; - width: 20px; - height: 20px; - border-radius: 20px; - background: rgba(0,0,0,.15); - background: var(--sk-background-toolbar-tab); - } - .loadmask > .sktoolbar { background: #f1f1f1; padding: 0; @@ -352,7 +343,7 @@
-
+
diff --git a/apps/visioeditor/main/index.html b/apps/visioeditor/main/index.html index 3181a22a60..b7517e5452 100644 --- a/apps/visioeditor/main/index.html +++ b/apps/visioeditor/main/index.html @@ -121,16 +121,6 @@ opacity: 0.4; } - .loadmask > .brendpanel .circle { - vertical-align: middle; - width: 20px; - height: 20px; - border-radius: 20px; - /* margin: 0 10px; */ - background: rgba(0,0,0,.15); - background: var(--sk-background-toolbar-tab); - } - .loadmask > .sktoolbar { background: #f1f1f1; /*height: 66px;*/ @@ -369,7 +359,6 @@
-
diff --git a/apps/visioeditor/main/index.html.deploy b/apps/visioeditor/main/index.html.deploy index 2852add593..47765d5084 100644 --- a/apps/visioeditor/main/index.html.deploy +++ b/apps/visioeditor/main/index.html.deploy @@ -97,16 +97,6 @@ opacity: 0.4; } - .loadmask > .brendpanel .circle { - vertical-align: middle; - width: 20px; - height: 20px; - border-radius: 20px; - margin: 0 10px; - background: rgba(0,0,0,.15); - background: var(--sk-background-toolbar-tab); - } - .loadmask > .sktoolbar { background: #f1f1f1; padding: 0; @@ -335,7 +325,7 @@
-
+