From 3e125805c69abb9e2d6a38332bdfb3d30f9f5d86 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Mon, 7 Oct 2024 13:58:58 +0200
Subject: [PATCH] style: refs #7404 fix icons hover effect

---
 src/components/common/VnInputDate.vue | 47 ++++++++++++++-------------
 src/components/common/VnInputTime.vue | 44 +++++++++++++------------
 2 files changed, 48 insertions(+), 43 deletions(-)

diff --git a/src/components/common/VnInputDate.vue b/src/components/common/VnInputDate.vue
index 3d5afaf80..b14838768 100644
--- a/src/components/common/VnInputDate.vue
+++ b/src/components/common/VnInputDate.vue
@@ -105,28 +105,31 @@ const styleAttrs = computed(() => {
             hide-bottom-space
         >
             <template #append>
-                <QIcon
-                    name="close"
-                    size="xs"
-                    v-if="
-                        ($attrs.clearable == undefined || $attrs.clearable) &&
-                        hover &&
-                        model &&
-                        !$attrs.disable
-                    "
-                    @click="
-                        vnInputDateRef.focus();
-                        model = null;
-                        isPopupOpen = false;
-                    "
-                />
-                <QIcon
-                    v-if="showEvent"
-                    name="event"
-                    class="cursor-pointer"
-                    @click="isPopupOpen = !isPopupOpen"
-                    :title="t('Open date')"
-                />
+                <div style="align-items: flex-end; display: flex">
+                    <QIcon
+                        name="close"
+                        size="xs"
+                        v-if="
+                            ($attrs.clearable == undefined || $attrs.clearable) &&
+                            hover &&
+                            model &&
+                            !$attrs.disable
+                        "
+                        @click="
+                            vnInputDateRef.focus();
+                            model = null;
+                            isPopupOpen = false;
+                        "
+                    />
+
+                    <QIcon
+                        v-if="showEvent"
+                        name="event"
+                        class="cursor-pointer"
+                        @click="isPopupOpen = !isPopupOpen"
+                        :title="t('Open date')"
+                    />
+                </div>
             </template>
             <QMenu
                 transition-show="scale"
diff --git a/src/components/common/VnInputTime.vue b/src/components/common/VnInputTime.vue
index a5e7d3002..44d54b524 100644
--- a/src/components/common/VnInputTime.vue
+++ b/src/components/common/VnInputTime.vue
@@ -84,27 +84,29 @@ function dateToTime(newDate) {
             hide-bottom-space
         >
             <template #append>
-                <QIcon
-                    name="close"
-                    size="xs"
-                    v-if="
-                        ($attrs.clearable == undefined || $attrs.clearable) &&
-                        hover &&
-                        model &&
-                        !$attrs.disable
-                    "
-                    @click="
-                        vnInputTimeRef.focus();
-                        model = null;
-                        isPopupOpen = false;
-                    "
-                />
-                <QIcon
-                    name="Schedule"
-                    class="cursor-pointer"
-                    @click="isPopupOpen = !isPopupOpen"
-                    :title="t('Open time')"
-                />
+                <div style="align-items: flex-end; display: flex">
+                    <QIcon
+                        name="close"
+                        size="xs"
+                        v-if="
+                            ($attrs.clearable == undefined || $attrs.clearable) &&
+                            hover &&
+                            model &&
+                            !$attrs.disable
+                        "
+                        @click="
+                            vnInputTimeRef.focus();
+                            model = null;
+                            isPopupOpen = false;
+                        "
+                    />
+                    <QIcon
+                        name="Schedule"
+                        class="cursor-pointer"
+                        @click="isPopupOpen = !isPopupOpen"
+                        :title="t('Open time')"
+                    />
+                </div>
             </template>
             <QMenu
                 transition-show="scale"