Create app.py
Browse files
app.py
ADDED
@@ -0,0 +1,35 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
import gradio as gr
|
2 |
+
|
3 |
+
# 1. The HTML content for the iframe.
|
4 |
+
# We embed the CSS directly here for simplicity.
|
5 |
+
html_content = """
|
6 |
+
<style>
|
7 |
+
body, html {
|
8 |
+
margin: 0;
|
9 |
+
padding: 0;
|
10 |
+
height: 100%;
|
11 |
+
overflow: hidden;
|
12 |
+
background-color: #FFF; /* Set a background color in case the iframe is slow to load */
|
13 |
+
}
|
14 |
+
iframe {
|
15 |
+
position: absolute;
|
16 |
+
top: 0;
|
17 |
+
left: 0;
|
18 |
+
width: 100%;
|
19 |
+
height: 100%;
|
20 |
+
border: none;
|
21 |
+
}
|
22 |
+
</style>
|
23 |
+
<iframe src="https://designer.tesslate.com"></iframe>
|
24 |
+
"""
|
25 |
+
|
26 |
+
# 2. Create a Gradio Blocks interface
|
27 |
+
# The `css` parameter injects CSS to remove Gradio's default padding and make our iframe container take up all the space.
|
28 |
+
with gr.Blocks(css=".gradio-container {padding: 0px !important;}") as demo:
|
29 |
+
|
30 |
+
# 3. Use the gr.HTML component to render our HTML string.
|
31 |
+
# The `elem_id` gives the main container a unique ID for styling if needed.
|
32 |
+
gr.HTML(value=html_content, elem_id="full-page-iframe")
|
33 |
+
|
34 |
+
# 4. Launch the app
|
35 |
+
demo.launch()
|