File size: 2,833 Bytes
ebe1056
9f12d53
82939de
 
9f12d53
 
82939de
017e3ec
90fbc88
017e3ec
82939de
 
 
3b64a98
c1178f7
e801e50
82939de
 
 
70f58dd
82939de
 
 
91afa6d
82939de
 
167906a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
24c8fe8
167906a
 
 
 
 
 
 
24c8fe8
167906a
 
 
 
24c8fe8
6e6e647
82939de
 
 
 
 
9f12d53
ebe1056
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<html>
<head>
    <script type="module" crossorigin src="https://cdn.jsdelivr.net/npm/@gradio/lite/dist/lite.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@gradio/lite/dist/lite.css" />
</head>
<body>
<gradio-lite>
<gradio-requirements>
transformers-js-py
</gradio-requirements>
<gradio-file name="app.py" entrypoint>
from transformers_js import pipeline
import gradio as gr

fortune_generator = await pipeline('text-generation', 'Xenova/Qwen1.5-0.5B-Chat')

async def generate_fortune(name):
    if not name.strip():
        return "Please enter your name to receive a fortune."
    
    prompt = f"Fortune for {name}: In the near future, you will"
    result = await fortune_generator(prompt, max_new_tokens=30, temperature=0.7)
    fortune = result[0]['generated_text'].replace(prompt, '')
    
    return f"{name.strip()}, your fortune: In the near future, you will{fortune}"

custom_css = """
.container {
    max-width: 800px !important;
    margin: auto !important;
    padding: 20px !important;
}
.title {
    text-align: center !important;
    color: #FF6B6B !important;
    font-size: 2.5rem !important;
    margin-bottom: 20px !important;
}
.subtitle {
    text-align: center !important;
    color: #4ECDC4 !important;
    font-size: 1.2rem !important;
    margin-bottom: 30px !important;
}
.input-box, .output-box {
    border: 2px solid #FF6B6B !important;
    border-radius: 10px !important;
}
.generate-btn {
    background-color: #FF6B6B !important;
    color: white !important;
    font-size: 1.2rem !important;
    padding: 10px 20px !important;
    border-radius: 20px !important;
    transition: all 0.3s ease !important;
}
.generate-btn:hover {
    background-color: #4ECDC4 !important;
    transform: scale(1.05) !important;
}
.footer {
    text-align: center !important;
    margin-top: 30px !important;
    font-style: italic !important;
}
"""

with gr.Blocks(
    title="Viral Fortune Cookie Generator",
    theme=gr.themes.Soft(
        primary_hue="pink",
        secondary_hue="blue",
    ),
    css=custom_css
) as demo:
    with gr.Column(elem_classes="container"):
        gr.Markdown("# AI Fortune Cookie Generator", elem_classes="title")
        gr.Markdown("Discover your future with our AI-powered fortune cookies! Share your unique fortune with friends!", elem_classes="subtitle")
        
        name_input = gr.Textbox(label="Your Name", placeholder="Enter your name here...", elem_classes="input-box")
        fortune_output = gr.Textbox(label="Your AI-Generated Fortune", elem_classes="output-box", lines=3)
        submit_button = gr.Button("Reveal Your Cosmic Fortune", elem_classes="generate-btn")
            
    submit_button.click(fn=generate_fortune, inputs=name_input, outputs=fortune_output)

demo.launch()
</gradio-file>
</gradio-lite>
</body>
</html>