Change layout for color palette

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

View file

@ -80,7 +80,7 @@ define([
getMenu: function(options) {
if (typeof this.menu !== 'object') {
options = options || this.options;
var height = options.paletteHeight || 240,
var height = options.paletteHeight ? options.paletteHeight + 'px' : 'auto',
id = Common.UI.getId(),
auto = [];
if (options.auto) {
@ -98,7 +98,8 @@ define([
cls: 'shifted-left',
additionalAlign: options.additionalAlign,
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',
template: _.template('<a tabindex="-1" type="menuitem" style="">' + this.textNewColor + '</a>')

View file

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

View file

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

View file

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

View file

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

View file

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

View file

@ -898,7 +898,8 @@ define([
checkable: true
}),
{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',
template: _.template('<a tabindex="-1" type="menuitem" style="padding-left:12px;">' + this.textNewColor + '</a>')

View file

@ -531,7 +531,8 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesEditDlg.template',
menu : new Common.UI.Menu({
menuAlign : 'tl-tr',
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 }
]
})

View file

@ -335,7 +335,8 @@ define([
menuAlign: 'tl-tr',
cls: 'color-tab',
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>') }
]
});

View file

@ -2120,7 +2120,8 @@ define([
stopPropagation: true
},
{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 }
]
})