|
import urllib.parse |
|
import gradio as gr |
|
|
|
|
|
|
|
|
|
def generate_static_badge(label, message, color, label_color, logo, logo_color, style, link): |
|
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 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='')}") |
|
if style: |
|
params.append(f"style={urllib.parse.quote(style, safe='')}") |
|
|
|
badge_url = base + ("?" + "&".join(params) if params else "") |
|
if link: |
|
html_code = f'<a href="{link}" target="_blank"><img src="{badge_url}" alt="badge"></a>' |
|
else: |
|
html_code = f'<img src="{badge_url}" alt="badge">' |
|
|
|
badge_preview = f""" |
|
<div style='padding:20px; background: #fefefe; border-radius: 12px; display: flex; justify-content: center;'> |
|
{html_code} |
|
</div> |
|
""" |
|
return html_code, badge_preview |
|
|
|
|
|
|
|
|
|
with gr.Blocks(theme=gr.themes.Default()) as demo: |
|
gr.HTML(""" |
|
<h1 style="text-align: center; font-size: 2.2em; margin-bottom: 0.2em;">π¨ BadgeCraft - Beautiful Badge Generator</h1> |
|
<p style="text-align: center; font-size: 1.1em; color: #555;">Design stylish shields.io badges with live preview and HTML snippet generation.</p> |
|
|
|
<div align="center" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin: 20px 0; justify-items: center;"> |
|
<a href="https://discord.gg/openfreeai"> |
|
<img alt="Discord" src="https://img.shields.io/badge/Discord-5865F2?style=for-the-badge&logo=discord&logoColor=white" /> |
|
</a> |
|
<a href="https://x.com/openfree_ai"> |
|
<img alt="X" src="https://img.shields.io/badge/X.com-000000?style=for-the-badge&logo=X&logoColor=white" /> |
|
</a> |
|
<a href="https://huggingface.co/collections/VIDraft/best-open-ai-services-68057e6e312880ea92abaf4c"> |
|
<img alt="Collections" src="https://img.shields.io/badge/Collections-F8F8F8?style=for-the-badge&logo=huggingface&logoColor=black" /> |
|
</a> |
|
<a href="https://huggingface.co/VIDraft"> |
|
<img alt="VIDraft" src="https://img.shields.io/badge/VIDraft-FCD022?style=for-the-badge&logo=huggingface&logoColor=black" /> |
|
</a> |
|
<a href="https://github.com/openrunai"> |
|
<img src="https://img.shields.io/badge/GitHub-181717?style=for-the-badge&logo=github&logoColor=white" alt="GitHub"> |
|
</a> |
|
<a href="https://twitter.com/openfree_ai"> |
|
<img src="https://img.shields.io/badge/Twitter-1DA1F2?style=for-the-badge&logo=twitter&logoColor=white" alt="Twitter"> |
|
</a> |
|
<a href="https://www.linkedin.com/company/openfreeai"> |
|
<img src="https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white" alt="LinkedIn"> |
|
</a> |
|
<a href="https://www.youtube.com/@AITechTree"> |
|
<img src="https://img.shields.io/badge/YouTube-FF0000?style=for-the-badge&logo=youtube&logoColor=white" alt="YouTube"> |
|
</a> |
|
<a href="https://huggingface.co/openfreeai"> |
|
<img src="https://img.shields.io/badge/HuggingFace-FCC72E?style=for-the-badge&logo=huggingface&logoColor=black" alt="HuggingFace"> |
|
</a> |
|
</div> |
|
""") |
|
|
|
with gr.Row(): |
|
out_code = gr.Code(label="HTML Snippet", language="html") |
|
out_preview = gr.HTML(label="Badge Preview") |
|
|
|
with gr.Row(): |
|
label = gr.Textbox(label="Label", placeholder="μ: build") |
|
message = gr.Textbox(label="Message", placeholder="μ: passing") |
|
logo = gr.Textbox(label="Logo", placeholder="μ: github") |
|
|
|
with gr.Row(): |
|
color = gr.ColorPicker(label="Color", value="#a0c4ff") |
|
label_color = gr.ColorPicker(label="Label Color", value="#bdb2ff") |
|
logo_color = gr.ColorPicker(label="Logo Color", value="#ffc6ff") |
|
|
|
style = gr.Dropdown(label="Style", choices=["flat", "flat-square", "plastic", "for-the-badge", "social"], value="for-the-badge") |
|
link = gr.Textbox(label="Link (λ°°μ§ ν΄λ¦ μ μ΄λν URL)", placeholder="https://yourlink.com") |
|
|
|
inputs = [label, message, color, label_color, logo, logo_color, style, link] |
|
for inp in inputs: |
|
inp.change(fn=generate_static_badge, inputs=inputs, outputs=[out_code, out_preview]) |
|
|
|
|
|
if __name__ == "__main__": |
|
demo.launch() |