[IMP] mail: discuss design revamp

Current design, especially related to views in small viewports, has
been revamped in order to increase readability and to be more coherent
with the one in large screens.

Task-2813949

closes odoo/odoo#87915

Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
This commit is contained in:
Carlos Valverde
2022-06-15 17:18:55 +02:00
parent 9cbbb02481
commit ff471a252c
@@ -25,7 +25,7 @@
<DiscussMobileMailboxSelection className="'o_Discuss_mobileMailboxSelection w-100 border-bottom'" record="discussView"/>
</t>
<t t-if="discussView.mobileAddItemHeaderAutocompleteInputView">
<div class="o_Discuss_mobileAddItemHeader d-flex justify-content-center w-100 p-3 border-bottom">
<div class="o_Discuss_mobileAddItemHeader d-flex justify-content-center w-100 p-3 border-bottom bg-light">
<AutocompleteInput
className="'o_Discuss_mobileAddItemHeaderInput flex-grow-1 mb-3 p-2 rounded border'"
record="discussView.mobileAddItemHeaderAutocompleteInputView"
@@ -44,18 +44,18 @@
/>
</t>
<t t-if="!discussView.discuss.thread and (!messaging.device.isSmall or discussView.discuss.activeMobileNavbarTabId === 'mailbox')">
<div class="o_Discuss_noThread d-flex flex-grow-1 align-items-center justify-content-center w-100">
No conversation selected.
<div class="o_Discuss_noThread d-flex flex-grow-1 align-items-center justify-content-center w-100 bg-white">
<h4 class="text-muted"><b><i>No conversation selected.</i></b></h4>
</div>
</t>
<t t-if="messaging.device.isSmall and discussView.discuss.activeMobileNavbarTabId !== 'mailbox'">
<t t-if="discussView.discuss.activeMobileNavbarTabId === 'chat'">
<button class="o_Discuss_mobileNewChatButton btn btn-secondary" t-on-click="discussView.onClickMobileNewChatButton">
<button class="o_Discuss_mobileNewChatButton w-100 p-2 btn btn-secondary border-bottom bg-light" t-on-click="discussView.onClickMobileNewChatButton">
Start a conversation
</button>
</t>
<t t-if="discussView.discuss.activeMobileNavbarTabId === 'channel'">
<button class="o_Discuss_mobileNewChannelButton btn btn-secondary" t-on-click="discussView.onClickMobileNewChannelButton">
<button class="o_Discuss_mobileNewChannelButton w-100 p-2 btn btn-secondary border-bottom bg-light" t-on-click="discussView.onClickMobileNewChannelButton">
New Channel
</button>
</t>