[REF] mail: o_ActivityBox review and simplify scss

Simplify SCSS and use direction-relative margins to handle RTL layouts.
Part of the overall v16 SCSS optimization/restyle (task-2704984).

task-2731819

closes odoo/odoo#83036

Related: odoo/enterprise#23605
Signed-off-by: Sébastien Theys (seb) <seb@odoo.com>
This commit is contained in:
stefanorigano (SRI)
2022-01-27 11:07:21 +00:00
parent c1e5fd3acf
commit 3c8576e221
2 changed files with 8 additions and 46 deletions
@@ -1,45 +1,7 @@
// ------------------------------------------------------------------
// Layout
// ------------------------------------------------------------------
.o_ActivityBox_title {
display: flex;
align-items: center;
flex: 0 0 auto;
margin-top: map-get($spacers, 4);
margin-bottom: map-get($spacers, 4);
}
.o_ActivityBox_titleBadge {
padding: map-get($spacers, 0) map-get($spacers, 2);
}
.o_ActivityBox_titleBadges {
margin-inline-end: map-get($spacers, 3);
}
.o_ActivityBox_titleLine {
flex: 1 1 auto;
width: auto;
}
.o_ActivityBox_titleText {
margin: map-get($spacers, 0) map-get($spacers, 3);
}
// ------------------------------------------------------------------
// Style
// ------------------------------------------------------------------
.o_ActivityBox_title {
font-weight: bold;
}
.o_ActivityBox_titleBadge {
font-size: 11px;
}
.o_ActivityBox_titleLine {
border-color: gray('400');
border-style: dashed;
border-top: $border-width $border-color dashed;
}
@@ -4,32 +4,32 @@
<t t-name="mail.ActivityBox" owl="1">
<div class="o_ActivityBox" t-attf-class="{{ className }}" t-ref="root">
<t t-if="activityBoxView">
<a role="button" class="o_ActivityBox_title btn" t-on-click="activityBoxView.onClickActivityBoxTitle">
<hr class="o_ActivityBox_titleLine" />
<a role="button" class="o_ActivityBox_title btn d-flex align-items-center mt-4 p-0 w-100 font-weight-bold" t-on-click="activityBoxView.onClickActivityBoxTitle">
<hr class="o_ActivityBox_titleLine w-auto flex-grow-1 me-3" />
<span class="o_ActivityBox_titleText">
<i class="fa fa-fw" t-att-class="activityBoxView.isActivityListVisible ? 'fa-caret-down' : 'fa-caret-right'"/>
Planned activities
</span>
<t t-if="!activityBoxView.isActivityListVisible">
<span class="o_ActivityBox_titleBadges">
<span class="o_ActivityBox_titleBadges ms-2">
<t t-if="activityBoxView.chatter.thread.overdueActivities.length > 0">
<span class="o_ActivityBox_titleBadge badge rounded-circle badge-danger">
<span class="o_ActivityBox_titleBadge me-1 badge border-0 badge-danger">
<t t-esc="activityBoxView.chatter.thread.overdueActivities.length"/>
</span>
</t>
<t t-if="activityBoxView.chatter.thread.todayActivities.length > 0">
<span class="o_ActivityBox_titleBadge badge rounded-circle badge-warning">
<span class="o_ActivityBox_titleBadge me-1 badge border-0 badge-warning">
<t t-esc="activityBoxView.chatter.thread.todayActivities.length"/>
</span>
</t>
<t t-if="activityBoxView.chatter.thread.futureActivities.length > 0">
<span class="o_ActivityBox_titleBadge badge rounded-circle badge-success">
<span class="o_ActivityBox_titleBadge me-1 badge border-0 badge-success">
<t t-esc="activityBoxView.chatter.thread.futureActivities.length"/>
</span>
</t>
</span>
</t>
<hr class="o_ActivityBox_titleLine" />
<hr class="o_ActivityBox_titleLine w-auto flex-grow-1 ms-3"/>
</a>
<t t-if="activityBoxView.isActivityListVisible">
<div class="o_ActivityBox_activityList">