|
|
| import gradio as gr |
| from gradio_buttontip import ButtonTip |
|
|
| def submit(): |
| return gr.Button(value='New Left Button'), gr.Button(value='New Right Button') |
|
|
|
|
| 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(): |
| first_btn = ButtonTip( |
| tooltip="Tooltip Text", |
| tooltip_color="white", |
| tooltip_background_color="red", |
| x=120, |
| y=-20, |
| value="", |
| elem_classes=['icon-button'], |
| variant='primary', |
| icon='QuizIcon.png', |
| scale=0 |
| ) |
| second_btn = ButtonTip( |
| tooltip="Tooltip Text", |
| tooltip_color="white", |
| tooltip_background_color="blue", |
| x=-90, |
| y=-20, |
| value="", |
| elem_classes=['icon-button'], |
| variant='primary', |
| icon='PDFIcon.png', |
| scale=0 |
| ) |
| 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]) |
| |
|
|
| if __name__ == "__main__": |
| demo.launch() |
|
|
