File size: 2,940 Bytes
e037628 |
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 91 92 93 94 95 96 97 98 99 100 101 102 103 |
import os
import gradio as gr
from google.generativeai import configure
from ui.story_interface import create_story_interface
import config
def main():
# Configure Google API
configure(api_key=config.GOOGLE_API_KEY)
# Custom CSS for better narration display
custom_css = """
.story-narration-box {
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%) !important;
border: 3px solid #6366f1 !important;
border-radius: 16px !important;
padding: 24px !important;
margin: 24px 0 !important;
box-shadow: 0 8px 20px rgba(99, 102, 241, 0.15) !important;
line-height: 1.8 !important;
color: #1e293b !important;
font-size: 16px !important;
min-height: 120px !important;
}
.story-narration-box h3 {
color: #4338ca !important;
border-bottom: 3px solid #6366f1 !important;
padding-bottom: 12px !important;
margin-bottom: 20px !important;
font-size: 20px !important;
font-weight: bold !important;
text-align: center !important;
}
.story-narration-box p {
margin-bottom: 16px !important;
text-align: left !important;
color: #334155 !important;
font-size: 16px !important;
line-height: 1.7 !important;
font-weight: 500 !important;
}
.story-narration-box div {
color: #334155 !important;
font-size: 16px !important;
}
#story_narration {
max-height: 600px !important;
overflow-y: auto !important;
border: 2px solid #e2e8f0 !important;
border-radius: 12px !important;
background-color: #f8fafc !important;
}
#scene_narration {
max-height: 500px !important;
overflow-y: auto !important;
border: 2px solid #e2e8f0 !important;
border-radius: 12px !important;
}
/* Ensure all text in narration boxes is visible and prominent */
#story_narration *, #scene_narration * {
color: #334155 !important;
font-size: 16px !important;
}
#story_narration h3, #scene_narration h3 {
color: #4338ca !important;
font-size: 20px !important;
text-align: center !important;
}
/* Style for quick narration lines */
.story-narration-box em {
color: #64748b !important;
font-style: italic !important;
text-align: center !important;
display: block !important;
margin: 20px 0 !important;
}
"""
# Create and launch the Gradio interface
with gr.Blocks(
theme=gr.themes.Soft(primary_hue="indigo", secondary_hue="blue"),
css=custom_css
) as demo:
create_story_interface(demo)
demo.launch(
server_name="0.0.0.0", # Allows external access
server_port=7860,
share=False, # Set to True if you want a public link
debug=True
)
if __name__ == "__main__":
main()
|