[IMP] mail: chat window dropdown show active background
Before this commit, when the command dropdown was open by clicking on avatar/chat window header name, the clickable area was the same as the rest of chat window header. As a result, the dropdown was shown without some UI to help see the toggler that is responsible from this dropdown. This commit highlights the toggler of dropdown when it is open, so that it looks nicer when the dropdown is open as we clearly see the toggler of this dropdown. closes odoo/odoo#139920 Signed-off-by: Sébastien Theys (seb) <seb@odoo.com>
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
.o-mail-ChatWindow-command {
|
||||
&:hover {
|
||||
&:hover, &.o-active {
|
||||
background-color: $gray-200;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12,11 +12,12 @@
|
||||
height: $o-mail-Discuss-headerHeight;
|
||||
}
|
||||
|
||||
.o-mail-ChatWindow-command {
|
||||
color: inherit !important;
|
||||
&:hover {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
|
||||
.o-mail-ChatWindow-command {
|
||||
color: inherit !important;
|
||||
&:hover, &.o-active {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
>
|
||||
<div class="o-mail-ChatWindow-header d-flex align-items-center flex-shrink-0 bg-100" t-on-click="onClickHeader" t-att-class="{ 'cursor-pointer': !ui.isSmall, 'border-bottom': !props.chatWindow.folded }">
|
||||
<t t-if="threadActions.actions.length > 3">
|
||||
<Dropdown position="'bottom-start'" onStateChanged="state => this.onActionsMenuStateChanged(state)" togglerClass="`o-mail-ChatWindow-command d-flex btn align-items-center text-truncate p-0 p-1 ${ !ui.isSmall ? 'ms-2' : '' }`" menuClass="'d-flex flex-column py-0'" class="'d-flex text-truncate'" disabled="state.editingName" title="actionsMenuTitleText">
|
||||
<Dropdown position="'bottom-start'" onStateChanged="state => this.onActionsMenuStateChanged(state)" togglerClass="`o-mail-ChatWindow-command d-flex btn align-items-center text-truncate p-0 p-1 ${ !ui.isSmall ? 'ms-2' : '' } ${state.actionsMenuOpened ? 'o-active' : ''}`" menuClass="'d-flex flex-column py-0'" class="'d-flex text-truncate'" disabled="state.editingName" title="actionsMenuTitleText">
|
||||
<t t-set-slot="toggler">
|
||||
<t t-call="mail.ChatWindow.headerContent"/>
|
||||
</t>
|
||||
|
||||
Reference in New Issue
Block a user