Update app.py

app.py

@@ -144,44 +144,9 @@ def get_reading(question, selected_cards):
     return result + "\n\n🌟 May these insights guide your path! 🌟"
 
 
-# ... (이전 코드는 동일)
+# ... (이전 tarot_cards 딕셔너리와 get_reading 함수는 동일)
 
-demo = gr.Interface(
-    fn=get_reading,
-    inputs=[
-        gr.Textbox(
-            label="🤔 What would you like to know?",
-            placeholder="Enter your question here...",
-            lines=3
-        ),
-        gr.CheckboxGroup(  # CheckboxGroup으로 수정
-            choices=list(tarot_cards.keys()),
-            label="🎴 Select Your Cards (Max 5)",
-            info="Choose 1-5 cards for your reading"
-        )
-    ],
-    outputs=gr.Textbox(
-        label="🔮 Your Mystical Reading",
-        lines=20
-    ),
-    title="✨ Mystical Tarot Reading Experience ✨",
-    description="""
-    🌟 Welcome to Your Personal Tarot Journey 🌟
-    
-    🎴 How to Use:
-    1. 💭 Focus on your question
-    2. 🔍 Select 1-5 cards that call to you
-    3. 📖 Receive your personalized mystical reading
-    
-    🌙 Let the ancient wisdom guide your path 🌙
-    """,
-    article="""
-    <div style="text-align: center;">
-        <a href="https://visitorbadge.io/status?path=https%3A%2F%2Fopenfree-tarotcard.hf.space">
-            <img src="https://api.visitorbadge.io/api/visitors?path=https%3A%2F%2Fopenfree-tarotcard.hf.space&countColor=%23263759" />
-        </a>
-    </div>
-    """,
+with gr.Blocks(
     theme=gr.themes.Soft(
         primary_hue="purple",
         secondary_hue="pink",
@@ -209,29 +174,71 @@ demo = gr.Interface(
         padding: 20px;
     }
     """
-)
-
-# 카드 선택 제한을 위한 함수 수정
-def validate_selection(selected_cards):
-    if len(selected_cards) > 5:
-        return selected_cards[:5]
-    return selected_cards
-
-demo.input_components[1].change(
-    fn=validate_selection,
-    inputs=[demo.input_components[1]],
-    outputs=[demo.input_components[1]]
-)
-
-
-
-# Example questions
-examples = [
-    ["What energies surround my current path? 🛣️", ["✨ The Fool ✨", "🎯 The Magician 🎯"]],
-    ["What should I know about my love life? ❤️", ["❤️ The Lovers ❤️", "🌺 The Empress 🌺"]],
-    ["Guide me about my career decisions 💼", ["⚔️ The Emperor ⚔️", "🎡 Wheel of Fortune 🎡"]],
-    ["What's my spiritual lesson for this month? 🙏", ["🕊️ The Hierophant 🕊️", "🏮 The Hermit 🏮", "⭐ The Star ⭐"]]
-]
+) as demo:
+    gr.HTML("""<h1 style='text-align: center'>✨ Mystical Tarot Reading Experience ✨</h1>""")
+    
+    gr.HTML("""
+    <div style='text-align: center'>
+    🌟 Welcome to Your Personal Tarot Journey 🌟<br><br>
+    🎴 How to Use:<br>
+    1. 💭 Focus on your question<br>
+    2. 🔍 Select 1-5 cards that call to you<br>
+    3. 📖 Receive your personalized mystical reading<br><br>
+    🌙 Let the ancient wisdom guide your path 🌙
+    </div>
+    """)
+    
+    with gr.Row():
+        with gr.Column():
+            question = gr.Textbox(
+                label="🤔 What would you like to know?",
+                placeholder="Enter your question here...",
+                lines=3
+            )
+            cards = gr.CheckboxGroup(
+                choices=list(tarot_cards.keys()),
+                label="🎴 Select Your Cards (Max 5)",
+                info="Choose 1-5 cards for your reading"
+            )
+            submit_btn = gr.Button("🔮 Get Your Reading", variant="primary")
+        
+        with gr.Column():
+            output = gr.Textbox(
+                label="🔮 Your Mystical Reading",
+                lines=20
+            )
+    
+    def validate_and_read(question, selected_cards):
+        if not selected_cards:
+            return "⚠️ Please select at least one card for your reading."
+        if len(selected_cards) > 5:
+            selected_cards = selected_cards[:5]
+        return get_reading(question, selected_cards)
+    
+    submit_btn.click(
+        fn=validate_and_read,
+        inputs=[question, cards],
+        outputs=output
+    )
+    
+    # Examples
+    gr.Examples(
+        examples=[
+            ["What energies surround my current path? 🛣️", ["✨ The Fool ✨", "🎯 The Magician 🎯"]],
+            ["What should I know about my love life? ❤️", ["❤️ The Lovers ❤️", "🌺 The Empress 🌺"]],
+            ["Guide me about my career decisions 💼", ["⚔️ The Emperor ⚔️", "🎡 Wheel of Fortune 🎡"]],
+            ["What's my spiritual lesson for this month? 🙏", ["🕊️ The Hierophant 🕊️", "🏮 The Hermit 🏮", "⭐ The Star ⭐"]]
+        ],
+        inputs=[question, cards]
+    )
+    
+    gr.HTML("""
+    <div style="text-align: center; margin-top: 20px;">
+        <a href="https://visitorbadge.io/status?path=https%3A%2F%2Fopenfree-tarotcard.hf.space">
+            <img src="https://api.visitorbadge.io/api/visitors?path=https%3A%2F%2Fopenfree-tarotcard.hf.space&countColor=%23263759" />
+        </a>
+    </div>
+    """)
 
 if __name__ == "__main__":
     demo.launch(share=True)