[FIX] mail: vertically align subtype description and tracking value

Follow-up of [1]

Before this commit, when a message had both subtype description and
tracking values, they were displayed horizontally instead of
vertically.

This happens because [1] set `d-flex` on `textContent`, which is
horizontal by default. This assumes there's only 1 HTML node for
actual `textContent` so that message action list could be
positioned next to 1st text content line.

However, when message has subtype description and tracking values,
there is more than 1 HTML node in `textContent` and the intended
visual is showing them in `d-block`. This `d-flex` made them display
horizontally instead of `d-block`.

This commit fixes the issue by having a single actual HTML node in
`textContent` when there's a subtype description and some tracking
values. This allows to position `textContent` parts as desired
(e.g. with `d-block`) while having position of message action list
working as intended in original template of `Message`.

[1] https://github.com/odoo/odoo/pull/128940

closes odoo/odoo#130435

X-original-commit: 469f46c602c842c7a7fae49e0af701e979ff18ba
Signed-off-by: Louis Wicket (wil) <wil@odoo.com>
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
This commit is contained in:
Alexandre Kühn
2023-08-02 14:41:13 +02:00
parent e5500cd788
commit 30a0c7a84a
@@ -3,25 +3,27 @@
<t t-inherit="mail.Message" t-inherit-mode="extension" owl="1">
<xpath expr="//div[hasclass('o-mail-Message-textContent')]/*[1]" position="before">
<t t-if="message.type === 'notification' or message.isTransient or message.trackingValues.length > 0" name="hasTrackingValue">
<t t-if="message.subtypeDescription">
<p class="mb-0">
<t t-esc="message.subtypeDescription"/>
</p>
</t>
<t t-if="message.trackingValues.length">
<ul class="mb-0 ps-4">
<t name="trackingValues" t-foreach="message.trackingValues" t-as="trackingValue" t-key="trackingValue.id">
<li class="o-mail-Message-tracking mb-1" role="group">
<span class="o-mail-Message-trackingOld me-1 px-1 text-muted fw-bold" t-esc="formatTrackingOrNone(trackingValue.oldValue)"/>
<i class="o-mail-Message-trackingSeparator fa fa-long-arrow-right mx-1 text-600"/>
<span class="o-mail-Message-trackingNew me-1 fw-bold text-info" t-esc="formatTrackingOrNone(trackingValue.newValue)"/>
<span class="o-mail-Message-trackingField ms-1 fst-italic text-muted">(<t t-esc="trackingValue.changedField"/>)</span>
</li>
</t>
</ul>
</t>
<div t-if="message.body" class="o-mail-Message-body text-break mb-0 w-100" t-ref="body">
<t t-out="message.body"/>
<div>
<t t-if="message.subtypeDescription">
<p class="mb-0">
<t t-esc="message.subtypeDescription"/>
</p>
</t>
<t t-if="message.trackingValues.length">
<ul class="mb-0 ps-4">
<t name="trackingValues" t-foreach="message.trackingValues" t-as="trackingValue" t-key="trackingValue.id">
<li class="o-mail-Message-tracking mb-1" role="group">
<span class="o-mail-Message-trackingOld me-1 px-1 text-muted fw-bold" t-esc="formatTrackingOrNone(trackingValue.oldValue)"/>
<i class="o-mail-Message-trackingSeparator fa fa-long-arrow-right mx-1 text-600"/>
<span class="o-mail-Message-trackingNew me-1 fw-bold text-info" t-esc="formatTrackingOrNone(trackingValue.newValue)"/>
<span class="o-mail-Message-trackingField ms-1 fst-italic text-muted">(<t t-esc="trackingValue.changedField"/>)</span>
</li>
</t>
</ul>
</t>
<div t-if="message.body" class="o-mail-Message-body text-break mb-0 w-100" t-ref="body">
<t t-out="message.body"/>
</div>
</div>
</t>
</xpath>