Update app.py

app.py

@@ -2,31 +2,91 @@
 import gradio as gr
 from gradio_buttontip import ButtonTip
 
-def button_click():
-    return "Button clicked!"
+def submit():
+    return gr.Button(value='New Left Button'), gr.Button(value='New Right Button')
 
-with gr.Blocks() as demo:
+
+css = """
+.icon-button {
+    display: flex;
+    background-color: transparent;
+    border: none;
+    box-shadow: none;
+    padding: 0px 0px;
+    justify-content: center;
+    align-items: center;
+    max-height: 24px;
+    min-height: 24px;
+    max-width: 24px !important;
+    min-width: 24px !important;
+}
+"""
+
+CIMStheme = gr.themes.Soft().set(
+    button_primary_background_fill='#000D65',
+    button_primary_border_color='#000D65',
+    button_secondary_background_fill='#FFFFFF',
+    button_primary_background_fill_hover='#454E8E',
+    block_title_text_color='#000D65',
+    block_title_background_fill='#E6E7F0',
+    block_label_background_fill='#E6E7F0',
+    block_label_text_color='#000D65',
+    button_secondary_border_color='#000D65',
+    button_secondary_text_color='#000D65',
+    button_border_width='2px',
+    checkbox_label_background_fill='#F9FAFB',
+    checkbox_label_background_fill_selected='#E6E7F0',
+    checkbox_background_color_selected='#000D65',
+    checkbox_border_color_selected='#000D65',
+    checkbox_border_color='#E5E7EB',
+    checkbox_background_color='#F9FAFB',
+    checkbox_label_border_color='#ababab',
+    checkbox_label_text_color='#000D65',
+    checkbox_label_text_color_selected='#000D65'
+    )
+
+with gr.Blocks(css=css, theme=CIMStheme) as demo:
     gr.Markdown("This interface showcases a button with a tooltip.")
     with gr.Row():
-        inp = [
-            ButtonTip(
+        first_btn = ButtonTip(
                 tooltip="Tooltip Text",
                 tooltip_color="white",  # Custom color
                 tooltip_background_color="red",
                 x=120,  # No horizontal offset
                 y=-20,  # Above the button
-                value="Left Button"
-            ),
-            ButtonTip(
+                value="",
+                elem_classes=['icon-button'],
+                variant='primary',
+                icon='QuizIcon.png',
+                scale=0
+            )
+        second_btn = ButtonTip(
                 tooltip="Tooltip Text",
                 tooltip_color="white",  # Custom color
                 tooltip_background_color="blue",
                 x=-90,  # No horizontal offset
                 y=-20,  # Above the button
-                value="Right Button"
+                value="",
+                elem_classes=['icon-button'],
+                variant='primary',
+                icon='PDFIcon.png',
+                scale=0
             )
-        ]
-        out = "Hello World"
+    with gr.Row():
+        third_btn = gr.Button(value="",
+                elem_classes=['icon-button'],
+                variant='primary',
+                icon='QuizIcon.png',
+                scale=0)
+        fourth_btn = gr.Button(                value="",
+                elem_classes=['icon-button'],
+                variant='primary',
+                icon='PDFIcon.png',
+                scale=0)
+    with gr.Row():
+        submit_btn = gr.Button(value='Submit')
+        submit_btn.click(fn=submit, inputs=None, outputs=[first_btn, second_btn])
+        #submit_btn.click(fn=submit, inputs=None, outputs=[third_btn, fourth_btn])
 
 if __name__ == "__main__":
     demo.launch()