Spaces:
Running
Running
Update app.py
Browse files
app.py
CHANGED
@@ -475,7 +475,36 @@ about_image_css = """
|
|
475 |
}
|
476 |
"""
|
477 |
|
478 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
479 |
|
480 |
# ---------------------------------------------------------------------------
|
481 |
# Build the Gradio UI
|
@@ -486,20 +515,18 @@ demo = gr.Blocks(css=final_css, theme=gr.themes.Soft())
|
|
486 |
with demo:
|
487 |
# Title
|
488 |
gr.HTML(TITLE)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
489 |
|
490 |
# Introduction (Markdown wrapped so CSS can target .introduction-wrapper)
|
491 |
with gr.Row():
|
492 |
gr.Markdown(INTRODUCTION_TEXT, elem_classes="introduction-wrapper")
|
493 |
|
494 |
-
|
495 |
-
# NEW ⭐: image immediately below the introduction
|
496 |
-
# with gr.Row():
|
497 |
-
# gr.Image(
|
498 |
-
# value="overview.jpg",
|
499 |
-
# show_label=False,
|
500 |
-
# elem_id="intro-image",
|
501 |
-
# )
|
502 |
-
|
503 |
with gr.Tabs(elem_classes="tab-buttons"):
|
504 |
# ------------------ Leaderboard tab ------------------
|
505 |
with gr.TabItem("🏅 MLE-Dojo Benchmark", id=0):
|
|
|
475 |
}
|
476 |
"""
|
477 |
|
478 |
+
|
479 |
+
intro_image_css = """
|
480 |
+
/* --- CSS for the Image container in the About Tab --- */
|
481 |
+
#intro-image {
|
482 |
+
background-color: transparent !important;
|
483 |
+
padding: 0 !important;
|
484 |
+
border: none !important;
|
485 |
+
}
|
486 |
+
|
487 |
+
/* --- CSS for the Image tag itself in the About Tab --- */
|
488 |
+
#intro-image img { /* Target the actual <img> tag */
|
489 |
+
display: block;
|
490 |
+
max-width: 600px;
|
491 |
+
width: 90%;
|
492 |
+
height: auto;
|
493 |
+
margin: 2rem auto 1rem auto; /* Adjusted margin slightly */
|
494 |
+
border-radius: 8px;
|
495 |
+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
496 |
+
}
|
497 |
+
|
498 |
+
/* Optional: Different styles for smaller screens */
|
499 |
+
@media (max-width: 768px) {
|
500 |
+
#intro-image img {
|
501 |
+
max-width: 100%;
|
502 |
+
width: 95%;
|
503 |
+
margin-top: 1.5rem;
|
504 |
+
}
|
505 |
+
}
|
506 |
+
"""
|
507 |
+
final_css = f"{custom_css}\n{base_css}\n{intro_css}\n{markdown_css}\n{tab_css}\n{radio_css}\n{citation_css}\n{about_image_css}\n{intro_image_css}"
|
508 |
|
509 |
# ---------------------------------------------------------------------------
|
510 |
# Build the Gradio UI
|
|
|
515 |
with demo:
|
516 |
# Title
|
517 |
gr.HTML(TITLE)
|
518 |
+
# NEW ⭐: image immediately below the introduction
|
519 |
+
with gr.Row():
|
520 |
+
gr.Image(
|
521 |
+
value="icon.jpg",
|
522 |
+
show_label=False,
|
523 |
+
elem_id="intro-image",
|
524 |
+
)
|
525 |
|
526 |
# Introduction (Markdown wrapped so CSS can target .introduction-wrapper)
|
527 |
with gr.Row():
|
528 |
gr.Markdown(INTRODUCTION_TEXT, elem_classes="introduction-wrapper")
|
529 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
530 |
with gr.Tabs(elem_classes="tab-buttons"):
|
531 |
# ------------------ Leaderboard tab ------------------
|
532 |
with gr.TabItem("🏅 MLE-Dojo Benchmark", id=0):
|