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

[DE] Fix svg icon for chart type

Browse source
This commit is contained in:
Julia Radzhabova 2020-05-06 17:17:03 +03:00
parent a939187601
commit fd5c8d5f79
4 changed files with 22 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
apps/common/main/lib/component/Button.js
View file

@ -646,8 +646,14 @@ define([
oldCls = this.iconCls; oldCls = this.iconCls;
this.iconCls = cls; this.iconCls = cls;
btnIconEl.removeClass(oldCls); if (/svgicon/.test(this.iconCls)) {
btnIconEl.addClass(cls || ''); var icon = /svgicon\s(\S+)/.exec(this.iconCls);
btnIconEl.find('use.zoom-int').attr('xlink:href', icon && icon.length>1 ? '#' + icon[1]: '');
btnIconEl.find('use.zoom-grit').attr('xlink:href', icon && icon.length>1 ? '#' + icon[1] + '-150' : '');
} else {
btnIconEl.removeClass(oldCls);
btnIconEl.addClass(cls || '');
}
}, },
changeIcon: function(opts) { changeIcon: function(opts) {

6
apps/common/main/resources/less/buttons.less
View file

@ -777,6 +777,12 @@
position: relative; position: relative;
} }
svg.icon {
vertical-align: middle;
width: 52px;
padding: 5px;
}
&:hover, &:hover,
.over, .over,
&:active, &:active,

14
apps/documenteditor/main/app/view/ChartSettings.js
View file

@ -136,17 +136,17 @@ define([
value = props.get_SeveralChartTypes(); value = props.get_SeveralChartTypes();
if (this._state.SeveralCharts && value) { if (this._state.SeveralCharts && value) {
// this.btnChartType.setIconCls(''); this.btnChartType.setIconCls('svgicon');
this._state.ChartType = null; this._state.ChartType = null;
} else { } else {
var type = this.chartProps.getType(); var type = this.chartProps.getType();
if (this._state.ChartType !== type) { if (this._state.ChartType !== type) {
var record = this.mnuChartTypePicker.store.findWhere({type: type}); var record = this.mnuChartTypePicker.store.findWhere({type: type});
this.mnuChartTypePicker.selectRecord(record, true); this.mnuChartTypePicker.selectRecord(record, true);
// if (record) { if (record) {
// this.btnChartType.setIconCls('item-chartlist ' + record.get('iconCls')); this.btnChartType.setIconCls('svgicon ' + 'chart-' + record.get('iconCls'));
// } else } else
// this.btnChartType.setIconCls(''); this.btnChartType.setIconCls('svgicon');
this.updateChartStyles(this.api.asc_getChartPreviews(type)); this.updateChartStyles(this.api.asc_getChartPreviews(type));
this._state.ChartType = type; this._state.ChartType = type;
} }
@ -250,7 +250,7 @@ define([
cls : 'btn-large-dataview', cls : 'btn-large-dataview',
iconCls : 'svgicon chart-column-normal', iconCls : 'svgicon chart-column-normal',
menu : new Common.UI.Menu({ menu : new Common.UI.Menu({
style: 'width: 435px; padding-top: 12px;', style: 'width: 364px; padding-top: 12px;',
items: [ items: [
{ template: _.template('<div id="id-chart-menu-type" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>') } { template: _.template('<div id="id-chart-menu-type" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>') }
] ]
@ -386,7 +386,7 @@ define([
rawData = record; rawData = record;
} }
// this.btnChartType.setIconCls('item-chartlist ' + rawData.iconCls); this.btnChartType.setIconCls('svgicon ' + 'chart-' + rawData.iconCls);
this._state.ChartType = -1; this._state.ChartType = -1;
if (this.api && !this._noApply && this.chartProps) { if (this.api && !this._noApply && this.chartProps) {

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

@ -1662,7 +1662,7 @@ define([
this.paragraphControls.push(this.mnuInsertPageCount); this.paragraphControls.push(this.mnuInsertPageCount);
this.btnInsertChart.setMenu( new Common.UI.Menu({ this.btnInsertChart.setMenu( new Common.UI.Menu({
style: 'width: 435px;', style: 'width: 364px;',
items: [ items: [
{template: _.template('<div id="id-toolbar-menu-insertchart" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>')} {template: _.template('<div id="id-toolbar-menu-insertchart" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>')}
] ]