[REF] mail: MobileMessagingNavbar, review and simplify scss
Part of the overall v16 SCSS optimization/restyle, task-2704984 task-2837311 closes odoo/odoo#90162 Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
This commit is contained in:
+1
-29
@@ -3,41 +3,13 @@
|
||||
// ------------------------------------------------------------------
|
||||
|
||||
.o_MobileMessagingNavbar {
|
||||
display: flex;
|
||||
flex: 0 0 auto;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.o_MobileMessagingNavbar_tab {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
align-items: center;
|
||||
flex: 1 1 0;
|
||||
padding: map-get($spacers, 2);
|
||||
flex-basis: 0;
|
||||
}
|
||||
|
||||
.o_MobileMessagingNavbar_tabIcon {
|
||||
margin-bottom: 4%;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.o_MobileMessagingNavbar_tabLabel {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
// ------------------------------------------------------------------
|
||||
// Style
|
||||
// ------------------------------------------------------------------
|
||||
|
||||
.o_MobileMessagingNavbar {
|
||||
background-color: $white;
|
||||
box-shadow: 0 0 8px gray('400');
|
||||
}
|
||||
|
||||
.o_MobileMessagingNavbar_tab {
|
||||
box-shadow: 1px 0 0 gray('400');
|
||||
|
||||
&.o-active {
|
||||
color: $o-brand-primary;
|
||||
}
|
||||
}
|
||||
|
||||
+4
-4
@@ -3,13 +3,13 @@
|
||||
|
||||
<t t-name="mail.MobileMessagingNavbar" owl="1">
|
||||
<t t-if="mobileMessagingNavbarView">
|
||||
<div class="o_MobileMessagingNavbar" t-attf-class="{{ className }}" t-ref="root">
|
||||
<div class="o_MobileMessagingNavbar d-flex flex-shrink-0 border-top bg-white shadow-lg" t-attf-class="{{ className }}" t-ref="root">
|
||||
<t t-foreach="mobileMessagingNavbarView.tabs" t-as="tab" t-key="tab.id">
|
||||
<div class="o_MobileMessagingNavbar_tab" t-att-class="{ 'o-active': mobileMessagingNavbarView.activeTabId === tab.id }" t-on-click="ev => mobileMessagingNavbarView.onClick(tab.id, ev)" t-att-data-tab-id="tab.id">
|
||||
<div class="o_MobileMessagingNavbar_tab d-flex flex-column align-items-center flex-grow-1 p-2" t-att-class="{ 'o-active text-primary': mobileMessagingNavbarView.activeTabId === tab.id, 'border-left': tab_index !== 0 }" t-on-click="ev => mobileMessagingNavbarView.onClick(tab.id, ev)" t-att-data-tab-id="tab.id">
|
||||
<t t-if="tab.icon">
|
||||
<span class="o_MobileMessagingNavbar_tabIcon" t-att-class="tab.icon"/>
|
||||
<span class="o_MobileMessagingNavbar_tabIcon fs-4" t-att-class="tab.icon"/>
|
||||
</t>
|
||||
<span class="o_MobileMessagingNavbar_tabLabel"><t t-esc="tab.label"/></span>
|
||||
<span class="o_MobileMessagingNavbar_tabLabel small"><t t-esc="tab.label"/></span>
|
||||
</div>
|
||||
</t>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user