Update app.py

app.py

@@ -7,6 +7,12 @@ from PIL import ImageFont
 import gradio as gr
 from datasets import load_dataset
 
+STYLES = """
+.center {
+  text-align: center;
+}
+"""
+
 titles = []
 stories = []
 
@@ -25,6 +31,11 @@ def gallery_select(gallery, evt: gr.SelectData):
   print(evt.index)
   print(evt.target)
 
+  return [
+      gr.update(value=titles[evt.index], visible=True),
+      gr.update(value=stories[evt.index], visible=True),
+  ]
+
 def get_gallery():
   global titles, stories
     
@@ -45,13 +56,17 @@ def get_gallery():
   print(titles)
   return images
 
-with gr.Blocks() as demo:
+with gr.Blocks(css=STYLES) as demo:
   gallery = gr.Gallery(get_gallery, every=3600, columns=10, height=500, container=False)
 
+  with gr.Column():
+      title = gr.Markdown("title", visible=False, elem_classes=['center'])
+      story = gr.Markdown("stories goes here...", visible=False)
+
   gallery.select(
       fn=gallery_select,
       inputs=[gallery],
-      outputs=None
+      outputs=[title, story]
   )
 
 demo.launch()