Spaces:
Sleeping
Sleeping
Embedding Explorer: force light appearance via _dark theme variants
Browse filesJS execution on HF Spaces is broken (known Gradio bug #10250).
Instead of trying to redirect to ?__theme=light, mirror all light
mode theme values into their _dark counterparts so dark mode looks
identical to light mode.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
app.py
CHANGED
|
@@ -768,20 +768,39 @@ textarea, input[type="text"] {
|
|
| 768 |
|
| 769 |
FORCE_LIGHT = '<script>if(!location.search.includes("__theme=light")){const u=new URL(location);u.searchParams.set("__theme","light");location.replace(u)}</script>'
|
| 770 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 771 |
THEME = gr.themes.Soft(
|
| 772 |
primary_hue="purple",
|
| 773 |
font=gr.themes.GoogleFont("Inter"),
|
| 774 |
-
).set(
|
| 775 |
-
button_primary_background_fill="#63348d",
|
| 776 |
-
button_primary_background_fill_hover="#4a2769",
|
| 777 |
-
button_primary_text_color="#ffffff",
|
| 778 |
-
block_background_fill="#f3f0f7",
|
| 779 |
-
block_border_color="#ded9f4",
|
| 780 |
-
body_background_fill="#ffffff",
|
| 781 |
-
block_label_text_color="#63348d",
|
| 782 |
-
block_title_text_color="#63348d",
|
| 783 |
-
body_text_color="#1a1a2e",
|
| 784 |
-
)
|
| 785 |
|
| 786 |
with gr.Blocks(title="Embedding Explorer", theme=THEME, css=CSS, head=FORCE_LIGHT) as demo:
|
| 787 |
|
|
|
|
| 768 |
|
| 769 |
FORCE_LIGHT = '<script>if(!location.search.includes("__theme=light")){const u=new URL(location);u.searchParams.set("__theme","light");location.replace(u)}</script>'
|
| 770 |
|
| 771 |
+
_LIGHT = {
|
| 772 |
+
"button_primary_background_fill": "#63348d",
|
| 773 |
+
"button_primary_background_fill_hover": "#4a2769",
|
| 774 |
+
"button_primary_text_color": "#ffffff",
|
| 775 |
+
"block_background_fill": "#f3f0f7",
|
| 776 |
+
"block_border_color": "#ded9f4",
|
| 777 |
+
"body_background_fill": "#ffffff",
|
| 778 |
+
"body_text_color": "#1a1a2e",
|
| 779 |
+
"block_label_text_color": "#63348d",
|
| 780 |
+
"block_title_text_color": "#63348d",
|
| 781 |
+
"background_fill_primary": "#ffffff",
|
| 782 |
+
"background_fill_secondary": "#f3f0f7",
|
| 783 |
+
"input_background_fill": "#ffffff",
|
| 784 |
+
"input_background_fill_focus": "#ffffff",
|
| 785 |
+
"input_border_color": "#ded9f4",
|
| 786 |
+
"input_border_color_focus": "#63348d",
|
| 787 |
+
"input_placeholder_color": "#888888",
|
| 788 |
+
"border_color_primary": "#ded9f4",
|
| 789 |
+
"border_color_accent": "#63348d",
|
| 790 |
+
"panel_background_fill": "#f3f0f7",
|
| 791 |
+
"shadow_drop": "rgba(0,0,0,0.05) 0px 1px 2px 0px",
|
| 792 |
+
"block_shadow": "none",
|
| 793 |
+
}
|
| 794 |
+
# Mirror every light value into _dark so dark mode looks identical
|
| 795 |
+
_ALL = {}
|
| 796 |
+
for k, v in _LIGHT.items():
|
| 797 |
+
_ALL[k] = v
|
| 798 |
+
_ALL[k + "_dark"] = v
|
| 799 |
+
|
| 800 |
THEME = gr.themes.Soft(
|
| 801 |
primary_hue="purple",
|
| 802 |
font=gr.themes.GoogleFont("Inter"),
|
| 803 |
+
).set(**_ALL)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 804 |
|
| 805 |
with gr.Blocks(title="Embedding Explorer", theme=THEME, css=CSS, head=FORCE_LIGHT) as demo:
|
| 806 |
|