app.py

import urllib.parse
import gradio as gr

def generate_static_badge(label, message, color, style, label_color, logo, logo_color):
    base = "https://img.shields.io/static/v1"
    params = []
    if label:
        params.append(f"label={urllib.parse.quote(label, safe='')}")
    if message:
        params.append(f"message={urllib.parse.quote(message, safe='')}")
    if color:
        params.append(f"color={urllib.parse.quote(color, safe='')}")
    if style:
        params.append(f"style={urllib.parse.quote(style, safe='')}")
    if label_color:
        params.append(f"labelColor={urllib.parse.quote(label_color, safe='')}")
    if logo:
        params.append(f"logo={urllib.parse.quote(logo, safe='')}")
    if logo_color:
        params.append(f"logoColor={urllib.parse.quote(logo_color, safe='')}")

    url = base + ("?" + "&".join(params) if params else "")
    # HTML snippet
    html_code = f'<img src="{url}" alt="{label or message} badge">'

    # HTML 컴포넌트로 그대로 보여줄 미리보기(크기 지정 가능)
    preview_html = f"""
    <div style="display:inline-block; padding:10px; border:1px solid #ccc;">
        <img src="{url}" alt="Badge Preview">
    </div>
    """
    return html_code, preview_html


with gr.Blocks() as demo:
    gr.Markdown("## Shields.io Badge Generator 🛠")
    
    with gr.Row():
        lbl = gr.Textbox(label="Label")
        msg = gr.Textbox(label="Message")
    with gr.Row():
        col = gr.Textbox(label="Color", value="blue")
        lbl_col = gr.Textbox(label="Label Color")
    with gr.Row():
        logo_in = gr.Textbox(label="Logo")
        logo_col = gr.Textbox(label="Logo Color")
    style_in = gr.Dropdown(
        label="Style",
        choices=["flat", "flat-square", "plastic", "for-the-badge", "social"],
        value="flat"
    )

    out_code = gr.Code(label="HTML Snippet", language="html")
    out_html = gr.HTML(label="Preview")

    inputs = [lbl, msg, col, style_in, lbl_col, logo_in, logo_col]
    for inp in inputs:
        inp.change(fn=generate_static_badge, inputs=inputs, outputs=[out_code, out_html])

demo.launch()