Spaces:
Sleeping
Sleeping
File size: 2,580 Bytes
a6c95f0 986ce81 |
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 |
import gradio as gr
# Custom CSS styles for sections
css = """
#header {
text-align: center;
font-size: 2em;
margin-bottom: 20px;
color: #333;
}
#user-guidance {
font-size: 1.1em;
color: #555;
margin-bottom: 20px;
}
#main {
padding: 20px;
background-color: #f7f7f7;
margin-bottom: 20px;
border-radius: 5px;
}
#examples {
font-size: 1.1em;
color: #333;
margin-bottom: 20px;
}
#footer {
text-align: center;
color: #888;
font-size: 0.9em;
}
"""
# Function for Main content (takes user input and returns a response)
def process_input(user_input):
return f"You entered: {user_input}"
# Function to generate predefined examples
def get_example(example):
return f"You selected: {example}"
# Create the header section
def create_header():
with gr.Row():
gr.Markdown("<div id='header'>Welcome to My Gradio App</div>")
# Create the user guidance section
def create_user_guidance():
with gr.Row():
gr.Markdown("<div id='user-guidance'>Please enter some text below to get started. Select one of the examples to see the output instantly.</div>")
# Create the main content section
def create_main():
with gr.Row():
with gr.Column():
user_input = gr.Textbox(label="Your Input", placeholder="Enter something here...")
output = gr.Textbox(label="Output", interactive=False)
user_input.submit(process_input, inputs=user_input, outputs=output)
return output # Return the output component for further interactions in other sections
# Create the examples section
def create_examples(output):
with gr.Row():
gr.Markdown("<div id='examples'>Try one of these examples:</div>")
example_1 = gr.Button("Example 1: Hello World")
example_2 = gr.Button("Example 2: How are you?")
example_1.click(get_example, inputs="Example 1", outputs=output)
example_2.click(get_example, inputs="Example 2", outputs=output)
# Create the footer section
def create_footer():
with gr.Row():
gr.Markdown("<div id='footer'>© 2025 My Gradio App | All Rights Reserved</div>")
# Main function to bring all sections together
def ca_gui():
with gr.Blocks(css=css) as ca_gui:
create_header() # Create the header
create_user_guidance() # Create user guidance section
output = create_main() # Create the main section (returns the output component)
create_examples(output) # Create the examples section
create_footer() # Create the footer section
ca_gui.launch()
|