Update app.py

app.py

@@ -24,7 +24,6 @@ def draw_text_block(draw, text, img_w, y, font, fill, stroke_fill, stroke_width,
         bbox = draw.textbbox((0, 0), line, font=font, stroke_width=stroke_width)
         line_heights.append(bbox[3] - bbox[1])
 
-    total_h = sum(line_heights) + (len(lines) - 1) * int(font.size * 0.25)
     curr_y = y
     for i, line in enumerate(lines):
         w = draw.textlength(line, font=font, stroke_width=stroke_width)
@@ -37,7 +36,7 @@ def draw_text_block(draw, text, img_w, y, font, fill, stroke_fill, stroke_width,
         draw.text((x, curr_y), line, font=font, fill=fill,
                   stroke_width=stroke_width, stroke_fill=stroke_fill)
         curr_y += line_heights[i] + int(font.size * 0.25)
-    return curr_y, total_h
+    return curr_y
 
 def make_meme(
     image, top_text, bottom_text,
@@ -62,24 +61,19 @@ def make_meme(
         fill=text_color, stroke_fill=outline_color, stroke_width=stroke, align=align
     )
 
-    # Measure bottom block
-    tmp = Image.new("RGBA", img.size, (0, 0, 0, 0))
-    mdraw = ImageDraw.Draw(tmp)
-    lines = []
-    max_chars = max(12, min(30, w // 30))
-    for paragraph in (bottom_text or "").split("\n"):
-        wrapped = textwrap.wrap(paragraph, width=max_chars)
-        lines.extend(wrapped if wrapped else [""])
-    line_heights = [mdraw.textbbox((0, 0), line, font=font, stroke_width=stroke)[3] for line in lines]
+    # Bottom
+    lines = textwrap.wrap(bottom_text or "", width=max(20, w // 30))
+    line_heights = [draw.textbbox((0,0), l, font=font, stroke_width=stroke)[3] for l in lines]
     total_bottom_h = sum(line_heights) + (len(lines) - 1) * int(font.size * 0.25)
-
     bottom_y_start = int(h - total_bottom_h - h * 0.03) - int(bottom_nudge)
+
     draw_text_block(
         draw=draw, text=(bottom_text or "").strip(), img_w=w, y=bottom_y_start, font=font,
         fill=text_color, stroke_fill=outline_color, stroke_width=stroke, align=align
     )
     return img
 
+# Theme (compatible version)
 THEME = gr.themes.Soft(
     primary_hue="indigo",
     secondary_hue="violet",
@@ -88,7 +82,6 @@ THEME = gr.themes.Soft(
     button_border_width="0px",
     button_large_padding="14px",
     button_large_radius="14px",
-    radius_md="14px",
     body_background_fill_dark="linear-gradient(180deg, #0b0f17 0%, #0a0920 100%)",
     block_shadow="none",
 )
@@ -98,49 +91,33 @@ CUSTOM_CSS = """
 * { -webkit-tap-highlight-color: transparent; }
 .gradio-container { padding: 10px; max-width: 820px; margin: 0 auto; }
 h2, p { text-align:center }
-#stickybar { position: sticky; bottom: 0; z-index: 50; backdrop-filter: blur(8px); }
-#stickybar .gr-button { width: 100%; font-weight: 700; }
-@media (max-width: 640px){
-  .gradio-container { padding: 8px; }
-  .compact .gr-form{ gap:8px }
-}
 """
 
-with gr.Blocks(theme=THEME, css=CUSTOM_CSS, fill_height=True, analytics_enabled=False) as demo:
+with gr.Blocks(theme=THEME, css=CUSTOM_CSS) as demo:
     gr.Markdown("<h2>📱 Mobile Meme Maker</h2><p>Upload → Type → Download. Built on iPhone, for iPhone.</p>")
 
-    with gr.Row(equal_height=False, elem_classes="compact"):
-        with gr.Column(scale=1):
+    with gr.Row():
+        with gr.Column():
             in_img = gr.Image(type="pil", label="Upload photo", height=320)
-
-            with gr.Accordion("Text & Style", open=True):
-                top_text = gr.Textbox(label="Top text", value="WHEN THE WIFI JUST WORKS", autofocus=True)
-                bottom_text = gr.Textbox(label="Bottom text", value="CHEF'S KISS")
-                align = gr.Radio(choices=["left", "center", "right"], value="center", label="Alignment", inline=True)
-                font_size = gr.Slider(8, 22, value=12, step=1, label="Font size (% of width)")
-                stroke_width = gr.Slider(0, 14, value=4, step=1, label="Outline thickness")
-                with gr.Row():
-                    text_color = gr.ColorPicker(value="#FFFFFF", label="Text")
-                    outline_color = gr.ColorPicker(value="#000000", label="Outline")
-
-            with gr.Accordion("Position Nudges", open=False):
-                top_nudge = gr.Slider(-300, 300, value=0, step=1, label="Top text nudge (px)")
-                bottom_nudge = gr.Slider(-300, 300, value=0, step=1, label="Bottom text nudge (px)")
-
-        with gr.Column(scale=1):
+            top_text = gr.Textbox(label="Top text", value="WHEN THE WIFI JUST WORKS")
+            bottom_text = gr.Textbox(label="Bottom text", value="CHEF'S KISS")
+            align = gr.Radio(choices=["left", "center", "right"], value="center", label="Alignment", inline=True)
+            font_size = gr.Slider(8, 22, value=12, step=1, label="Font size (% of width)")
+            stroke_width = gr.Slider(0, 14, value=4, step=1, label="Outline thickness")
+            with gr.Row():
+                text_color = gr.ColorPicker(value="#FFFFFF", label="Text")
+                outline_color = gr.ColorPicker(value="#000000", label="Outline")
+            with gr.Row():
+                top_nudge = gr.Slider(-300, 300, value=0, step=1, label="Top nudge (px)")
+                bottom_nudge = gr.Slider(-300, 300, value=0, step=1, label="Bottom nudge (px)")
+
+        with gr.Column():
             out = gr.Image(type="pil", label="Preview / Download", height=440, show_download_button=True)
             generate = gr.Button("✨ Generate", size="lg")
-            gr.Markdown(
-                "<div id='stickybar'>"
-                "<div class='container' style='display:flex; gap:10px; margin-top:8px;'>"
-                "</div></div>"
-            )
 
-    # Generate action
     inputs = [in_img, top_text, bottom_text, font_size, stroke_width, text_color, outline_color, align, top_nudge, bottom_nudge]
     generate.click(fn=make_meme, inputs=inputs, outputs=out)
 
-    # Live preview as you change things
     for comp in inputs:
         comp.change(fn=make_meme, inputs=inputs, outputs=out, show_progress=False)