Spaces:
Running
Running
File size: 2,859 Bytes
9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 9254129 1ac8216 |
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
import os
# Define the function for the Gradio interface (keeping the previous example)
def greet(name):
"""Returns a greeting string for the given name."""
if not name:
return "Hello!"
return f"Hello, {name}!"
# CSS extracted and adapted from the FastAPI app's HTML
# We target specific elements or use broader selectors for Gradio
custom_css = """
body, .gradio-container {
background-color: #333 !important; /* Charcoal background */
color: #fff !important; /* White text color */
font-family: Arial, sans-serif !important;
margin: 0 !important;
}
/* Add padding to the main container */
.gradio-container {
padding: 20px !important;
}
/* Style the specific Markdown h1 using its generated ID or a custom one */
/* Let's wrap the markdown in a div with an ID for easier targeting */
#float-title h1 {
font-size: 2em;
text-align: center;
margin-bottom: 20px; /* Add some spacing */
transition: font-size 0.3s ease;
}
#float-title h1:hover {
font-size: 3em; /* Hover effect */
}
#float-title a {
color: #EA3C53 !important; /* Link color */
text-decoration: none !important;
}
#float-title a:hover {
text-decoration: none !important;
}
/* Style other Gradio elements for better contrast/consistency */
label, .gr-button {
color: #fff !important; /* Ensure labels and buttons use white text */
font-family: Arial, sans-serif !important;
}
.gr-button {
background-color: #555 !important; /* Darker button background */
border: 1px solid #777 !important;
}
.gr-button:hover {
background-color: #EA3C53 !important; /* Use link color on hover */
border: 1px solid #EA3C53 !important;
}
textarea, input[type=text] {
background-color: #444 !important; /* Darker input fields */
color: #fff !important;
border: 1px solid #666 !important;
}
"""
# Create the Gradio interface with custom CSS
# theme='dark' can also help set a base dark mode
with gr.Blocks(css=custom_css, theme=gr.themes.Default(primary_hue=gr.themes.colors.red, secondary_hue=gr.themes.colors.pink)) as demo:
# Add the styled title using Markdown wrapped in a div with an ID
with gr.Row():
with gr.Column(): # Use column to center potentially
gr.HTML("""
<div id="float-title">
<h1><a href="https://iu2ggxd43p.us-west-2.awsapprunner.com//">AWS Nova Canvas</a></h1>
<h3>App Runner Deployment</h3>
</div>
""") # Use HTML component for better control if needed
# Launch the Gradio app
if __name__ == "__main__":
server_name = os.getenv("GRADIO_SERVER_NAME", "0.0.0.0")
server_port = int(os.getenv("GRADIO_SERVER_PORT", 7860))
# Set share=False for deployment environments like App Runner
demo.launch(server_name=server_name, server_port=server_port, share=False) |