From a6f2d2d3d99a0fe2ee08ec0f7a4d8b04b459758c Mon Sep 17 00:00:00 2001
From: frakarr <fcarra79@gmail.com>
Date: Sat, 10 Jan 2026 00:15:51 +0100
Subject: [PATCH] Update ExtraordinaryAdmin.tsx

---
 pages/ExtraordinaryAdmin.tsx | 48 ++++++++++++++++++++++++++----------
 1 file changed, 35 insertions(+), 13 deletions(-)

diff --git a/pages/ExtraordinaryAdmin.tsx b/pages/ExtraordinaryAdmin.tsx
index 7a18aff..f882846 100644
--- a/pages/ExtraordinaryAdmin.tsx
+++ b/pages/ExtraordinaryAdmin.tsx
@@ -2,7 +2,7 @@
 import React, { useEffect, useState } from 'react';
 import { CondoService } from '../services/mockDb';
 import { ExtraordinaryExpense, Family, ExpenseItem, ExpenseShare } from '../types';
-import { Plus, Calendar, FileText, CheckCircle2, Clock, Users, X, Save, Paperclip, Euro, Trash2, Eye, Briefcase, Pencil, Banknote, History } from 'lucide-react';
+import { Plus, Calendar, FileText, CheckCircle2, Clock, Users, X, Save, Paperclip, Euro, Trash2, Eye, Briefcase, Pencil, Banknote, History, Type, AlignLeft } from 'lucide-react';
 
 export const ExtraordinaryAdmin: React.FC = () => {
     const [expenses, setExpenses] = useState<ExtraordinaryExpense[]>([]);
@@ -364,14 +364,33 @@ export const ExtraordinaryAdmin: React.FC = () => {
                             <form id="createForm" onSubmit={handleSubmit} className="space-y-6">
                                 {/* General Info */}
                                 <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-                                    <input className="border p-2 rounded" placeholder="Titolo Lavori" value={formTitle} onChange={e => setFormTitle(e.target.value)} required />
-                                    <input className="border p-2 rounded" placeholder="Azienda Appaltatrice" value={formContractor} onChange={e => setFormContractor(e.target.value)} required />
-                                    <div className="col-span-2">
-                                        <textarea className="w-full border p-2 rounded h-20" placeholder="Descrizione..." value={formDesc} onChange={e => setFormDesc(e.target.value)} />
+                                    <div className="relative">
+                                        <Type className="absolute left-3 top-2.5 w-5 h-5 text-slate-400" />
+                                        <input className="w-full border p-2 pl-10 rounded" placeholder="Titolo Lavori" value={formTitle} onChange={e => setFormTitle(e.target.value)} required />
+                                    </div>
+                                    <div className="relative">
+                                        <Briefcase className="absolute left-3 top-2.5 w-5 h-5 text-slate-400" />
+                                        <input className="w-full border p-2 pl-10 rounded" placeholder="Azienda Appaltatrice" value={formContractor} onChange={e => setFormContractor(e.target.value)} required />
+                                    </div>
+                                    <div className="col-span-2 relative">
+                                        <AlignLeft className="absolute left-3 top-2.5 w-5 h-5 text-slate-400" />
+                                        <textarea className="w-full border p-2 pl-10 rounded h-20" placeholder="Descrizione..." value={formDesc} onChange={e => setFormDesc(e.target.value)} />
                                     </div>
                                     <div className="grid grid-cols-2 gap-2 col-span-2 md:col-span-1">
-                                        <div><label className="text-xs font-bold text-slate-500">Inizio</label><input type="date" className="w-full border p-2 rounded" value={formStart} onChange={e => setFormStart(e.target.value)} required /></div>
-                                        <div><label className="text-xs font-bold text-slate-500">Fine (Prevista)</label><input type="date" className="w-full border p-2 rounded" value={formEnd} onChange={e => setFormEnd(e.target.value)} /></div>
+                                        <div>
+                                            <label className="text-xs font-bold text-slate-500">Inizio</label>
+                                            <div className="relative">
+                                                <Calendar className="absolute left-2 top-2.5 w-4 h-4 text-slate-400" />
+                                                <input type="date" className="w-full border p-2 pl-8 rounded" value={formStart} onChange={e => setFormStart(e.target.value)} required />
+                                            </div>
+                                        </div>
+                                        <div>
+                                            <label className="text-xs font-bold text-slate-500">Fine (Prevista)</label>
+                                            <div className="relative">
+                                                <Calendar className="absolute left-2 top-2.5 w-4 h-4 text-slate-400" />
+                                                <input type="date" className="w-full border p-2 pl-8 rounded" value={formEnd} onChange={e => setFormEnd(e.target.value)} />
+                                            </div>
+                                        </div>
                                     </div>
                                     {!isEditing && (
                                         <div>
@@ -650,12 +669,15 @@ export const ExtraordinaryAdmin: React.FC = () => {
 
                                     <div>
                                         <label className="block text-xs font-bold text-slate-500 uppercase mb-1">Note (Opzionale)</label>
-                                        <input 
-                                            className="w-full border p-2 rounded-lg text-slate-700 text-sm" 
-                                            placeholder="Es. Bonifico, Contanti..." 
-                                            value={payNotes} 
-                                            onChange={e => setPayNotes(e.target.value)} 
-                                        />
+                                        <div className="relative">
+                                            <FileText className="absolute left-3 top-2.5 w-4 h-4 text-slate-400"/>
+                                            <input 
+                                                className="w-full border p-2 pl-9 rounded-lg text-slate-700 text-sm" 
+                                                placeholder="Es. Bonifico, Contanti..." 
+                                                value={payNotes} 
+                                                onChange={e => setPayNotes(e.target.value)} 
+                                            />
+                                        </div>
                                     </div>
 
                                     <button type="submit" disabled={isPaying || payAmount <= 0} className="w-full bg-green-600 text-white p-2.5 rounded-lg hover:bg-green-700 font-bold disabled:opacity-50 flex items-center justify-center gap-2">