From 89c93aba75a9c4d7e304c4decd4d5d3673d4df08 Mon Sep 17 00:00:00 2001
From: Benoit Socias <bso@odoo.com>
Date: Tue, 22 Aug 2023 15:17:53 +0200
Subject: [PATCH] [FIX] website: remove "rem" unit from body line height theme
 option

Since [1] the line height is specified as an absolute height instead of
a ratio of the font size. This leads to multiline text with big font
sizes to overlap.

This commit removes the `rem` unit from the `body-line-height` primary
SCSS variable.

Steps to reproduce:
- Drop a text snippet.
- Select a paragraph.
- Change font size to 62.

=> Lines of paragraph did overlap.

In case the value had been edited before this fix, it will be shown
with the "rem" text within the option, which can be removed to update
the value to the correct behavior.

[1]: https://github.com/odoo/odoo/commit/388e4bb2bfcaebdd4ff30277fb49a034592d7086

task-3471117

closes odoo/odoo#133401

X-original-commit: a368dad33d128c95262053769e3f5de852d2be3a
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Signed-off-by: Benoit Socias (bso) <bso@odoo.com>
---
 .../website/static/src/js/editor/snippets.editor.js   | 11 +++++++++++
 addons/website/static/src/scss/primary_variables.scss |  2 +-
 addons/website/views/snippets/snippets.xml            |  4 +---
 3 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/addons/website/static/src/js/editor/snippets.editor.js b/addons/website/static/src/js/editor/snippets.editor.js
index 9ea5ededccf..42464025cbf 100644
--- a/addons/website/static/src/js/editor/snippets.editor.js
+++ b/addons/website/static/src/js/editor/snippets.editor.js
@@ -82,6 +82,17 @@ const wSnippetMenu = weSnippetEditor.SnippetsMenu.extend({
         FontFamilyPickerUserValueWidget.prototype.fontVariables = fontVariables;
         return this._super(...arguments);
     },
+    /**
+     * @override
+     */
+    _patchForComputeSnippetTemplates($html) {
+        // TODO Remove in master.
+        const themeBodyLineHeightEl = $html.find(
+            "[data-selector='theme-paragraph'] we-input[data-customize-website-variable][data-variable='body-line-height']"
+        )[0];
+        delete themeBodyLineHeightEl.dataset.unit;
+        delete themeBodyLineHeightEl.dataset.saveUnit;
+    },
     /**
      * Depending of the demand, reconfigure they gmap key or configure it
      * if not already defined.
diff --git a/addons/website/static/src/scss/primary_variables.scss b/addons/website/static/src/scss/primary_variables.scss
index 510d29203dd..f3c4156e355 100644
--- a/addons/website/static/src/scss/primary_variables.scss
+++ b/addons/website/static/src/scss/primary_variables.scss
@@ -1954,7 +1954,7 @@ $o-selected-color-palettes-names: (
 
 $o-base-website-values-palette: (
     'font-size-base': 1rem, // Need a set value as the value is used in bootstrap_overridden files
-    'body-line-height': 1.5rem,
+    'body-line-height': 1.5,
     'headings-line-height': 1.2,
     'paragraph-margin-top': 0,
     'paragraph-margin-bottom': 16px,
diff --git a/addons/website/views/snippets/snippets.xml b/addons/website/views/snippets/snippets.xml
index 5373b5b4e63..ad5a5a0bd65 100644
--- a/addons/website/views/snippets/snippets.xml
+++ b/addons/website/views/snippets/snippets.xml
@@ -1557,9 +1557,7 @@
         <we-input string="Line height"
                   data-customize-website-variable="null"
                   data-variable="body-line-height"
-                  data-fake-unit="× "
-                  data-unit="rem"
-                  data-save-unit="rem"/>
+                  data-fake-unit="× "/>
         <we-row string="Margins">
             <we-input title="Top" data-customize-website-variable="" data-variable="paragraph-margin-top" data-unit="px" data-save-unit="px"/>
             <we-input title="Bottom" data-customize-website-variable="" data-variable="paragraph-margin-bottom" data-unit="px" data-save-unit="px"/>