[IMP] mass_mailing: blockquote snippet improved
Removed unnecessary classes and placed necessary styles as inline styles for better support by the builder. Removed options.js which allows to change the blockquote's style as in the web editor, but none of the other options is well supported in emails. Due to this change, the blockquote's cover image is removed. Changes to text done via the Design tab in the builder weren't being applied to text inside `<span>`, so this has been changed to a `<p>` element in order for the changes to be applied. Part-of: odoo/odoo#95940
This commit is contained in:
committed by
David Monjoie
parent
7eda17fd4d
commit
9c7264fb48
@@ -118,7 +118,6 @@
|
||||
'mass_mailing/static/tests/field_html_test.js',
|
||||
'mass_mailing/static/tests/mass_mailing_favourite_filter_tests.js',
|
||||
'mass_mailing/static/src/js/mass_mailing_snippets.js',
|
||||
'mass_mailing/static/src/snippets/s_blockquote/options.js',
|
||||
'mass_mailing/static/src/snippets/s_media_list/options.js',
|
||||
'mass_mailing/static/src/snippets/s_showcase/options.js',
|
||||
'mass_mailing/static/src/snippets/s_rating/options.js',
|
||||
|
||||
@@ -128,12 +128,6 @@
|
||||
<field name="type">url</field>
|
||||
<field name="url">/mass_mailing/static/src/img/snippets_demo/s_team_member_2.png</field>
|
||||
</record>
|
||||
<record id="mass_mailing.s_blockquote_cover_default_image" model="ir.attachment">
|
||||
<field name="public" eval="True"/>
|
||||
<field name="name">s_blockquote_cover_default_image.jpg</field>
|
||||
<field name="type">url</field>
|
||||
<field name="url">/mass_mailing/static/src/img/snippets_demo/s_blockquote_cover.jpg</field>
|
||||
</record>
|
||||
<record id="mass_mailing.s_image_text_default_image" model="ir.attachment">
|
||||
<field name="public" eval="True"/>
|
||||
<field name="name">s_image_text_default_image.jpg</field>
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 51 KiB |
@@ -16,7 +16,6 @@ var MassMailingFieldHtml = FieldHtml.extend({
|
||||
jsLibs: [
|
||||
'/mass_mailing/static/src/js/mass_mailing_link_dialog_fix.js',
|
||||
'/mass_mailing/static/src/js/mass_mailing_snippets.js',
|
||||
'/mass_mailing/static/src/snippets/s_blockquote/options.js',
|
||||
'/mass_mailing/static/src/snippets/s_masonry_block/options.js',
|
||||
'/mass_mailing/static/src/snippets/s_media_list/options.js',
|
||||
'/mass_mailing/static/src/snippets/s_showcase/options.js',
|
||||
|
||||
@@ -1,45 +0,0 @@
|
||||
odoo.define('mass_mailing.s_blockquote_options', function (require) {
|
||||
'use strict';
|
||||
|
||||
const options = require('web_editor.snippets.options');
|
||||
|
||||
options.registry.Blockquote = options.Class.extend({
|
||||
|
||||
//--------------------------------------------------------------------------
|
||||
// Options
|
||||
//--------------------------------------------------------------------------
|
||||
|
||||
/**
|
||||
* Change blockquote design.
|
||||
*
|
||||
* @see this.selectClass for parameters
|
||||
*/
|
||||
display: function (previewMode, widgetValue, params) {
|
||||
|
||||
// Classic
|
||||
this.$target.find('.s_blockquote_avatar').toggleClass('d-none', widgetValue !== 'classic');
|
||||
|
||||
// Cover
|
||||
const $blockquote = this.$target.find('.s_blockquote_content');
|
||||
if (widgetValue === 'cover') {
|
||||
$blockquote.css({"background-image": "url('/web/image/mass_mailing.s_blockquote_cover_default_image')"});
|
||||
$blockquote.addClass('oe_img_bg o_bg_img_center');
|
||||
if (!$blockquote.find('.o_we_bg_filter').length) {
|
||||
const bgFilterEl = document.createElement('div');
|
||||
bgFilterEl.classList.add('o_we_bg_filter', 'bg-white-50');
|
||||
$blockquote.prepend(bgFilterEl);
|
||||
}
|
||||
} else {
|
||||
$blockquote.css({"background-image": ""});
|
||||
$blockquote.css({"background-position": ""});
|
||||
$blockquote.removeClass('oe_img_bg o_bg_img_center');
|
||||
$blockquote.find('.o_we_bg_filter').remove();
|
||||
$blockquote.find('.s_blockquote_filter').contents().unwrap(); // Compatibility
|
||||
}
|
||||
|
||||
// Minimalist
|
||||
this.$target.find('.s_blockquote_icon').toggleClass('d-none', widgetValue === 'minimalist');
|
||||
this.$target.find('footer').toggleClass('d-none', widgetValue === 'minimalist');
|
||||
},
|
||||
});
|
||||
});
|
||||
@@ -2,23 +2,23 @@
|
||||
<odoo>
|
||||
|
||||
<template id="s_blockquote" name="Blockquote">
|
||||
<div class="s_mail_blockquote o_cc o_cc2 pt16 pb16 o_mail_snippet_general s_blockquote_classic blockquote mb-0" data-snippet="s_blockquote">
|
||||
<div class="s_mail_blockquote blockquote o_mail_snippet_general o_cc o_cc2 pt16 pb16 mb-0 w-100" data-snippet="s_blockquote">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-1 d-flex align-items-start o_mail_no_resize" valign="top" align="right">
|
||||
<i class="s_blockquote_icon fa fa-1x fa-quote-left"/>
|
||||
<div class="col-lg-1 pb80" style="text-align: right;">
|
||||
<i class="fa fa-quote-left"/>
|
||||
</div>
|
||||
<div class="col-lg-10 px-0">
|
||||
<div class="s_blockquote_content">
|
||||
<div class="col-lg-10">
|
||||
<div>
|
||||
<p><i>Write a quote here from one of your customers. Quotes are a great way to build confidence in your products or services.</i></p>
|
||||
<div>
|
||||
<img src="/mass_mailing/static/src/img/theme_default/team_member_2-circle.png" style="width: 40px" class="img me-2" data-original-id="361" data-original-src="/mass_mailing/static/src/img/theme_default/s_default_image_team_member_2.jpg" data-mimetype="image/svg+xml" data-shape="mass_mailing/basic/circle" data-file-name="team_member_2-circle.png" data-shape-colors=";;;;" data-original-mimetype="image/png"/>
|
||||
<span style="font-weight: bolder; font-size: 14px;">John DOE</span><span style="font-size: 14px;"> • CEO of MyCompany</span>
|
||||
<p style="font-weight: bolder; font-size: 14px;"><b>John DOE</b> • CEO of MyCompany</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-1 d-flex align-items-end o_mail_no_resize" valign="bottom" align="left">
|
||||
<i class="s_blockquote_icon fa fa-1x fa-quote-right"/>
|
||||
<div class="col-lg-1 pt80" style="text-align: left;">
|
||||
<i class="fa fa-quote-right"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user