[IMP] *: replace snippet sections menu by a title
* web_editor, website, mass_mailing This menu allowed to scroll to the snippets sections by clicking on their corresponding icons. It was useless as the sections are not taking a lot of height. This also appeared buggy as clicking on the last icon highlighted only the second one as this second one was still the first section visible on the screen when the last section was fully visible. This also added fours buttons to the interface which contains already a lot of them. Now this is replaced by a title "Add blocks" which makes the editor cleaner and also improved the performance to enter the edit mode.
This commit is contained in:
qsm-odoo
@@ -1,45 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<odoo>
|
||||
<template id="email_designer_snippets" inherit_id="web_editor.snippets" primary="True">
|
||||
<xpath expr="//ul[@id='snippets_menu']" position="replace">
|
||||
<ul id="snippets_menu">
|
||||
<li class="active">
|
||||
<a href="#email_designer_default_headers" class="scroll-link">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-square fa-stack-2x fa-inverse"></i>
|
||||
<i class="fa fa-align-justify fa-stack-1x" style="margin-top: -0.15em; height: 0.9em; display: inline-block; overflow: hidden;"></i>
|
||||
<i class="fa fa-arrow-up fa-stack-1x text-muted" style="margin-top: 0.25em; display: inline-block; font-size: 0.6em;"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#email_designer_default_body" class="scroll-link">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-square fa-stack-2x fa-inverse"></i>
|
||||
<i class="fa fa-align-left fa-stack-1x" style="margin-top: 0.05em;"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#email_designer_default_extra" class="scroll-link">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-square fa-stack-2x fa-inverse"></i>
|
||||
<i class="fa fa-align-left fa-stack-1x" style="display: inline-block; height: 0.93em; margin-top: 0.3em; overflow: hidden;"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#email_designer_default_footer" class="scroll-link">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-square fa-stack-2x fa-inverse"></i>
|
||||
<i class="fa fa-align-justify fa-stack-1x" style=" margin-top: 0.7em; height: 0.9em; display: inline-block; overflow: hidden;"></i>
|
||||
<i class="fa fa-arrow-down fa-stack-1x text-muted" style="display: inline-block; font-size: 0.6em; margin-top: -0.15em;"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</xpath>
|
||||
|
||||
<xpath expr="//div[@id='o_scroll']" position="replace">
|
||||
<div id="o_scroll">
|
||||
<div id="email_designer_default_headers" class="o_panel">
|
||||
@@ -311,7 +272,7 @@
|
||||
<span class="fa fa-check fa-3x"></span>
|
||||
&nbsp;
|
||||
<p style="margin:0;font-size:24px;font-weight:bold">Step 1</p>
|
||||
<p style="margin:0">
|
||||
<p style="margin:0">
|
||||
We need you to update your account information. If there is ever a problem with your account, this information will make it easier for you to log back in.
|
||||
</p>
|
||||
</td>
|
||||
@@ -484,10 +445,10 @@
|
||||
<td valign="middle" align="right" style="font-size:12px;padding:20px;text-align:center">
|
||||
&nbsp;
|
||||
<t t-if="website">
|
||||
<a style="color:inherit" href="/page/contactus">Contact Us</a> |
|
||||
<a style="color:inherit" t-att-href="(website.social_facebook) or '#'">Facebook</a> |
|
||||
<a style="color:inherit" t-att-href="(website.social_twitter) or '#'">Twitter</a> |
|
||||
<a style="color:inherit" href="#">Support</a> |
|
||||
<a style="color:inherit" href="/page/contactus">Contact Us</a> |
|
||||
<a style="color:inherit" t-att-href="(website.social_facebook) or '#'">Facebook</a> |
|
||||
<a style="color:inherit" t-att-href="(website.social_twitter) or '#'">Twitter</a> |
|
||||
<a style="color:inherit" href="#">Support</a> |
|
||||
</t>
|
||||
<a href="/unsubscribe_from_list" style="color:inherit">Unsubscribe</a>
|
||||
&nbsp;
|
||||
|
||||
@@ -158,23 +158,12 @@ data.Class = Widget.extend({
|
||||
compute_snippet_templates: function (html) {
|
||||
var self = this;
|
||||
var $html = $(html);
|
||||
var $ul = $html.siblings("ul");
|
||||
var $scroll = $html.siblings("#o_scroll");
|
||||
|
||||
if (!$scroll.length) {
|
||||
throw new Error("Wrong snippets xml definition");
|
||||
}
|
||||
|
||||
$ul.children().tooltip({
|
||||
delay: { "show": 500, "hide": 100 },
|
||||
container: 'body',
|
||||
title: function () {
|
||||
return (navigator.appVersion.indexOf('Mac') > -1 ? 'CMD' : 'CTRL')+'+SHIFT+'+($(this).index()+1);
|
||||
},
|
||||
trigger: 'hover',
|
||||
placement: 'top'
|
||||
}).on('click', function () {$(this).tooltip('hide');});
|
||||
|
||||
// t-snippet
|
||||
$html.find('[data-oe-type="snippet"]').each(function () {
|
||||
$(this).children().attr('data-oe-type', "snippet").attr('data-oe-thumbnail', $(this).data('oe-thumbnail'));
|
||||
@@ -296,29 +285,6 @@ data.Class = Widget.extend({
|
||||
|
||||
this.$el.html($html);
|
||||
|
||||
// animate for list of snippet blocks
|
||||
this.$el.on('click', '.scroll-link', function (event) {
|
||||
event.preventDefault();
|
||||
var targetOffset = $($(this).attr("href")).position().top - $ul.outerHeight() + $scroll[0].scrollTop;
|
||||
$scroll.animate({'scrollTop': targetOffset}, 750);
|
||||
});
|
||||
$scroll.on('scroll', function () {
|
||||
var middle = $scroll.height()/4;
|
||||
var $li = $ul.find("a").parent().removeClass('active');
|
||||
var last;
|
||||
for (var k=0; k<$li.length; k++) {
|
||||
var li = $($li[k]);
|
||||
if (!li.data('target')) {
|
||||
li.data('target', $($("a", li).attr("href")));
|
||||
}
|
||||
if (li.data('target').position().top > middle) {
|
||||
break;
|
||||
}
|
||||
last = $li[k];
|
||||
}
|
||||
$(last).addClass("active");
|
||||
});
|
||||
|
||||
self.make_snippet_draggable(self.$snippets);
|
||||
this.associate_snippet_names(this.$snippets);
|
||||
},
|
||||
|
||||
@@ -87,43 +87,13 @@ html[lang] > body.editor_enable{
|
||||
#snippets_menu {
|
||||
.o-flex(0, 0, auto);
|
||||
height: @odoo-navbar-height;
|
||||
line-height: @odoo-navbar-height;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: @o-we-color-dark;
|
||||
list-style-type: none;
|
||||
li {
|
||||
display: block;
|
||||
float: left;
|
||||
width: 25%;
|
||||
height: 100%;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.o-flex-display();
|
||||
.o-align-items(center);
|
||||
.o-justify-content(center);
|
||||
text-decoration: none!important;
|
||||
|
||||
i {
|
||||
font-size: 20px;
|
||||
color: #999999;
|
||||
+ i {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.active, &:hover {
|
||||
a i {
|
||||
color: white;
|
||||
+ i {
|
||||
color: @odoo-brand-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
#o_scroll {
|
||||
|
||||
@@ -1,15 +1,7 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<odoo>
|
||||
<template id="snippets">
|
||||
<ul id="snippets_menu">
|
||||
<li class="active">
|
||||
<a href="#snippet_structure" class="scroll-link">
|
||||
<span class="fa-stack fa-lg">
|
||||
<i class="fa fa-square fa-stack-2x fa-inverse"></i>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="snippets_menu">Add blocks</h2>
|
||||
|
||||
<div id="o_scroll">
|
||||
<div id="snippet_structure" class="o_panel">
|
||||
|
||||
@@ -623,31 +623,6 @@
|
||||
|
||||
<!-- Snippets menu -->
|
||||
<template id="snippets" inherit_id="web_editor.snippets" primary="True">
|
||||
<xpath expr="//ul[@id='snippets_menu']" position="replace">
|
||||
<ul id="snippets_menu">
|
||||
<li class="active structure">
|
||||
<a href="#snippet_structure" class="scroll-link">
|
||||
<i class="fa fa-th-large"/>
|
||||
</a>
|
||||
</li>
|
||||
<li class="content">
|
||||
<a href="#snippet_content" class="scroll-link">
|
||||
<i class="fa fa-indent"/>
|
||||
</a>
|
||||
</li>
|
||||
<li class="feature">
|
||||
<a href="#snippet_feature" class="scroll-link">
|
||||
<i class="fa fa-check-square"/>
|
||||
</a>
|
||||
</li>
|
||||
<li class="effect">
|
||||
<a href="#snippet_effect" class="scroll-link">
|
||||
<i class="fa fa-magic icon-fix"/>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</xpath>
|
||||
|
||||
<xpath expr="//div[@id='o_scroll']" position="replace">
|
||||
<div id="o_scroll">
|
||||
<div id="snippet_structure" class="o_panel">
|
||||
|
||||
Reference in New Issue
Block a user