[REF] mail: ChatWindowHiddenMenu, review and simplify scss
Part of the overall v16 SCSS optimization/restyle, task-2704984 task-2781992 Part-of: odoo/odoo#86244
This commit is contained in:
+1
-56
@@ -3,80 +3,25 @@
|
||||
// ------------------------------------------------------------------
|
||||
|
||||
.o_ChatWindowHiddenMenu {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
width: 50px;
|
||||
height: 28px;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_chatWindowHeader {
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_dropdownToggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1 1 auto;
|
||||
max-width: map-get($sizes, 100);
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_dropdownToggleItem {
|
||||
margin: map-get($spacers, 0) map-get($spacers, 1);
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_list {
|
||||
overflow: auto;
|
||||
margin: map-get($spacers, 0);
|
||||
padding: map-get($spacers, 0);
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_listItem {
|
||||
|
||||
&:not(:last-child) {
|
||||
border-bottom: $border-width solid $border-color;
|
||||
}
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_unreadCounter {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
transform: translate(50%, -50%);
|
||||
z-index: 1001; // on top of bootstrap dropup menu
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_windowCounter {
|
||||
margin-left: map-get($spacers, 1);
|
||||
z-index: $zindex-tooltip; // on top of bootstrap dropup menu
|
||||
}
|
||||
|
||||
// ------------------------------------------------------------------
|
||||
// Style
|
||||
// ------------------------------------------------------------------
|
||||
|
||||
.o_ChatWindowHiddenMenu {
|
||||
background-color: gray('900');
|
||||
border-radius: 6px 6px 0 0;
|
||||
color: $white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_chatWindowHeader {
|
||||
opacity: 0.95;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_dropdownToggle.show {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_unreadCounter {
|
||||
background-color: $o-brand-primary;
|
||||
}
|
||||
|
||||
.o_ChatWindowHiddenMenu_windowCounter {
|
||||
|
||||
+8
-8
@@ -2,18 +2,18 @@
|
||||
<templates xml:space="preserve">
|
||||
|
||||
<t t-name="mail.ChatWindowHiddenMenu" owl="1">
|
||||
<div class="dropup o_ChatWindowHiddenMenu" t-attf-class="{{ className }}" t-ref="root">
|
||||
<div class="dropdown-toggle o_ChatWindowHiddenMenu_dropdownToggle" t-att-class="{ show: messaging.chatWindowManager.isHiddenMenuOpen }" t-on-click="_onClickToggle">
|
||||
<div class="fa fa-comments-o o_ChatWindowHiddenMenu_dropdownToggleIcon o_ChatWindowHiddenMenu_dropdownToggleItem"/>
|
||||
<div class="o_ChatWindowHiddenMenu_dropdownToggleItem o_ChatWindowHiddenMenu_windowCounter text-truncate">
|
||||
<div class="o_ChatWindowHiddenMenu dropup position-fixed bottom-0 align-items-stretch d-flex rounded-lg-top bg-900 o_cursor_pointer" t-attf-class="{{ className }}" t-ref="root">
|
||||
<div class="o_ChatWindowHiddenMenu_dropdownToggle dropdown-toggle justify-content-center align-items-center flex-grow-1 d-flex mw-100" t-att-class="{ 'show opacity-50': messaging.chatWindowManager.isHiddenMenuOpen }" t-on-click="_onClickToggle">
|
||||
<div class="o_ChatWindowHiddenMenu_dropdownToggleIcon o_ChatWindowHiddenMenu_dropdownToggleItem mx-1 fa fa-comments-o"/>
|
||||
<div class="o_ChatWindowHiddenMenu_dropdownToggleItem o_ChatWindowHiddenMenu_windowCounter mx-1 text-truncate">
|
||||
<t t-esc="messaging.chatWindowManager.allOrderedHidden.length"/>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="dropdown-menu dropdown-menu-right o_ChatWindowHiddenMenu_list" t-att-class="{ show: messaging.chatWindowManager.isHiddenMenuOpen }" role="menu" t-ref="list">
|
||||
<ul class="o_ChatWindowHiddenMenu_list dropdown-menu dropdown-menu-right m-0 p-0 overflow-auto" t-att-class="{ show: messaging.chatWindowManager.isHiddenMenuOpen }" role="menu" t-ref="list">
|
||||
<t t-foreach="messaging.chatWindowManager.allOrderedHidden" t-as="chatWindow" t-key="chatWindow.localId">
|
||||
<li class="o_ChatWindowHiddenMenu_listItem" role="menuitem">
|
||||
<li class="o_ChatWindowHiddenMenu_listItem" t-att-class="{ 'border-bottom' : !chatWindow_last }" role="menuitem">
|
||||
<ChatWindowHeader
|
||||
className="'o_ChatWindowHiddenMenu_chatWindowHeader'"
|
||||
className="'o_ChatWindowHiddenMenu_chatWindowHeader opacity-100-hover'"
|
||||
chatWindowLocalId="chatWindow.localId"
|
||||
onClicked="_onClickedChatWindow"
|
||||
/>
|
||||
@@ -21,7 +21,7 @@
|
||||
</t>
|
||||
</ul>
|
||||
<t t-if="messaging.chatWindowManager.unreadHiddenConversationAmount > 0">
|
||||
<div class="badge badge-pill o_ChatWindowHiddenMenu_unreadCounter">
|
||||
<div class="o_ChatWindowHiddenMenu_unreadCounter position-absolute end-0 top-0 badge badge-pill badge-primary">
|
||||
<t t-esc="messaging.chatWindowManager.unreadHiddenConversationAmount"/>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
Reference in New Issue
Block a user