From fd1da75fd772230d4778f1e62ad61f5aa1045b9b Mon Sep 17 00:00:00 2001
From: Matthieu <mtholot19@gmail.com>
Date: Thu, 19 Mar 2026 10:40:11 +0100
Subject: [PATCH] fix(ui) : use native date/datetime inputs instead of
 MalioInputText for planning dates

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/components/task/TaskModal.vue | 62 ++++++++++++++------------
 1 file changed, 34 insertions(+), 28 deletions(-)

diff --git a/frontend/components/task/TaskModal.vue b/frontend/components/task/TaskModal.vue
index b8d1ca6..ba481d4 100644
--- a/frontend/components/task/TaskModal.vue
+++ b/frontend/components/task/TaskModal.vue
@@ -10,11 +10,11 @@
 
                 <!-- Modal -->
                 <div
-                    class="relative z-10 flex w-full max-w-2xl flex-col overflow-hidden rounded-2xl bg-white shadow-2xl ring-1 ring-black/5 dark:bg-dark-surface dark:ring-dark-border"
+                    class="relative z-10 flex w-full max-w-2xl flex-col overflow-hidden rounded-2xl bg-white shadow-2xl ring-1 ring-black/5"
                     style="max-height: min(90vh, 900px)"
                 >
                     <!-- Header -->
-                    <div class="border-b border-neutral-100 bg-neutral-50/80 px-4 py-4 sm:px-8 sm:py-5 dark:border-dark-border dark:bg-dark-surface/80">
+                    <div class="border-b border-neutral-100 bg-neutral-50/80 px-4 py-4 sm:px-8 sm:py-5">
                         <div class="flex items-center justify-between">
                             <div class="flex items-center gap-3">
                                 <span
@@ -23,13 +23,13 @@
                                 >
                                     {{ task.project.code }}-{{ task.number }}
                                 </span>
-                                <h2 class="text-lg font-bold tracking-tight text-neutral-900 dark:text-neutral-100">
+                                <h2 class="text-lg font-bold tracking-tight text-neutral-900">
                                     {{ isEditing ? $t('tasks.editTask') : $t('tasks.addTask') }}
                                 </h2>
                             </div>
                             <button
                                 type="button"
-                                class="flex h-8 w-8 items-center justify-center rounded-lg text-neutral-400 transition-colors hover:bg-neutral-200/60 hover:text-neutral-600 dark:hover:bg-dark-hover dark:hover:text-neutral-200"
+                                class="flex h-8 w-8 items-center justify-center rounded-lg text-neutral-400 transition-colors hover:bg-neutral-200/60 hover:text-neutral-600"
                                 @click="close"
                             >
                                 <Icon name="mdi:close" size="20" />
@@ -147,7 +147,7 @@
 
                         <!-- Tags -->
                         <div v-if="tags.length" class="mt-5">
-                            <p class="mb-2 text-sm font-medium text-neutral-700 dark:text-neutral-300">Tags</p>
+                            <p class="mb-2 text-sm font-medium text-neutral-700">Tags</p>
                             <div class="flex flex-wrap gap-2">
                                 <label
                                     v-for="tag in tags"
@@ -155,7 +155,7 @@
                                     class="cursor-pointer rounded-full px-3 py-1 text-xs font-semibold transition-all"
                                     :class="form.tagIds.includes(tag.id)
                                         ? 'text-white shadow-sm'
-                                        : 'bg-neutral-100 text-neutral-600 hover:bg-neutral-200 dark:bg-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-600'"
+                                        : 'bg-neutral-100 text-neutral-600 hover:bg-neutral-200'"
                                     :style="form.tagIds.includes(tag.id) ? { backgroundColor: tag.color } : {}"
                                 >
                                     <input
@@ -227,26 +227,32 @@
                             <div>
                                 <h3 class="mb-3 text-sm font-semibold text-neutral-700">{{ $t('tasks.planning.dates') }}</h3>
                                 <div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
