diff --git a/apps/common/main/lib/component/MenuItem.js b/apps/common/main/lib/component/MenuItem.js index b8a18cbdb7..58d05b3f38 100644 --- a/apps/common/main/lib/component/MenuItem.js +++ b/apps/common/main/lib/component/MenuItem.js @@ -112,7 +112,7 @@ define([ tagName : 'li', template: _.template([ - ' tabindex="-1" type="menuitem" <% }; if(!_.isUndefined(options.stopPropagation)) { %> data-stopPropagation="true" <% }; if(!_.isUndefined(options.dataHint)) { %> data-hint="<%= options.dataHint %>" <% }; if(!_.isUndefined(options.dataHintDirection)) { %> data-hint-direction="<%= options.dataHintDirection %>" <% }; if(!_.isUndefined(options.dataHintOffset)) { %> data-hint-offset="<%= options.dataHintOffset %>" <% }; if(options.dataHintTitle) { %> data-hint-title="<%= options.dataHintTitle %>" <% }; %> >', + ' data-no-icon <% } %> style="<%= style %>" <% if(options.canFocused) { %> tabindex="-1" type="menuitem" <% }; if(!_.isUndefined(options.stopPropagation)) { %> data-stopPropagation="true" <% }; if(!_.isUndefined(options.dataHint)) { %> data-hint="<%= options.dataHint %>" <% }; if(!_.isUndefined(options.dataHintDirection)) { %> data-hint-direction="<%= options.dataHintDirection %>" <% }; if(!_.isUndefined(options.dataHintOffset)) { %> data-hint-offset="<%= options.dataHintOffset %>" <% }; if(options.dataHintTitle) { %> data-hint-title="<%= options.dataHintTitle %>" <% }; %> >', '<% if (!_.isEmpty(iconCls)) { %>', '', '<% } else if (!_.isEmpty(iconImg)) { %>', diff --git a/apps/common/main/lib/view/DocumentPropertyDialog.js b/apps/common/main/lib/view/DocumentPropertyDialog.js index 9768508def..350c5ed946 100644 --- a/apps/common/main/lib/view/DocumentPropertyDialog.js +++ b/apps/common/main/lib/view/DocumentPropertyDialog.js @@ -46,16 +46,16 @@ define([], function () { 'use strict'; }, options); this.template = [ - '
', - '
', + '
', + '
', '', '
', '
', - '
', + '
', '', '
', '
', - '
', + '
', '', '
', '
', diff --git a/apps/common/main/resources/less/common.less b/apps/common/main/resources/less/common.less index 9837109327..14f401ff14 100644 --- a/apps/common/main/resources/less/common.less +++ b/apps/common/main/resources/less/common.less @@ -201,7 +201,6 @@ label { background-color: @background-toolbar; display: flex; flex-direction: column; - gap: 4px; padding: 15px 0 24px; .rtl & { @@ -222,6 +221,7 @@ label { list-style: none; position: relative; flex-shrink: 0; + margin-bottom: 4px; &.fm-btn { height: 28px; @@ -249,7 +249,8 @@ label { } .menu-item-icon { - background-position-x: var(--button-small-active-icon-offset-x, 0); + background-position-x: -20px; + background-position-x: @button-small-active-icon-offset-x; } svg.menu-item-icon { @@ -268,12 +269,12 @@ label { &.devider { .dropdown-menu .divider; margin-top: 10px; - margin-bottom: 10px; + margin-bottom: 14px; } &.devider-small { margin-top: 7px; - margin-bottom: 7px; + margin-bottom: 11px; } &.devider-last { @@ -287,7 +288,8 @@ label { line-height: 20px; position: relative; &:not(:disabled) { - opacity: var(--component-normal-icon-opacity, 0.8); + opacity: 0.8; + opacity: @component-normal-icon-opacity; } } @@ -303,7 +305,6 @@ label { padding:0; display: flex; align-items: center; - gap: 8px; overflow: hidden; text-overflow: ellipsis; font-size: 12px; @@ -317,7 +318,11 @@ label { outline: 0; } - &:not(:has(.menu-item-icon)) { + .menu-item-icon { + .margin-right-8(); + } + + &[data-no-icon] { .padding-left-28(); } } diff --git a/apps/documenteditor/main/app/view/FileMenuPanels.js b/apps/documenteditor/main/app/view/FileMenuPanels.js index 662815d94c..5bb413f064 100644 --- a/apps/documenteditor/main/app/view/FileMenuPanels.js +++ b/apps/documenteditor/main/app/view/FileMenuPanels.js @@ -1457,19 +1457,17 @@ define([], function () { '
', '', '', - '', - '
', - '', - '', + '', + '', '', '', '', - '
', - '', + '', '
', - '
', + '', + '' ].join('')); this.infoObj = {PageCount: 0, WordsCount: 0, ParagraphCount: 0, SymbolsCount: 0, SymbolsWSCount:0}; diff --git a/apps/documenteditor/main/resources/less/filemenu.less b/apps/documenteditor/main/resources/less/filemenu.less index 2140e89c37..74aaff3a17 100644 --- a/apps/documenteditor/main/resources/less/filemenu.less +++ b/apps/documenteditor/main/resources/less/filemenu.less @@ -194,13 +194,7 @@ #panel-info { #file-menu-panel & { - padding: 30px; - - .flex-settings { - gap: 30px; - display: flex; - flex-direction: column; - } + padding: 0 30px; } .header { @@ -209,14 +203,17 @@ line-height: unset; } + table.main { + margin: 30px 0 18px; + } + table { display: flex; - gap: 24px; flex-direction: column; tr { display: flex; - gap: 24px; + margin-bottom: 12px; td { .font-size-normal(); @@ -232,8 +229,10 @@ } &.left { + display: block; width: 140px; flex-shrink: 0; + .margin-right(24px); } &.right { @@ -248,14 +247,17 @@ tbody { display: flex; - gap: 12px; flex-direction: column; + &:not(:last-of-type) { + margin-bottom: 12px; + } + &.properties-tab { - gap: 10px; + margin-bottom: 0; tr { - gap: 20px; + margin-bottom: 10px; } td { @@ -265,6 +267,7 @@ td.left { display: flex; align-items: center; + .margin-right-20(); label { text-overflow: ellipsis; @@ -284,8 +287,10 @@ } display: flex; - gap: 5px; align-items: center; + & > *:not(:last-child) { + .margin-right-5(); + } } } @@ -312,15 +317,17 @@ height: 24px; span { - text-decoration: underline dotted; - text-underline-offset: 4px; + border-bottom: 1px dotted currentColor; + padding-bottom: 2px; } } .custom-property-wrapper { display: flex; - gap: 5px; align-items: center; + & > *:not(:last-child) { + .margin-right-5(); + } } .tool.close:before, .tool.close:after { diff --git a/apps/pdfeditor/main/app/view/FileMenuPanels.js b/apps/pdfeditor/main/app/view/FileMenuPanels.js index 0b89c8d38f..3ddc4e72f8 100644 --- a/apps/pdfeditor/main/app/view/FileMenuPanels.js +++ b/apps/pdfeditor/main/app/view/FileMenuPanels.js @@ -1234,20 +1234,18 @@ define([], function () { '', '', '', + '', + '', + '', + '', + '', + '', // '', // '', // '', // '', '', '
', - '
', - '', - '', - '', - '', - '', - '
', - '
' ].join('')); this.infoObj = {PageCount: 0, WordsCount: 0, ParagraphCount: 0, SymbolsCount: 0, SymbolsWSCount:0}; diff --git a/apps/pdfeditor/main/resources/less/filemenu.less b/apps/pdfeditor/main/resources/less/filemenu.less index 987d7db15e..6e5ad738f3 100644 --- a/apps/pdfeditor/main/resources/less/filemenu.less +++ b/apps/pdfeditor/main/resources/less/filemenu.less @@ -520,13 +520,7 @@ #panel-info { #file-menu-panel & { - padding: 30px; - - .flex-settings { - gap: 30px; - display: flex; - flex-direction: column; - } + padding: 0 30px; } .header { @@ -535,14 +529,17 @@ line-height: unset; } + table.main { + margin: 30px 0 18px; + } + table { display: flex; - gap: 24px; flex-direction: column; tr { display: flex; - gap: 24px; + margin-bottom: 12px; td { .font-size-normal(); @@ -558,8 +555,10 @@ } &.left { + display: block; width: 140px; flex-shrink: 0; + .margin-right(24px); } &.right { @@ -574,14 +573,92 @@ tbody { display: flex; - gap: 12px; flex-direction: column; + + &:not(:last-of-type) { + margin-bottom: 12px; + } + + &.properties-tab { + margin-bottom: 0; + + tr { + margin-bottom: 10px; + } + + td { + height: unset; + } + + td.left { + display: flex; + align-items: center; + .margin-right-20(); + + label { + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + } + } + } + + tr.author-info { + align-items: flex-start; + + td { + &.left { + height: 22px; + } + + display: flex; + align-items: center; + & > *:not(:last-child) { + .margin-right-5(); + } + } + } + + .author-info tbody tr:last-child { + margin-bottom: 20px; } &.main { width: 100%; } } + + #fms-flex-add-property { + margin-top: 10px; + td { + height: unset; + } + } + + #fminfo-btn-add-property { + padding: 0; + border: 0; + background-color: transparent; + height: 24px; + + span { + border-bottom: 1px dotted currentColor; + padding-bottom: 2px; + } + } + + .custom-property-wrapper { + display: flex; + align-items: center; + & > *:not(:last-child) { + .margin-right-5(); + } + } + + .tool.close:before, .tool.close:after { + margin-top: 2px; + } } #panel-rights { diff --git a/apps/presentationeditor/main/app/view/FileMenuPanels.js b/apps/presentationeditor/main/app/view/FileMenuPanels.js index 5271bcaa7d..6129947ebc 100644 --- a/apps/presentationeditor/main/app/view/FileMenuPanels.js +++ b/apps/presentationeditor/main/app/view/FileMenuPanels.js @@ -1157,17 +1157,17 @@ define([], function () { '
', '', '', + '', + '', + '', + '', + '', + '', + '', + '', '', - '
', - '', - '', - '', - '', - '', - '
', - '', - '
', - '
' ].join('')); this.menu = options.menu; diff --git a/apps/presentationeditor/main/resources/less/leftmenu.less b/apps/presentationeditor/main/resources/less/leftmenu.less index c3344a1269..acf0ca8e09 100644 --- a/apps/presentationeditor/main/resources/less/leftmenu.less +++ b/apps/presentationeditor/main/resources/less/leftmenu.less @@ -512,7 +512,7 @@ } #panel-info { - padding: 30px; + padding: 0 30px; .header { .font-size-very-huge(); @@ -520,14 +520,17 @@ line-height: unset; } + table.main { + margin: 30px 0 18px; + } + table { display: flex; - gap: 24px; flex-direction: column; tr { display: flex; - gap: 24px; + margin-bottom: 12px; td { .font-size-normal(); @@ -543,8 +546,10 @@ } &.left { + display: block; width: 140px; flex-shrink: 0; + .margin-right(24px); } &.right { @@ -559,14 +564,17 @@ tbody { display: flex; - gap: 12px; flex-direction: column; + &:not(:last-of-type) { + margin-bottom: 12px; + } + &.properties-tab { - gap: 10px; + margin-bottom: 0; tr { - gap: 20px; + margin-bottom: 10px; } td { @@ -576,6 +584,7 @@ td.left { display: flex; align-items: center; + .margin-right-20(); label { text-overflow: ellipsis; @@ -595,8 +604,10 @@ } display: flex; - gap: 5px; align-items: center; + & > *:not(:last-child) { + .margin-right-5(); + } } } @@ -623,15 +634,17 @@ height: 24px; span { - text-decoration: underline dotted; - text-underline-offset: 4px; + border-bottom: 1px dotted currentColor; + padding-bottom: 2px; } } .custom-property-wrapper { display: flex; - gap: 5px; align-items: center; + & > *:not(:last-child) { + .margin-right-5(); + } } .tool.close:before, .tool.close:after { diff --git a/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js b/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js index c29c46a4d4..e1b4418cee 100644 --- a/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js +++ b/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js @@ -1628,6 +1628,7 @@ define([], function () { '', '', '', + '', '', '', '', @@ -1674,17 +1675,17 @@ define([], function () { '
', '', '', - '', - '
', - '', - '', + '', + '', '', '', '', - '
', - '', + '', '
', - '
', + '', + '', ].join('')); this.menu = options.menu; diff --git a/apps/spreadsheeteditor/main/resources/less/leftmenu.less b/apps/spreadsheeteditor/main/resources/less/leftmenu.less index e873bb21c3..01e12a4288 100644 --- a/apps/spreadsheeteditor/main/resources/less/leftmenu.less +++ b/apps/spreadsheeteditor/main/resources/less/leftmenu.less @@ -181,7 +181,7 @@ } #panel-info { - padding: 30px; + padding: 0 30px; .header { .font-size-very-huge(); @@ -189,14 +189,17 @@ line-height: unset; } + table.main { + margin: 30px 0 18px; + } + table { display: flex; - gap: 24px; flex-direction: column; tr { display: flex; - gap: 24px; + margin-bottom: 12px; td { .font-size-normal(); @@ -212,8 +215,10 @@ } &.left { + display: block; width: 140px; flex-shrink: 0; + .margin-right(24px); } &.right { @@ -228,14 +233,17 @@ tbody { display: flex; - gap: 12px; flex-direction: column; + &:not(:last-of-type) { + margin-bottom: 12px; + } + &.properties-tab { - gap: 10px; + margin-bottom: 0; tr { - gap: 20px; + margin-bottom: 10px; } td { @@ -245,6 +253,7 @@ td.left { display: flex; align-items: center; + .margin-right-20(); label { text-overflow: ellipsis; @@ -264,8 +273,10 @@ } display: flex; - gap: 5px; align-items: center; + & > *:not(:last-child) { + .margin-right-5(); + } } } @@ -292,15 +303,17 @@ height: 24px; span { - text-decoration: underline dotted; - text-underline-offset: 4px; + border-bottom: 1px dotted currentColor; + padding-bottom: 2px; } } .custom-property-wrapper { display: flex; - gap: 5px; align-items: center; + & > *:not(:last-child) { + .margin-right-5(); + } } .tool.close:before, .tool.close:after {