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

[FIX] web_editor: force custom style in ui on non-custom link with style

Browse Source 
This reverts commit [1] so as to avoid updating the DOM in two separate
places of the code for link edition. Said commit intended to prevent the
removal of custom styles on a button on which styles were applied
(erroneously) without applying a custom button class. This fixes that
issue by adapting the UI to show the button is custom if there are
custom styles applied. This way, if any change is applied, when
modifying the DOM, the custom class will be applied as well. This is the
order in which such corrections are usually applied with the snippets
bar.

[1]: https://github.com/odoo/odoo/commit/eb4edac560227b46efdcfe958e3b93e0b88def64

closes odoo/odoo#112152

X-original-commit: 1b65244a1ae7ed37d7bc1faef2225ed982c94320
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
Antoine Guenet
2023-02-08 13:28:05 +01:00
committed by qsm-odoo
parent 0088cb2c6b
commit dd064ab9aa
2 changed files with 18 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/wysiwyg/widgets/link.js
+7
View File
@@ -208,6 +208,13 @@ const Link = Widget.extend({
this.$link.css('border-width', data.customBorderWidth);
this.$link.css('border-style', data.customBorderStyle);
this.$link.css('border-color', data.customBorder);
} else {
this.$link.css('color', '');
this.$link.css('background-color', '');
this.$link.css('background-image', '');
this.$link.css('border-width', '');
this.$link.css('border-style', '');
this.$link.css('border-color', '');
}
const attrs = Object.assign({}, this.data.oldAttributes, {
href: data.url,
addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
+11 -11
View File
@@ -44,9 +44,18 @@ const LinkTools = Link.extend({
/**
* @override
*/
start: function () {
start: async function () {
this._addHintClasses();
return this._super(...arguments);
const ret = await this._super(...arguments);
const link = this.$link[0];
const customStyleProps = ['color', 'background-color', 'background-image', 'border-width', 'border-style', 'border-color'];
if (customStyleProps.some(s => link.style[s])) {
// Force custom style if style exists on the link.
const customOption = this.el.querySelector('[name="link_style_color"] we-button[data-value="custom"]');
this._setSelectOption($(customOption), true);
await this._updateOptionsUI();
}
return ret;
},
destroy: function () {
if (!this.el) {
@@ -381,15 +390,6 @@ const LinkTools = Link.extend({
if ($target.closest('[name="link_border_style"]').length) {
return;
}
if ($target.closest('[name="link_style_color"]')) {
// Reset custom styles when changing link style.
this.$link.css('color', '');
this.$link.css('background-color', '');
this.$link.css('background-image', '');
this.$link.css('border-width', '');
this.$link.css('border-style', '');
this.$link.css('border-color', '');
}
const $select = $target.closest('we-select');
$select.find('we-selection-items we-button').toggleClass('active', false);
this._setSelectOption($target, true);