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

[FIX] web_editor: properly apply table padding to columns

Browse Source 
When converting bootstrap grids into tables, we have to move the
containers' paddings into the cells, otherwise they would not render
properly in all mail clients. Before this fix, verical padding was moved
to each cell, which is wrong: it should be applied to the first (top)
and last cell (bottom) only, which it now is.

X-original-commit: 43112d417f70ac0086fbed2a704f208530d31f87
Part-of: odoo/odoo#80621
This commit is contained in:
Antoine Guenet
2021-12-08 09:35:00 +00:00
parent 23df5ab4ed
commit 54a0b8d853
1 changed files with 16 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/backend/convert_inline.js
+16 -5
View File
@@ -649,20 +649,31 @@ function formatTables($editable) {
const tablePaddingRight = +$table.css('padding-right').match(rePadding)[1];
const tablePaddingBottom = +$table.css('padding-bottom').match(rePadding)[1];
const tablePaddingLeft = +$table.css('padding-left').match(rePadding)[1];
for (const column of $table.find('td').filter((i, td) => $(td).closest('table').is($table))) {
const $columns = $table.find('td').filter((i, td) => $(td).closest('table').is($table));
let columnIndex = 0;
for (const column of $columns) {
const $column = $(column);
if ($column.css('padding')) {
const columnPaddingTop = +$column.css('padding-top').match(rePadding)[1];
const columnPaddingRight = +$column.css('padding-right').match(rePadding)[1];
const columnPaddingBottom = +$column.css('padding-bottom').match(rePadding)[1];
const columnPaddingLeft = +$column.css('padding-left').match(rePadding)[1];
$column.css({
'padding-top': columnPaddingTop + tablePaddingTop,
'padding-right': columnPaddingRight + tablePaddingRight,
'padding-bottom': columnPaddingBottom + tablePaddingBottom,
'padding-left': columnPaddingLeft + tablePaddingLeft,
});
if (!columnIndex) {
const columnPaddingTop = +$column.css('padding-top').match(rePadding)[1];
$column.css({
'padding-top': columnPaddingTop + tablePaddingTop,
});
}
if (columnIndex === $columns.length - 1) {
const columnPaddingBottom = +$column.css('padding-bottom').match(rePadding)[1];
$column.css({
'padding-bottom': columnPaddingBottom + tablePaddingBottom,
});
}
}
columnIndex += 1;
}
$table.css('padding', '');
}