Update app.py

app.py

@@ -552,10 +552,10 @@ def _render_preview(otf_path, font_name):
     try:
         from PIL import Image, ImageDraw, ImageFont
         sample = f"{font_name}\nAa Bb Cc 123\nThe quick brown fox"
-        img = Image.new("RGB", (1100, 520), "white")
+        img = Image.new("RGB", (1700, 620), "white")
         draw = ImageDraw.Draw(img)
-        font = ImageFont.truetype(otf_path, 90)
-        draw.multiline_text((40, 40), sample, font=font, fill="black", spacing=24)
+        font = ImageFont.truetype(otf_path, 150)
+        draw.multiline_text((40, 30), sample, font=font, fill="black", spacing=30)
         return img
     except Exception as e:
         print(f"⚠️ Preview failed: {e}")
@@ -594,8 +594,7 @@ def generate(prompt, control_image, progress=gr.Progress(track_tqdm=True)):
 
     gallery = [(img1, "Uppercase"), (img2, "Lowercase"), (img3, "Punctuation")]
     preview = _render_preview(otf_path, font_name)
-    status = f"<span class='dot'></span> <b>{font_name}</b><span class='sep'>/</span>seed <code>{seed}</code>"
-    return gallery, preview, otf_path, status
+    return gallery, preview, otf_path
 
 
 # =============================================================================
@@ -842,30 +841,7 @@ CSS = """
 #otf-file .unpadded_box, #otf-file .empty { min-height: 56px !important; height: 56px !important; }
 #preview-img .unpadded_box, #preview-img .empty { min-height: 96px !important; }
 
-/* Status line */
-.status-line { min-height: 22px; }
-.status-line p {
-    font-family: var(--grotesk) !important;
-    font-size: 13px !important;
-    color: var(--ink) !important;
-    margin: 0 !important;
-    letter-spacing: 0.02em;
-}
-.status-line b { font-weight: 700; }
-.status-line code {
-    font-family: var(--mono);
-    font-size: 12px;
-    color: var(--ink);
-    background: transparent;
-}
-.status-line .sep { color: var(--grey); margin: 0 8px; }
-.status-line .dot {
-    display: inline-block;
-    width: 9px; height: 9px;
-    background: var(--red);
-    margin-right: 10px;
-    vertical-align: baseline;
-}
+/* Progress bar in red, flat — single gauge inside the grids block */
 
 /* Progress bar in red, flat — single gauge inside the grids block */
 .gradio-container .progress-bar { background: var(--red) !important; }
@@ -913,15 +889,14 @@ with gr.Blocks(title="Typotopia", theme=THEME, css=CSS) as demo:
             btn = gr.Button("Generate font", variant="primary", elem_classes=["go-btn"])
         with gr.Column(scale=1):
             gr.HTML("<p class='eyebrow'><span class='idx'>02</span>Specimen</p>")
-            status = gr.HTML(elem_classes=["status-line"])
             otf_file = gr.File(label="Download .otf", height=56, elem_id="otf-file")
-            preview = gr.Image(label="Preview", type="pil", height=110, elem_id="preview-img")
+            preview = gr.Image(label="Preview", type="pil", height=150, elem_id="preview-img")
             gallery = gr.Gallery(label="Generated grids", columns=3, height=150, object_fit="contain", elem_id="grids")
 
     btn.click(
         generate,
         inputs=[prompt, control_image],
-        outputs=[gallery, preview, otf_file, status],
+        outputs=[gallery, preview, otf_file],
         show_progress="full",
         show_progress_on=gallery,
     )