pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] web_editor: handle margin:initial correctly

Browse Source 
The transcoder (which transforms stylesheet rules to inline style) did
some compression of the padding and margin css properties to not always
have margin-top + margin-right + margin-bottom + margin-left.

This could cause an issue when the value of margin or padding contained
an initial or inherit value because browsers (at least firefox and
google chrome) doesn't allow it. Thus the preview could for example have
bigger veritcal spaces arround `<p />` tag than what was seen when
editing.

With this fix instead of invalid:

    margin:initial initial initial initial

we have:

    margin:initial

And instead of invalid:

    margin:initial 5px 6px 7px

we have:

    margin-top: initial; margin-right: 5px; margin-bottom: 6px; margin-left: 7px;

opw-706535
This commit is contained in:
Nicolas Lempereur
2017-03-16 18:26:32 +01:00
parent e542b450a3
commit f50ba68be7
1 changed files with 22 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/transcoder.js
+22 -14
View File
@@ -99,20 +99,28 @@ var getMatchedCSSRules = function (a) {
if (style.display === 'block') {
delete style.display;
}
if (style['margin-top']) {
style.margin = (style['margin-top'] || 0) + ' ' + (style['margin-right'] || 0) + ' ' + (style['margin-bottom'] || 0) + ' ' + (style['margin-left'] || 0);
delete style['margin-top'];
delete style['margin-right'];
delete style['margin-bottom'];
delete style['margin-left'];
}
if (style['padding-top']) {
style.padding = (style['padding-top'] || 0) + ' ' + (style['padding-right'] || 0) + ' ' + (style['padding-bottom'] || 0) + ' ' + (style['padding-left'] || 0);
delete style['padding-top'];
delete style['padding-right'];
delete style['padding-bottom'];
delete style['padding-left'];
}
_.each(['margin', 'padding'], function(p) {
if (style[p+'-top'] || style[p+'-right'] || style[p+'-bottom'] || style[p+'-left']) {
if (style[p+'-top'] === style[p+'-right'] && style[p+'-top'] === style[p+'-bottom'] && style[p+'-top'] === style[p+'-left']) {
// keep => property: [top/right/bottom/left value];
style[p] = style[p+'-top'];
}
else {
// keep => property: [top value] [right value] [bottom value] [left value];
style[p] = (style[p+'-top'] || 0) + ' ' + (style[p+'-right'] || 0) + ' ' + (style[p+'-bottom'] || 0) + ' ' + (style[p+'-left'] || 0);
if (style[p].indexOf('inherit') !== -1 || style[p].indexOf('initial') !== -1) {
// keep => property-top: [top value]; property-right: [right value]; property-bottom: [bottom value]; property-left: [left value];
delete style[p];
return;
}
}
delete style[p+'-top'];
delete style[p+'-right'];
delete style[p+'-bottom'];
delete style[p+'-left'];
}
});
return a.className ? cache[a.tagName + "." +a.className] = style : style;
};