[REF] web: calendarView & graphView design

task-2818586 Part-of: odoo#116641
ronelsimon · May 12, 2023 · 87a6d95 · 87a6d95
1 parent 824024f
commit 87a6d95
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 17 deletions.
diff --git a/addons/web/static/src/views/calendar/calendar_controller.xml b/addons/web/static/src/views/calendar/calendar_controller.xml
@@ -23,32 +23,37 @@
     </t>
 
     <t t-name="web.CalendarController.controlButtons" owl="1">
-        <div class="o_calendar_buttons">
-            <span t-if="!env.isSmall" class="o_calendar_navigation_buttons me-1">
+        <div class="o_calendar_buttons d-flex align-items-center mb-2">
+            <ViewScaleSelector scales="scales" currentScale="model.scale" setScale.bind="setScale" />
+            <span t-if="!env.isSmall" class="o_calendar_navigation_buttons mx-1">
                 <button
-                    class="btn btn-primary o_calendar_button_prev"
-                    title="Previous"
-                    aria-label="Previous"
-                    t-on-click.stop="() => this.setDate('previous')"
+                    class="btn btn-secondary mx-1 o_calendar_button_today"
+                    t-on-click.stop="() => this.setDate('today')"
                 >
-                    <i class="fa fa-arrow-left" />
+                    Today
                 </button>
                 <button
-                    class="btn btn-primary mx-1 o_calendar_button_today"
-                    t-on-click.stop="() => this.setDate('today')"
+                    class="btn btn-text pe-2 o_calendar_button_prev"
+                    title="Previous"
+                    aria-label="Previous"
+                    t-on-click.stop="() => this.setDate('previous')"
                 >
-                    Today
+                    <i class="fa oi-larger fa-angle-left" />
                 </button>
                 <button
-                    class="btn btn-primary o_calendar_button_next"
+                    class="btn btn-text ps-1 o_calendar_button_next"
                     title="Next"
                     aria-label="Next"
                     t-on-click.stop="() => this.setDate('next')"
                 >
-                    <i class="fa fa-arrow-right" />
+                    <i class="fa oi-larger fa-angle-right" />
                 </button>
+                <t t-log="this"></t>
             </span>
-            <ViewScaleSelector scales="scales" currentScale="model.scale" setScale.bind="setScale" />
+
+            <!-- POC -->
+            <span class="fs-3">April 2023</span>
+
             <button t-if="env.isSmall" class="o_cp_today_button btn btn-sm btn-link" t-on-click="() => this.setDate('today')">
                 <span class="fa-stack o_calendar_button_today">
                     <i class="fa fa-calendar-o fa-stack-2x" role="img" aria-label="Today" title="Today" />

diff --git a/addons/web/static/src/views/graph/graph_view.scss b/addons/web/static/src/views/graph/graph_view.scss
@@ -1,6 +1,10 @@
 // ------- Graph renderer -------
-.o_graph_renderer canvas {
-    background-color: $o-view-background-color;
+.o_graph_view {
+    --ControlPanel-border-bottom: none;
+
+    .o_graph_renderer canvas {
+        background-color: $o-view-background-color;
+    }
 }
 
 .o_graph_view {

diff --git a/addons/web/static/src/views/view_components/view_scale_selector.xml b/addons/web/static/src/views/view_components/view_scale_selector.xml
@@ -2,13 +2,13 @@
 <templates xml:space="preserve">
 
     <t t-name="web.ViewScaleSelector" owl="1">
-        <Dropdown t-if="Object.keys(props.scales).length > 1" class="'btn-group o_view_scale_selector'" togglerClass="'btn btn-secondary scale_button_selection text-uppercase'" hotkey="'v'" showCaret="true">
+        <Dropdown t-if="Object.keys(props.scales).length > 1" class="'btn-group o_view_scale_selector'" togglerClass="'btn btn-secondary scale_button_selection'" hotkey="'v'" showCaret="true">
             <t t-set-slot="toggler">
                 <t t-esc="props.scales[props.currentScale].description" />
             </t>
             <t t-foreach="scales" t-as="scale" t-key="scale.key">
                 <DropdownItem
-                    class="`o_scale_button_${scale.key} text-uppercase ${scale.key === props.currentScale ? 'active' : ''}`"
+                    class="`o_scale_button_${scale.key} ${scale.key === props.currentScale ? 'active' : ''}`"
                     hotkey="scale.hotkey or scale.key[0]"
                     onSelected="() => this.props.setScale(scale.key)"
                 >