Jerrycool commited on
Commit
feb8f8a
·
verified ·
1 Parent(s): b2781b5

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +37 -10
app.py CHANGED
@@ -475,7 +475,36 @@ about_image_css = """
475
  }
476
  """
477
 
478
- 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}"
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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):