Update app.py

app.py

@@ -168,83 +168,16 @@ with gr.Blocks(title="📚 귀여운 스토리 앱") as demo:
         font-size: 1.2em;
         color: #6B4226;
     }
-    </style>
-    """)
-
-    gr.HTML("<h1>🎈 재미있는 영어 스토리 타임! 📖</h1>")
-    gr.HTML("<p>🐱 귀여운 이야기와 함께 영어를 배워보아요! <br> 버튼을 눌러 다음 이야기로 넘어가고, 음성을 들으며 따라 읽어보세요! 🎵</p>")
-
-   # 📌 단모음(Short Vowel) 스토리 데이터
-short_vowel_stories = [
-    {"text": "Sam has a cat.", "image": f"{image_base_url}1.webp"},
-    {"text": "The cat is fat and tan.", "image": f"{image_base_url}2.webp"},
-    {"text": "Sam and the cat nap on a mat.", "image": f"{image_base_url}3.webp"}
-]
-
-# 📌 장모음(Long Vowel) 스토리 데이터
-long_vowel_stories = [
-    {"text": "Kate ate a big cake.", "image": f"{image_base_url}11.webp"},
-    {"text": "The train is late today.", "image": f"{image_base_url}12.webp"},
-    {"text": "I see a green tree.", "image": f"{image_base_url}13.webp"}
-]
-
-# 📌 Blends & Digraphs 스토리 데이터
-blends_digraphs_stories = [
-    {"text": "Blake blows a blue blimp.", "image": f"{image_base_url}21.webp"},
-    {"text": "Brad brings a brown brush.", "image": f"{image_base_url}22.webp"},
-    {"text": "The clock clicks and claps.", "image": f"{image_base_url}23.webp"}
-]
-
-# 📌 "The Red Ball" 스토리 데이터
-the_red_ball_story = [
-    {"text": "Tom has a red ball. He throws the ball up. The ball goes high. Then it falls down!", "image": f"{image_base_url}39.webp"}
-]
-
-# 📌 "The Big Cat" 스토리 데이터
-the_big_cat_story = [
-    {"text": "The cat is big. It jumps on the mat. The mat is soft. The cat takes a nap.", "image": f"{image_base_url}40.webp"}
-]
-
-# 📌 "The Hot Sun" 스토리 데이터
-the_hot_sun_story = [
-    {"text": "The sun is hot. I wear my hat. I drink some water. Now I feel cool!", "image": f"{image_base_url}41.webp"}
-]
-
-# 📌 초기 값 설정
-init_index_short = 0
-init_text_short = short_vowel_stories[0]["text"]
-init_image_short = short_vowel_stories[0]["image"]
-init_audio_short = generate_audio(init_text_short)
-
-init_index_long = 0
-init_text_long = long_vowel_stories[0]["text"]
-init_image_long = long_vowel_stories[0]["image"]
-init_audio_long = generate_audio(init_text_long)
-
-init_index_blends = 0
-init_text_blends = blends_digraphs_stories[0]["text"]
-init_image_blends = blends_digraphs_stories[0]["image"]
-init_audio_blends = generate_audio(init_text_blends)
-
-# 📌 Gradio UI 구성에 새로운 탭 추가
-with gr.Blocks(title="📚 귀여운 스토리 앱") as demo:
-    gr.HTML("""
-    <style>
-    body {
-        background-color: #FFFAF0;
-        font-family: 'Comic Sans MS', cursive, sans-serif;
-    }
-    h1 {
-        color: #FF6347;
-        text-align: center;
-        font-size: 3em;
+    .story-text {
+        font-size: 2.5em;
         font-weight: bold;
-        margin-top: 20px;
-    }
-    p {
         text-align: center;
-        font-size: 1.2em;
-        color: #6B4226;
+        color: #FF4500;
+        padding: 20px;
+        border-radius: 15px;
+        background: #FFF3E0;
+        display: inline-block;
+        box-shadow: 4px 4px 10px rgba(0,0,0,0.2);
     }
     </style>
     """)