diff options
| author | Siddarth Gajjar <sga@odoo.com> | 2018-08-23 16:23:31 +0530 |
|---|---|---|
| committer | Alexandre Kühn <aku@odoo.com> | 2018-08-30 12:47:28 +0200 |
| commit | bd43df539ff08c3caa4799226922633a928e37a2 (patch) | |
| tree | 29c432e6e0c4fa06ab9d0b466dcb31b3f3eb4e17 /addons/mail/static/src/xml/thread.xml | |
| parent | c7c6f911a892634aa675c32679732265754290d2 (diff) | |
[IMP] mail: improve envelop icon tooltip style
This commit improves the style of the tooltip on the mail envelop
icon next to a message related to an email. To do so, we have removed
existing CSS and custom tooltip UI and replaced them with boostrap
popover.
This commit also removes most flickering issue when mouse hovering
on gaps between the tooltip and message icons.
Note that there are still corner cases that produce flickers.
This is unfortunately a known issue with bootstrap 4, as this glitch
can also be observed on bootstrap website.
Task-ID 1879282
Closes #26546
Diffstat (limited to 'addons/mail/static/src/xml/thread.xml')
| -rw-r--r-- | addons/mail/static/src/xml/thread.xml | 31 |
1 files changed, 18 insertions, 13 deletions
diff --git a/addons/mail/static/src/xml/thread.xml b/addons/mail/static/src/xml/thread.xml index d88418ee921..242e97449f5 100644 --- a/addons/mail/static/src/xml/thread.xml +++ b/addons/mail/static/src/xml/thread.xml @@ -315,19 +315,6 @@ <t t-set="fatype" t-value="'-o'"/> </t> <i t-att-class="'o_thread_tooltip o_thread_message_email o_thread_message_email_' + message.getCustomerEmailStatus() + ' fa fa-envelope-o'" t-att-data-message-id="message.getID()"/> - <span class="o_thread_tooltip_content"> - <t t-foreach="message.getCustomerEmailData()" t-as="customerEmailData"> - <span> - <t t-if="customerEmailData[2] === 'sent'"><i class='fa fa-check' title="Sent" role="img" aria-label="Sent"/></t> - <t t-if="customerEmailData[2] === 'bounce'"><i class='fa fa-exclamation' title="Bounced" role="img" aria-label="Bounced"/></t> - <t t-if="customerEmailData[2] === 'exception'"><i class='fa fa-exclamation' title="Error" role="img" aria-label="Error"/></t> - <t t-if="customerEmailData[2] === 'ready'"><i class='fa fa-send-o' title="Ready" role="img" aria-label="Ready"/></t> - <t t-if="customerEmailData[2] === 'canceled'"><i class='fa fa-trash-o' title="Canceled" role="img" aria-label="Canceled"/></t> - <t t-esc="customerEmailData[1]"/> - </span> - <br /> - </t> - </span> </span> <span t-attf-class="o_thread_icons"> <i t-if="options.displayStars and !message.isSystemNotification() and !message.needsModeration()" @@ -382,6 +369,24 @@ </t> <!-- + @param {Object[]|undefined} list of customer email data of a given message. + A customer email data is a list with the following format: + [partnerID, partnerName, emailStatus] + --> + <t t-name="mail.widget.Thread.Message.MailTooltip"> + <div t-foreach="data" t-as="customerEmailData"> + <span class="d-inline-block text-center o_thread_tooltip_icon"> + <i t-if="customerEmailData[2] === 'sent'" class='fa fa-check' title="Sent" role="img" aria-label="Sent"/> + <i t-if="customerEmailData[2] === 'bounce'" class='fa fa-exclamation text-danger' title="Bounced" role="img" aria-label="Bounced"/> + <i t-if="customerEmailData[2] === 'exception'" class='fa fa-exclamation text-danger' title="Error" role="img" aria-label="Error"/> + <i t-if="customerEmailData[2] === 'ready'" class='fa fa-send-o' title="Ready" role="img" aria-label="Ready"/> + <i t-if="customerEmailData[2] === 'canceled'" class='fa fa-trash-o' title="Canceled" role="img" aria-label="Canceled"/> + </span> + <span t-esc="customerEmailData[1]"/> + </div> + </t> + + <!-- @param {mail.model.Message} message --> <t t-name="mail.MessageModerationDecision"> |