evijit HF Staff commited on
Commit
6504db8
·
verified ·
1 Parent(s): 535bf1f

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +11 -12
app.py CHANGED
@@ -77,25 +77,24 @@ def create_treemap(treemap_data, count_by, title=None):
77
  fig.update_traces(textinfo="label+value+percent root", hovertemplate="<b>%{label}</b><br>%{value:,} " + count_by + "<br>%{percentRoot:.2%} of total<extra></extra>")
78
  return fig
79
 
80
- # --- FINAL FIX: Use CSS to target and fix the specific visual issues ---
81
  custom_css = """
82
- /* Hide the min/max input boxes and reset button above the RangeSlider */
83
- #param-slider-wrapper .head {
84
- display: none !important;
85
- }
86
-
87
- /* Hide the 0 and 8 labels on the sides of the RangeSlider */
88
  #param-slider-wrapper div[data-testid="range-slider"] > span {
89
  display: none !important;
90
  }
91
 
92
  /*
93
  THIS IS THE KEY FIX:
94
- Target all individual component blocks *inside* our specific gr.Group
95
- and remove their backgrounds and borders. This makes the group look like
96
- a single, unified card.
 
 
 
97
  */
98
- #component-11 .block {
99
  background: none !important;
100
  border: none !important;
101
  box-shadow: none !important;
@@ -120,7 +119,7 @@ with gr.Blocks(title="🤗 ModelVerse Explorer", fill_width=True, css=custom_css
120
  pipeline_filter_dropdown = gr.Dropdown(label="Select Pipeline Tag", choices=PIPELINE_TAGS, value=None, visible=False)
121
 
122
  # This group's styling will be modified by the custom CSS
123
- with gr.Group(elem_id="component-11"):
124
  gr.Markdown("<div style='font-weight: 500;'>Model Parameters</div>")
125
  param_range_slider = RangeSlider(
126
  minimum=0,
 
77
  fig.update_traces(textinfo="label+value+percent root", hovertemplate="<b>%{label}</b><br>%{value:,} " + count_by + "<br>%{percentRoot:.2%} of total<extra></extra>")
78
  return fig
79
 
80
+ # --- FINAL, CORRECTED CSS ---
81
  custom_css = """
82
+ /* Hide the extra UI elements from the RangeSlider component */
83
+ #param-slider-wrapper .head,
 
 
 
 
84
  #param-slider-wrapper div[data-testid="range-slider"] > span {
85
  display: none !important;
86
  }
87
 
88
  /*
89
  THIS IS THE KEY FIX:
90
+ We target all the individual component containers (divs with class .block)
91
+ that are *direct children* of our custom-classed group.
92
+
93
+ This removes the "box-in-a-box" effect by making the inner component
94
+ containers transparent. The parent gr.Group now acts as the single card,
95
+ which is exactly what we want.
96
  */
97
+ .model-parameters-group > .block {
98
  background: none !important;
99
  border: none !important;
100
  box-shadow: none !important;
 
119
  pipeline_filter_dropdown = gr.Dropdown(label="Select Pipeline Tag", choices=PIPELINE_TAGS, value=None, visible=False)
120
 
121
  # This group's styling will be modified by the custom CSS
122
+ with gr.Group(elem_classes="model-parameters-group"):
123
  gr.Markdown("<div style='font-weight: 500;'>Model Parameters</div>")
124
  param_range_slider = RangeSlider(
125
  minimum=0,