Merge pull request #49 from APPLEPIE6969/jules/improve-empty-state-16361504949954079861

Improve EmptyState visuals and fix VoiceInput lint errors

Author: APPLEPIE6969

check-csp.ts

@@ -23,15 +23,18 @@ export function EmptyState({
 }: EmptyStateProps) {
     return (
         <div className={`flex flex-col items-center justify-center py-12 px-6 text-center animate-fade-in ${className}`}>
-            <div className="flex h-16 w-16 items-center justify-center rounded-2xl bg-primary/10 text-primary mb-4 animate-scale-in">
+            <div className="flex h-16 w-16 items-center justify-center rounded-2xl bg-primary/10 text-primary mb-4 animate-scale-in transition-transform hover:scale-110">
                 <span className="material-symbols-outlined text-3xl">{icon}</span>
             </div>
             <h3 className="text-lg font-bold text-slate-900 dark:text-white mb-2">
                 {title}
             </h3>
-            <p className="text-sm text-slate-500 dark:text-[#a69db9] max-w-sm mb-6">
+            <p className="text-sm text-slate-500 dark:text-[#a69db9] max-w-sm mb-2">
                 {description}
             </p>
+            <p className="mt-2 text-xs font-semibold text-primary uppercase tracking-widest mb-6">
+                Ready when you are!
+            </p>
             {actionLabel && (
                 actionHref ? (
                     <Link

components/EmptyState.tsx

@@ -159,11 +159,11 @@ export function VoiceInput({ onAudioSend, disabled }: VoiceInputProps) {
                             <ul className="text-[11px] text-slate-500 dark:text-text-secondary space-y-2">
                                 <li className="flex gap-2">
                                     <span className="text-primary font-bold">1.</span>
-                                    <span>Click the **lock icon** 🔒 next to the URL and reset the Microphone permission to "Allow".</span>
+                                    <span>Click the **lock icon** 🔒 next to the URL and reset the Microphone permission to &quot;Allow&quot;.</span>
                                 </li>
                                 <li className="flex gap-2">
                                     <span className="text-primary font-bold">2.</span>
-                                    <span>Check **Windows Settings &gt; Privacy &gt; Microphone** and ensure "Allow apps to access your microphone" is ON.</span>
+                                    <span>Check **Windows Settings &gt; Privacy &gt; Microphone** and ensure &quot;Allow apps to access your microphone&quot; is ON.</span>
                                 </li>
                                 <li className="flex gap-2">
                                     <span className="text-primary font-bold">3.</span>