From f962d071adf28ec1ef617afaa688fb835ec26012 Mon Sep 17 00:00:00 2001
From: Julien Mougenot <jum@odoo.com>
Date: Fri, 7 Jul 2023 08:06:10 +0000
Subject: [PATCH] [FIX] web: fix datetime picker buttons overflowing

Before this commit, the "Apply" button in date pickers (not datetime)
would overflow from its popover in desktop view since its position is
set to absolute, and since there are no time pickers to extend the
height of the picker it simply overflows.

This commit ensures that the buttons are correctly displayed when there
are no time pickers.

Part-of: odoo/odoo#127734
---
 addons/web/static/src/core/datetime/datetime_picker.xml    | 6 ++++--
 .../static/src/core/datetime/datetime_picker_popover.xml   | 7 +++++--
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/addons/web/static/src/core/datetime/datetime_picker.xml b/addons/web/static/src/core/datetime/datetime_picker.xml
index 9a975cf3b88..43e8f03de19 100644
--- a/addons/web/static/src/core/datetime/datetime_picker.xml
+++ b/addons/web/static/src/core/datetime/datetime_picker.xml
@@ -78,8 +78,10 @@
                     </t>
                 </t>
             </div>
-
-            <div t-attf-class="o_datetime_buttons position-md-absolute end-0">
+            <div
+                class="o_datetime_buttons end-0"
+                t-att-class="{ 'position-md-absolute': props.type === 'datetime'  }"
+            >
                 <t t-slot="buttons" />
             </div>
         </div>
diff --git a/addons/web/static/src/core/datetime/datetime_picker_popover.xml b/addons/web/static/src/core/datetime/datetime_picker_popover.xml
index a86c788f474..aef9aa6f25a 100644
--- a/addons/web/static/src/core/datetime/datetime_picker_popover.xml
+++ b/addons/web/static/src/core/datetime/datetime_picker_popover.xml
@@ -4,8 +4,11 @@
         <DateTimePicker t-props="props.pickerProps">
             <t t-set-slot="buttons">
                 <t t-if="props.pickerProps.type === 'datetime' or Array.isArray(props.pickerProps.value)">
-                    <button class="o_apply btn btn-primary btn-sm w-100 w-md-auto" t-on-click="props.close">
-                        <i class="fa fa-check pe-1" />
+                    <button
+                        class="o_apply btn btn-primary btn-sm w-100 w-md-auto d-flex align-items-center justify-content-center gap-1"
+                        t-on-click="props.close"
+                    >
+                        <i class="fa fa-check" />
                         <span>Apply</span>
                     </button>
                 </t>