[FIX] web_editor: properly handle Bootstrap's rows' negative margins

Bootstrap rows have negative left and right margins, which are not
supported by GMail and Outlook. Sometimes we use padding on columns to
undo the negative margins of their child rows. This corrects these.

X-original-commit: dc7c7330b4b7a1c17c3b736aa60c21882a455a31
Part-of: odoo/odoo#124465

addons/web_editor/static/src/js/backend/convert_inline.js

@@ -117,6 +117,7 @@ function attachmentThumbnailToLinkImg($editable) {
 function bootstrapToTable(editable) {
     // First give all rows in columns a separate container parent.
     for (const rowInColumn of [...editable.querySelectorAll('.row')].filter(row => RE_COL_MATCH.test(row.parentElement.className))) {
+        const parentColumn = rowInColumn.parentElement;
         const previous = rowInColumn.previousElementSibling;
         if (previous && previous.classList.contains('o_fake_table')) {
             // If a container was already created there, append to it.
@@ -124,6 +125,19 @@ function bootstrapToTable(editable) {
         } else {
             _wrap(rowInColumn, 'div', 'o_fake_table');
         }
+        // Bootstrap rows have negative left and right margins, which are not
+        // supported by GMail and Outlook. Add up the padding of the column with
+        // the negative margin of the row to get the correct padding.
+        const rowStyle = getComputedStyle(rowInColumn);
+        const columnStyle = getComputedStyle(parentColumn);
+        for (const side of ['left', 'right']) {
+            const negativeMargin = +rowStyle[`margin-${side}`].replace('px', '');
+            const columnPadding = +columnStyle[`padding-${side}`].replace('px', '');
+            if (negativeMargin < 0 && columnPadding >= Math.abs(negativeMargin)) {
+                parentColumn.style[`padding-${side}`] = `${columnPadding + negativeMargin}px`;
+                rowInColumn.style[`margin-${side}`] = 0;
+            }
+        }
     }
 
     // These containers from the mass mailing masonry snippet require full