-                                    <MalioInputText
-                                        v-model="form.scheduledStart"
-                                        :label="$t('tasks.planning.scheduledStart')"
-                                        type="datetime-local"
-                                        input-class="w-full"
-                                    />
-                                    <MalioInputText
-                                        v-model="form.scheduledEnd"
-                                        :label="$t('tasks.planning.scheduledEnd')"
-                                        type="datetime-local"
-                                        input-class="w-full"
-                                    />
+                                    <div>
+                                        <label class="mb-1 block text-sm font-medium text-neutral-700">{{ $t('tasks.planning.scheduledStart') }}</label>
+                                        <input
+                                            v-model="form.scheduledStart"
+                                            type="datetime-local"
+                                            class="w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-primary-500 focus:outline-none focus:ring-1 focus:ring-primary-500"
+                                        />
+                                    </div>
+                                    <div>
+                                        <label class="mb-1 block text-sm font-medium text-neutral-700">{{ $t('tasks.planning.scheduledEnd') }}</label>
+                                        <input
+                                            v-model="form.scheduledEnd"
+                                            type="datetime-local"
+                                            class="w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-primary-500 focus:outline-none focus:ring-1 focus:ring-primary-500"
+                                        />
+                                    </div>
                                 </div>
                                 <div class="mt-4">
-                                    <MalioInputText
-                                        v-model="form.deadline"
-                                        :label="$t('tasks.planning.deadline')"
-                                        type="date"
-                                        input-class="w-full sm:w-1/2"
-                                    />
+                                    <div class="sm:w-1/2">
+                                        <label class="mb-1 block text-sm font-medium text-neutral-700">{{ $t('tasks.planning.deadline') }}</label>
+                                        <input
+                                            v-model="form.deadline"
+                                            type="date"
+                                            class="w-full rounded-md border border-neutral-300 px-3 py-2 text-sm focus:border-primary-500 focus:outline-none focus:ring-1 focus:ring-primary-500"
+                                        />
+                                    </div>
                                 </div>
                             </div>
 
@@ -410,7 +416,7 @@
 
                         <!-- Footer -->
                         <div
-                            class="mt-6 flex items-center border-t border-neutral-100 pt-5 dark:border-dark-border"
+                            class="mt-6 flex items-center border-t border-neutral-100 pt-5"
                             :class="isEditing ? 'justify-between' : 'justify-end'"
                         >
                             <button
@@ -426,7 +432,7 @@
                                 <button
                                     v-if="canArchive"
                                     type="button"
-                                    class="rounded-lg border border-neutral-300 px-4 py-2 text-sm font-semibold text-neutral-700 transition-colors hover:bg-neutral-50 disabled:cursor-not-allowed disabled:opacity-50 dark:border-dark-border dark:text-neutral-300 dark:hover:bg-dark-hover"
+                                    class="rounded-lg border border-neutral-300 px-4 py-2 text-sm font-semibold text-neutral-700 transition-colors hover:bg-neutral-50 disabled:cursor-not-allowed disabled:opacity-50"
                                     :disabled="isSubmitting"
                                     @click="handleArchive"
                                 >
@@ -435,7 +441,7 @@
                                 <button
                                     v-if="canUnarchive"
                                     type="button"
-                                    class="rounded-lg border border-neutral-300 px-4 py-2 text-sm font-semibold text-neutral-700 transition-colors hover:bg-neutral-50 disabled:cursor-not-allowed disabled:opacity-50 dark:border-dark-border dark:text-neutral-300 dark:hover:bg-dark-hover"
+                                    class="rounded-lg border border-neutral-300 px-4 py-2 text-sm font-semibold text-neutral-700 transition-colors hover:bg-neutral-50 disabled:cursor-not-allowed disabled:opacity-50"
                                     :disabled="isSubmitting"
                                     @click="handleUnarchive"
                                 >
@@ -443,7 +449,7 @@
                                 </button>
                                 <button
                                     type="button"
-                                    class="rounded-lg border border-neutral-300 px-4 py-2 text-sm font-semibold text-neutral-700 transition-colors hover:bg-neutral-50 dark:border-dark-border dark:text-neutral-300 dark:hover:bg-dark-hover"
+                                    class="rounded-lg border border-neutral-300 px-4 py-2 text-sm font-semibold text-neutral-700 transition-colors hover:bg-neutral-50"
                                     @click="close"
                                 >
                                     Annuler