From 7da20c37c179552b9b2c48c098d83ecdb0b936c2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= <valknar@pivoine.art>
Date: Sun, 1 Mar 2026 08:33:28 +0100
Subject: [PATCH] fix: move generate button into App Details card, stretch to
 full height

App Details card is now flex-1 min-h-0 so it fills the remaining left
column height, matching the right panel. Generate/Reset buttons are
pinned at the bottom of the card with a border-t divider.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 components/favicon/FaviconGenerator.tsx | 40 ++++++++++++-------------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/components/favicon/FaviconGenerator.tsx b/components/favicon/FaviconGenerator.tsx
index 1d3d06f..c9a0d5e 100644
--- a/components/favicon/FaviconGenerator.tsx
+++ b/components/favicon/FaviconGenerator.tsx
@@ -116,11 +116,11 @@ export function FaviconGenerator() {
           </div>
 
           {/* App config */}
-          <div className="glass rounded-xl p-4 shrink-0">
-            <span className="text-[10px] font-semibold text-muted-foreground uppercase tracking-widest block mb-3">
+          <div className="glass rounded-xl p-4 flex-1 min-h-0 flex flex-col overflow-hidden">
+            <span className="text-[10px] font-semibold text-muted-foreground uppercase tracking-widest block mb-3 shrink-0">
               App Details
             </span>
-            <div className="space-y-3">
+            <div className="space-y-3 flex-1 min-h-0 overflow-y-auto scrollbar-thin scrollbar-thumb-primary/20 scrollbar-track-transparent pr-0.5">
               <div>
                 <label className="text-[10px] text-muted-foreground/60 font-mono mb-1.5 block">App Name</label>
                 <input
@@ -179,25 +179,25 @@ export function FaviconGenerator() {
                 </div>
               </div>
             </div>
-          </div>
 
-          {/* Action buttons */}
-          <div className="flex gap-2 shrink-0 mt-auto">
-            {result && (
-              <button onClick={handleReset} className={cn(actionBtn, 'px-4')}>
-                Reset
+            {/* Action buttons */}
+            <div className="flex gap-2 shrink-0 pt-3 mt-3 border-t border-border/25">
+              {result && (
+                <button onClick={handleReset} className={cn(actionBtn, 'px-4')}>
+                  Reset
+                </button>
+              )}
+              <button
+                onClick={handleGenerate}
+                disabled={!sourceFile || isGenerating}
+                className={cn(actionBtn, 'flex-1 py-2.5')}
+              >
+                {isGenerating
+                  ? <><Loader2 className="w-3 h-3 animate-spin" /> Generating… {progress}%</>
+                  : 'Generate Favicons'
+                }
               </button>
-            )}
-            <button
-              onClick={handleGenerate}
-              disabled={!sourceFile || isGenerating}
-              className={cn(actionBtn, 'flex-1 py-2.5')}
-            >
-              {isGenerating
-                ? <><Loader2 className="w-3 h-3 animate-spin" /> Generating… {progress}%</>
-                : 'Generate Favicons'
-              }
-            </button>
+            </div>
           </div>
         </div>