Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Change layout for color palette

Browse source
This commit is contained in:
Julia Radzhabova 2022-04-22 21:34:30 +03:00
parent 0c09154162
commit 4f85426deb
10 changed files with 23 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
apps/common/main/lib/component/ColorButton.js
View file

@ -80,7 +80,7 @@ define([
getMenu: function(options) { getMenu: function(options) {
if (typeof this.menu !== 'object') { if (typeof this.menu !== 'object') {
options = options || this.options; options = options || this.options;
var height = options.paletteHeight || 240, var height = options.paletteHeight ? options.paletteHeight + 'px' : 'auto',
id = Common.UI.getId(), id = Common.UI.getId(),
auto = []; auto = [];
if (options.auto) { if (options.auto) {
@ -98,7 +98,8 @@ define([
cls: 'shifted-left', cls: 'shifted-left',
additionalAlign: options.additionalAlign, additionalAlign: options.additionalAlign,
items: (options.additionalItems ? options.additionalItems : []).concat(auto).concat([ items: (options.additionalItems ? options.additionalItems : []).concat(auto).concat([
{ template: _.template('<div id="' + id + '-color-menu" style="width: 169px; height:' + height + 'px; margin: 10px;"></div>') }, { template: _.template('<div id="' + id + '-color-menu" style="width: 169px; height:' + height + '; margin: 10px;display: inline-block;"></div>') },
{caption: '--'},
{ {
id: id + '-color-new', id: id + '-color-new',
template: _.template('<a tabindex="-1" type="menuitem" style="">' + this.textNewColor + '</a>') template: _.template('<a tabindex="-1" type="menuitem" style="">' + this.textNewColor + '</a>')

19
apps/common/main/lib/component/ThemeColorPalette.js
View file

@ -62,7 +62,7 @@ define([
template : template :
_.template( _.template(
'<div style="padding: 8px 12px 12px;">' + '<div style="padding: 4px 12px 12px;">' +
'<% var me = this; var idx = 0; %>' + '<% var me = this; var idx = 0; %>' +
'<% $(colors).each(function(num, item) { %>' + '<% $(colors).each(function(num, item) { %>' +
'<% if (me.isBlankSeparator(item)) { %> <div class="palette-color-spacer" style="width:100%;height:8px;float:left;"></div>' + '<% if (me.isBlankSeparator(item)) { %> <div class="palette-color-spacer" style="width:100%;height:8px;float:left;"></div>' +
@ -85,7 +85,9 @@ define([
'<% }); %>' + '<% }); %>' +
'</div>' + '</div>' +
'<% if (me.options.dynamiccolors!==undefined) { %>' + '<% if (me.options.dynamiccolors!==undefined) { %>' +
'<div class="palette-color-spacer" style="width:100%;height:8px;float:left;"></div><div style="padding: 12px;">' + '<div style="padding: 12px;">' +
'<div class="palette-color-spacer" style="width:100%;height:8px;float:left;"></div>' +
'<div class="palette-color-caption" style="width:100%;float:left;font-size: 11px;"><%=me.textRecentColors%></div>' +
'<% for (var i=0; i<me.options.dynamiccolors; i++) { %>' + '<% for (var i=0; i<me.options.dynamiccolors; i++) { %>' +
'<a class="color-dynamic-<%=i%> dynamic-empty-color" color="" idx="<%=idx++%>">' + '<a class="color-dynamic-<%=i%> dynamic-empty-color" color="" idx="<%=idx++%>">' +
'<em><span unselectable="on">&#160;</span></em></a>' + '<em><span unselectable="on">&#160;</span></em></a>' +
@ -483,7 +485,7 @@ define([
var arr = [], var arr = [],
len = (themecolors>0 && effects>0) ? themecolors * effects : 0; len = (themecolors>0 && effects>0) ? themecolors * effects : 0;
if (themecolors>0) { if (themecolors>0) {
arr = [this.textThemeColors, '-']; arr = [this.textThemeColors];
for (var i=0; i<themecolors; i++) for (var i=0; i<themecolors; i++)
arr.push({color: 'FFFFFF', effectId: 1}); arr.push({color: 'FFFFFF', effectId: 1});
@ -492,10 +494,10 @@ define([
arr.push({color: 'FFFFFF', effectId: 1}); arr.push({color: 'FFFFFF', effectId: 1});
if (standardcolors) if (standardcolors)
arr.push('-', '--', '-'); arr.push('-');
} }
if (standardcolors) { if (standardcolors) {
arr.push(this.textStandartColors, '-'); arr.push(this.textStandartColors);
if (transparent) { if (transparent) {
arr.push('transparent'); arr.push('transparent');
standardcolors--; standardcolors--;
@ -503,8 +505,8 @@ define([
for (var i=0; i<standardcolors; i++) for (var i=0; i<standardcolors; i++)
arr.push('FFFFFF'); arr.push('FFFFFF');
} }
if (this.options.dynamiccolors && (themecolors || standardcolors)) // if (this.options.dynamiccolors && (themecolors || standardcolors))
arr.push('-', '--'); // arr.push('-', '--');
return arr; return arr;
}, },
@ -640,6 +642,7 @@ define([
}, },
textThemeColors : 'Theme Colors', textThemeColors : 'Theme Colors',
textStandartColors : 'Standart Colors' textStandartColors : 'Standard Colors',
textRecentColors : 'Recent Colors'
}, Common.UI.ThemeColorPalette || {})); }, Common.UI.ThemeColorPalette || {}));
}); });

1
apps/common/main/resources/less/dropdown-menu.less
View file

@ -159,6 +159,7 @@
height: @scaled-one-px-value; height: @scaled-one-px-value;
background-color: @border-divider-ie; background-color: @border-divider-ie;
background-color: @border-divider; background-color: @border-divider;
margin: 4px 0;
} }
.dataview { .dataview {

1
apps/documenteditor/main/app/view/ControlSettingsDialog.js
View file

@ -141,7 +141,6 @@ define([ 'text!documenteditor/main/app/template/ControlSettingsDialog.template',
'33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', '33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF',
'993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', 'C9C8FF', 'CC99FF', 'FFFFFF' '993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', 'C9C8FF', 'CC99FF', 'FFFFFF'
], ],
paletteHeight: 94,
cls: 'move-focus', cls: 'move-focus',
takeFocusOnClose: true takeFocusOnClose: true
}); });

1
apps/documenteditor/main/app/view/FormSettings.js
View file

@ -1150,7 +1150,6 @@ define([
'33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', '33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF',
'993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', 'C9C8FF', 'CC99FF', 'FFFFFF' '993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', 'C9C8FF', 'CC99FF', 'FFFFFF'
], ],
paletteHeight: 94,
dataHint: '1', dataHint: '1',
dataHintDirection: 'bottom', dataHintDirection: 'bottom',
dataHintOffset: 'big' dataHintOffset: 'big'

1
apps/documenteditor/main/app/view/FormsTab.js
View file

@ -258,7 +258,6 @@ define([
'33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', '33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF',
'993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', 'C9C8FF', 'CC99FF', 'FFFFFF' '993366', 'C0C0C0', 'FF99CC', 'FFCC99', 'FFFF99', 'CCFFCC', 'CCFFFF', 'C9C8FF', 'CC99FF', 'FFFFFF'
], ],
paletteHeight: 94,
dataHint: '1', dataHint: '1',
dataHintDirection: 'left', dataHintDirection: 'left',
dataHintOffset: 'small' dataHintOffset: 'small'

3
apps/documenteditor/main/app/view/Toolbar.js
View file

@ -898,7 +898,8 @@ define([
checkable: true checkable: true
}), }),
{caption: '--'}, {caption: '--'},
{template: _.template('<div id="id-toolbar-menu-controls-color" style="width: 169px; height: 94px; margin: 10px;"></div>')}, {template: _.template('<div id="id-toolbar-menu-controls-color" style="width: 169px; margin: 10px;display: inline-block;"></div>')},
{caption: '--'},
{ {
id: 'id-toolbar-menu-new-control-color', id: 'id-toolbar-menu-new-control-color',
template: _.template('<a tabindex="-1" type="menuitem" style="padding-left:12px;">' + this.textNewColor + '</a>') template: _.template('<a tabindex="-1" type="menuitem" style="padding-left:12px;">' + this.textNewColor + '</a>')

3
apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js
View file

@ -531,7 +531,8 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesEditDlg.template',
menu : new Common.UI.Menu({ menu : new Common.UI.Menu({
menuAlign : 'tl-tr', menuAlign : 'tl-tr',
items : [ items : [
{ template: _.template('<div id="format-rules-borders-menu-bordercolor" style="width: 169px; height: 220px; margin: 10px;"></div>'), stopPropagation: true }, { template: _.template('<div id="format-rules-borders-menu-bordercolor" style="width: 169px; margin: 10px;display: inline-block;"></div>'), stopPropagation: true },
{caption: '--'},
{ template: _.template('<a id="format-rules-borders-menu-new-bordercolor" style="padding-left:12px;">' + this.textNewColor + '</a>'), stopPropagation: true } { template: _.template('<a id="format-rules-borders-menu-new-bordercolor" style="padding-left:12px;">' + this.textNewColor + '</a>'), stopPropagation: true }
] ]
}) })

3
apps/spreadsheeteditor/main/app/view/Statusbar.js
View file

@ -335,7 +335,8 @@ define([
menuAlign: 'tl-tr', menuAlign: 'tl-tr',
cls: 'color-tab', cls: 'color-tab',
items: [ items: [
{ template: _.template('<div id="id-tab-menu-color" style="width: 169px; height: 240px;"></div>') }, { template: _.template('<div id="id-tab-menu-color" style="width: 169px;display: inline-block;"></div>') },
{caption: '--'},
{ template: _.template('<a id="id-tab-menu-new-color" style="padding-left:12px;">' + me.textNewColor + '</a>') } { template: _.template('<a id="id-tab-menu-new-color" style="padding-left:12px;">' + me.textNewColor + '</a>') }
] ]
}); });

3
apps/spreadsheeteditor/main/app/view/Toolbar.js
View file

@ -2120,7 +2120,8 @@ define([
stopPropagation: true stopPropagation: true
}, },
{caption: '--'}, {caption: '--'},
{ template: _.template('<div id="id-toolbar-menu-bordercolor" style="width: 169px; height: 240px;"></div>'), stopPropagation: true }, { template: _.template('<div id="id-toolbar-menu-bordercolor" style="width: 169px;display: inline-block;"></div>'), stopPropagation: true },
{caption: '--'},
{ template: _.template('<a id="id-toolbar-menu-new-bordercolor" style="padding-left:12px;">' + this.textNewColor + '</a>'), stopPropagation: true } { template: _.template('<a id="id-toolbar-menu-new-bordercolor" style="padding-left:12px;">' + this.textNewColor + '</a>'), stopPropagation: true }
] ]
}) })