Răsfoiți Sursa

style(design): FINDING-001,002 — increase touch targets to 44px+ and improve empty state

Ma 7 luni în urmă
părinte
comite
c74f148cf5
2 a modificat fișierele cu 6 adăugiri și 6 ștergeri
  1. 2 2
      packages/studio/src/App.tsx
  2. 4 4
      packages/studio/src/pages/Dashboard.tsx

+ 2 - 2
packages/studio/src/App.tsx

@@ -59,7 +59,7 @@ export function App() {
               <button
                 key={item.label}
                 onClick={item.action}
-                className={`px-3 py-1.5 rounded-md transition-colors ${
+                className={`px-3 py-2.5 rounded-md transition-colors ${
                   item.active
                     ? "bg-secondary text-foreground"
                     : "hover:bg-secondary/50 hover:text-foreground"
@@ -73,7 +73,7 @@ export function App() {
         <div className="flex items-center gap-3">
           <button
             onClick={() => setTheme(isDark ? "light" : "dark")}
-            className="px-2.5 py-1 rounded-md text-xs font-medium bg-secondary text-muted-foreground hover:text-foreground transition-colors"
+            className="px-3 py-2 rounded-md text-xs font-medium bg-secondary text-muted-foreground hover:text-foreground transition-colors"
           >
             {isDark ? "☀️" : "🌙"}
           </button>

+ 4 - 4
packages/studio/src/pages/Dashboard.tsx

@@ -49,10 +49,10 @@ export function Dashboard({ nav, sse, theme, t }: { nav: Nav; sse: { messages: R
   if (error) return <div className="text-red-400">Error: {error}</div>;
   if (!data?.books.length) {
     return (
-      <div className={`text-center py-20 ${c.muted}`}>
-        <p className="text-xl mb-2">{t("dash.noBooks")}</p>
-        <p className="text-sm mb-4">{t("dash.createFirst")}</p>
-        <button onClick={nav.toBookCreate} className={`px-4 py-2 rounded-md text-sm ${c.btnPrimary}`}>
+      <div className={`text-center py-24 ${c.muted}`}>
+        <p className="text-2xl mb-3 font-medium text-foreground/60">{t("dash.noBooks")}</p>
+        <p className="text-sm mb-6">{t("dash.createFirst")}</p>
+        <button onClick={nav.toBookCreate} className={`px-6 py-3 rounded-lg text-sm font-medium ${c.btnPrimary}`}>
           {t("nav.newBook")}
         </button>
       </div>