[FIX] sale_timesheet: progress-bars, adapt design

Fix an issue causing bars' border-radius to mismatch their
container. Ensure text readability over custom badges.
Design minors.

task-2579123
This commit is contained in:
stefanorigano (SRI)
2021-07-23 06:54:18 +00:00
committed by Aaron Bohy
parent 6ef27067f4
commit 8058beb19b
2 changed files with 23 additions and 52 deletions
@@ -1,5 +1,3 @@
$canceled-color: gray;
.o_timesheet_plan_sale_timesheet {
@@ -67,48 +65,21 @@ $canceled-color: gray;
}
.o_timesheet_plan_sale_timesheet_people_time {
$-timesheet-progress-colors: (
'billable_time': nth($o-colors-complete, 3),
'billable_fixed': nth($o-colors-complete, 5),
'non_billable_project': theme-color('primary'),
'non_billable_timesheet': nth($o-colors-complete, 11),
'non_billable': nth($o-colors-complete, 18),
'canceled': $o-gray-500,
);
.o_progress_billable_time {
background-color: #f0ad4e;
color: white;
cursor: pointer;
}
.o_progress_billable_fixed {
background-color: #5bc0de;
color: white;
cursor: pointer;
}
.o_progress_non_billable_project {
background-color: theme-color('primary');
color: white;
cursor: pointer;
}
.o_progress_non_billable_timesheet {
background-color: rgb(11, 194, 1);
color: white;
cursor: pointer;
}
.o_progress_non_billable {
background-color: purple;
color: white;
cursor: pointer;
}
.o_progress_canceled {
background-color: $canceled-color;
color: white;
cursor: pointer;
}
.progress {
border-radius: 3px;
}
@each $-key, $-bg in $-timesheet-progress-colors {
.o_progress_#{$-key} {
background-color: $-bg;
.o_timesheet_plan_badge {
margin-bottom: 10px;
> .badge {
border: none;
font-size: unset;
a {
color: white;
a {
color: color-yiq($-bg);
}
}
}
@@ -164,8 +135,8 @@ $canceled-color: gray;
}
.o_canceled_tag {
background-color: $canceled-color;
color: white;
background-color: $o-gray-500;
color: color-yiq($o-gray-500);
border: 0px;
}
}
@@ -266,25 +266,25 @@
<th t-if="is_uom_day" class="text-nowrap text-right pr-5">Days Spent</th>
<th t-else="" class="text-nowrap text-right pr-5">Hours Spent</th>
<td>
<div class="float-right o_timesheet_plan_badge">
<span class="badge badge-pill o_progress_billable_time">
<div class="float-right o_timesheet_plan_badge h3 mb-3">
<span class="badge badge-pill border-0 px-3 py-2 o_progress_billable_time">
<a type="action" data-model="account.analytic.line" t-att-data-domain="json.dumps(timesheet_domain + [('timesheet_invoice_type','=','billable_time')])" tabindex="-1">Billed on Timesheets</a>
</span>
<span class="badge badge-pill o_progress_billable_fixed">
<span class="badge badge-pill border-0 px-3 py-2 o_progress_billable_fixed">
<a type="action" data-model="account.analytic.line" t-att-data-domain="json.dumps(timesheet_domain + [('timesheet_invoice_type','=','billable_fixed')])" tabindex="-1">Billed at a Fixed price</a>
</span>
<span t-if="dashboard['time']['non_billable_project'] != 0" class="badge badge-pill o_progress_non_billable_project">
<span t-if="dashboard['time']['non_billable_project'] != 0" class="badge badge-pill border-0 px-3 py-2 o_progress_non_billable_project">
<a type="action" data-model="account.analytic.line" t-att-data-domain="json.dumps(timesheet_domain + [('timesheet_invoice_type','=','non_billable_project')])" tabindex="-1">No task found</a>
</span>
<span t-if="dashboard['time']['non_billable_timesheet'] != 0" class="badge badge-pill o_progress_non_billable_timesheet">
<span t-if="dashboard['time']['non_billable_timesheet'] != 0" class="badge badge-pill border-0 px-3 py-2 o_progress_non_billable_timesheet">
<a type="action" data-model="account.analytic.line" t-att-data-domain="json.dumps(timesheet_domain + [('timesheet_invoice_type','=','non_billable_timesheet')])" tabindex="-1">Non billable timesheets</a>
</span>
<span class="badge badge-pill o_progress_non_billable">
<span class="badge badge-pill border-0 px-3 py-2 o_progress_non_billable">
<a type="action" data-model="account.analytic.line" t-att-data-domain="json.dumps(timesheet_domain + [('timesheet_invoice_type','=','non_billable')])" tabindex="-1">Non billable tasks</a>
</span>
<!-- only show the canceled pill if there were timesheets on canceled so -->
<t t-if="sum([employee.get('canceled', 0.0) for employee in repartition_employee.values()]) > 0">
<span class="badge badge-pill o_progress_canceled">
<span class="badge badge-pill border-0 px-3 py-2 o_progress_canceled">
<a type="action" data-model="account.analytic.line" t-att-data-domain="json.dumps(timesheet_domain + [('so_line.state', '=', 'cancel')])" tabindex="-1">Cancelled</a>
</span>
</t>
@@ -309,7 +309,7 @@
<t t-else="" t-esc="employee['total']" t-options="{'widget': 'float_time'}"/>
</td>
<td style="vertical-align:middle">
<div class="border rounded">
<div class="border rounded overflow-hidden">
<div t-if="repartition_employee_max" class="progress" t-attf-style="width: {{max(0, employee['total'] / repartition_employee_max * 100)}}%; margin-bottom: 0em;">
<t t-set="total" t-value="employee['total'] or 1.0" />