bro-wtf / app.py
Wayfindersix's picture
fix: kill span.prose border stealing output box
a1f2bf6
Raw
History Blame Contribute Delete
12.2 kB
"""
Bro, WTF? — Cross-Cultural Language Translator for Generational Sayings.
What your grandma said and what your kid means are the same thing.
"""
import gradio as gr
import os
import random
from huggingface_hub import InferenceClient
HF_TOKEN = os.environ.get("HF_TOKEN", "")
MODEL = "Qwen/Qwen2.5-7B-Instruct"
client = InferenceClient(model=MODEL, token=HF_TOKEN) if HF_TOKEN else None
SYSTEM_PROMPT = """Someone gives you a saying, slang, expression, or phrase from any generation or culture. Your job is to translate it — show the equivalent saying from other generations, other cultures, and other eras. The same feeling, different words.
Rules:
- Give 4 to 5 translations across different generations and/or cultures. Format each as a short line.
- Include the generation or culture for each one (e.g., "Gen Z:", "Your grandma:", "1920s:", "Japanese:", "Southern US:", "Nigerian:", etc.)
- Then add 1-2 sentences explaining the core feeling underneath all of them — the universal thing that doesn't change.
- Don't explain what each one means individually. Just show them side by side. The parallels are obvious.
- Be funny. Be accurate. Don't be condescending about any generation.
- The point is: every generation thinks they invented their slang, but nobody invented the feeling. It just keeps getting new clothes.
- Talk like a friend who hangs out with their grandparents AND their younger cousins."""
SAYINGS = [
"that's cap",
"cool beans",
"it's giving",
"the bee's knees",
"slay",
"gag me with a spoon",
"no cap",
"groovy",
"it's the vibe",
"far out",
"that slaps",
"rad",
"period.",
"right on",
"lowkey",
"word",
"bussin",
"tubular",
"sus",
"you're being extra",
"keeping it 100",
"don't have a cow",
]
FALLBACKS = [
'**that\'s cap**\n\n- Gen Z: "That\'s cap"\n- Millennials: "Yeah, no"\n- Gen X: "Whatever"\n- Boomers: "That\'s a load of malarkey"\n- 1940s: "Tell it to Sweeney"\n- British: "Pull the other one"\n\nEvery generation has needed a way to say "I don\'t believe you and I want you to know I don\'t believe you." The word changes. The raised eyebrow doesn\'t.',
'**slay**\n\n- Gen Z: "Slay"\n- Millennials: "Killing it"\n- Gen X: "Nailed it"\n- Boomers: "Knocked it out of the park"\n- 1920s: "You\'re the cat\'s meow"\n- Drag culture (origin): "Slay"\n\nThe word came from ballroom culture, went mainstream, and now your aunt uses it on Facebook. Every generation needs a word for "you showed up and nobody could look away." The word travels but the crown stays.',
'**no cap**\n\n- Gen Z: "No cap"\n- Millennials: "Dead serious"\n- Gen X: "For real"\n- Boomers: "I kid you not"\n- 1950s: "On the level"\n- Southern: "I ain\'t lyin\'"\n\nHumans have always needed a way to say "I know this sounds like I\'m exaggerating but I promise I\'m not." The fact that we need this phrase at all says something — we lie so often we need a special word for when we stop.',
'**it\'s giving**\n\n- Gen Z: "It\'s giving"\n- Millennials: "It has that vibe"\n- Gen X: "It\'s very"\n- Boomers: "It reminds me of"\n- 1930s: "It\'s got that certain something"\n- French: "Je ne sais quoi"\n\nSometimes a thing radiates an energy and you can\'t name it exactly, you can only point at it. Every generation has fumbled for this word. "Giving" is just the latest attempt to describe the indescribable.',
'**groovy**\n\n- 1960s: "Groovy"\n- Gen X: "Cool"\n- Millennials: "Sick"\n- Gen Z: "Fire"\n- 1920s: "The cat\'s pajamas"\n- Australian: "Ripper"\n\nThe approval word. Every generation picks one, rides it until it\'s embarrassing, and then the next generation picks a new one and pretends the old one never existed. The feeling of "yes, this, more of this" never goes out of style. Just the word does.',
'**lowkey**\n\n- Gen Z: "Lowkey"\n- Millennials: "Honestly"\n- Gen X: "Between you and me"\n- Boomers: "Just between us"\n- 1940s: "On the QT"\n- British: "Rather"\n\nEvery generation needs a way to confess something small without making it a big deal. "Lowkey" is just the latest version of whispering an opinion so you can deny it later if it goes badly.',
'**bussin**\n\n- Gen Z: "Bussin"\n- Millennials: "So good"\n- Gen X: "Killer"\n- Boomers: "Out of this world"\n- 1950s: "Dynamite"\n- Southern: "Slap your mama good"\n\nFood has always needed its own category of compliment. Regular good isn\'t enough. When something tastes right, every generation reaches for a word that means "this is beyond the normal scale of good." The word changes every decade. The second helping doesn\'t.',
'**sus**\n\n- Gen Z: "Sus"\n- Millennials: "Sketchy"\n- Gen X: "Shady"\n- Boomers: "Fishy"\n- 1940s: "On the nose"\n- Universal: side-eye\n\nHumans are pattern-matchers. When something doesn\'t add up, we\'ve always had a one-syllable alarm for it. "Sus" is just the newest bark from the oldest instinct — something\'s off and I want you to know I noticed.',
'**period.**\n\n- Gen Z: "Period."\n- Millennials: "End of story"\n- Gen X: "Done"\n- Boomers: "That\'s that"\n- 1920s: "And that\'s the final word"\n- Courtroom: "Case closed"\n\nSometimes you say something and you don\'t want a discussion about it. You want a punctuation mark, not a conversation. Every generation has found a way to put a verbal period at the end of a sentence so hard it closes the paragraph.',
]
def find_fallback(thing):
if thing:
thing_lower = thing.lower().strip()
for fb in FALLBACKS:
try:
fb_topic = fb.split("**")[1].lower()
if thing_lower == fb_topic or (thing_lower in fb_topic and len(thing_lower) > 5):
return fb
except (IndexError, ValueError):
continue
return random.choice(FALLBACKS)
def translate(user_input):
saying = user_input.strip() if user_input and user_input.strip() else ""
if client and saying:
try:
response = client.chat_completion(
messages=[
{"role": "system", "content": SYSTEM_PROMPT},
{"role": "user", "content": f"The saying or expression: {saying}"},
],
max_tokens=500,
temperature=0.85,
)
result = response.choices[0].message.content
if result and result.strip():
return f"**{saying}**\n\n{result.strip()}"
except Exception:
pass
return find_fallback(saying)
def translate_random():
return translate("")
CUSTOM_CSS = """
@import url('https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Inter:wght@300;400;500;600&display=swap');
body, .gradio-container {
background: #f5f5f8 !important;
font-family: 'Inter', sans-serif !important;
color: #1a1a2e !important;
}
footer { display: none !important; }
.app-header { text-align: center; padding: 28px 20px 8px; }
.app-header h1 {
font-family: 'Space Mono', monospace; font-size: 2.4rem; font-weight: 700;
background: linear-gradient(135deg, #f0c030, #e06060);
-webkit-background-clip: text; -webkit-text-fill-color: transparent; margin: 0;
}
.app-header .sub { color: #777777; font-size: 0.88rem; margin-top: 6px; font-weight: 300; letter-spacing: 0.04em; }
.app-visual { text-align: center; font-size: 5rem; padding: 12px 0 4px; filter: drop-shadow(0 0 20px rgba(240, 192, 48, 0.3)); }
.input-box textarea { background: #ffffff !important; border: 1px solid #d0d0d8 !important; color: #1a1a2e !important; font-family: 'Inter', sans-serif !important; border-radius: 12px !important; font-size: 0.95rem !important; }
.input-box textarea::placeholder { color: #888888 !important; }
.input-box textarea:focus { border-color: #f0c030 !important; box-shadow: 0 0 20px rgba(240, 192, 48, 0.15) !important; }
.input-box label, .output-box label { color: #666666 !important; font-family: 'Space Mono', monospace !important; font-size: 0.75rem !important; letter-spacing: 0.05em !important; }
button.primary { background: linear-gradient(135deg, #f0c030, #e08030) !important; border: none !important; color: #fff !important; font-family: 'Space Mono', monospace !important; font-size: 1.1rem !important; font-weight: 700 !important; border-radius: 24px !important; padding: 12px 40px !important; box-shadow: 0 4px 20px rgba(240, 192, 48, 0.3) !important; }
button.primary:hover { box-shadow: 0 4px 30px rgba(240, 192, 48, 0.5) !important; }
button.secondary { background: transparent !important; border: 1px solid rgba(240, 192, 48, 0.3) !important; color: #f0c030 !important; font-family: 'Space Mono', monospace !important; font-size: 0.8rem !important; border-radius: 20px !important; }
button.secondary:hover { background: rgba(240, 192, 48, 0.1) !important; }
.output-box .prose { background: #ffffff !important; border: 1px solid #e0e0e8 !important; border-radius: 12px !important; padding: 24px !important; color: #1a1a2e !important; font-size: 0.95rem !important; line-height: 1.7 !important; }
.output-box .prose, .output-box .prose *, .output-box .md, .output-box .md *,
.output-box p, .output-box span, .output-box div {
color: #1a1a2e !important;
background: #ffffff !important;
}
.output-box .prose strong { color: #f0d060 !important; font-family: 'Space Mono', monospace !important; }
.output-box .block { border: none !important; border-style: none !important; overflow: visible !important; box-shadow: none !important; padding: 0 !important; }
.output-box .hide-container { border: none !important; border-style: none !important; }
.output-box .wrap.hide { display: none !important; }
.output-box .label-wrap { display: none !important; }
.output-box span.prose, .output-box span.md { border: none !important; padding: 0 !important; display: inline !important; }
.output-box .prose:empty, .output-box div.prose:has(span:empty) { border: none !important; padding: 0 !important; min-height: 0 !important; }
.footer-text { text-align: center; padding: 20px; color: #777777; font-size: 0.65rem; font-weight: 300; letter-spacing: 0.05em; }
.footer-text a { color: #f0c030; text-decoration: none; }
"""
with gr.Blocks(css=CUSTOM_CSS, title="Bro, WTF?", theme=gr.themes.Base()) as demo:
gr.HTML("""
<div class="app-header">
<h1>Bro, WTF?</h1>
<div class="sub">Generational Slang Translator: From groovy to lit and how we got there</div>
</div>
""")
with gr.Column(elem_classes="input-box"):
user_input = gr.Textbox(
label="Drop a saying from any generation",
placeholder="that's cap, groovy, slay, cool beans, far out, it's giving...",
lines=1, max_lines=1,
)
with gr.Row():
go_btn = gr.Button("Translate it", variant="primary", size="lg")
random_btn = gr.Button("Surprise me", variant="secondary", size="sm")
with gr.Column(elem_classes="output-box"):
output = gr.Markdown(label="")
gr.Markdown("**Or try one of these:**")
with gr.Row():
ex1 = gr.Button("that's cap", variant="secondary", size="sm")
ex2 = gr.Button("slay", variant="secondary", size="sm")
ex3 = gr.Button("groovy", variant="secondary", size="sm")
with gr.Row():
ex4 = gr.Button("lowkey", variant="secondary", size="sm")
ex5 = gr.Button("it's giving", variant="secondary", size="sm")
ex6 = gr.Button("surprise me", variant="secondary", size="sm")
go_btn.click(translate, [user_input], [output])
random_btn.click(translate_random, [], [output])
ex1.click(lambda: translate("that's cap"), [], [output])
ex2.click(lambda: translate("slay"), [], [output])
ex3.click(lambda: translate("groovy"), [], [output])
ex4.click(lambda: translate("lowkey"), [], [output])
ex5.click(lambda: translate("it's giving"), [], [output])
ex6.click(translate_random, [], [output])
gr.HTML('<div class="footer-text">Heuremen — Let\'s stay connected and keep information free.<br><a href="https://heuremenforprofit.online">heuremenforprofit.online</a></div>')
if __name__ == "__main__":
demo.launch()