Spaces:
Paused
Paused
Commit ·
7676f37
1
Parent(s): 0508e33
style(game): minimal top-right control cluster, de-emphasized restart
Browse files- app.py +1 -1
- styles.css +30 -12
app.py
CHANGED
|
@@ -1234,7 +1234,7 @@ with gr.Blocks(title="Hollow") as demo:
|
|
| 1234 |
'<div id="game-groundfog"></div>')
|
| 1235 |
with gr.Row(elem_id="game-topbar"):
|
| 1236 |
title_panel = gr.HTML(value=_render_title(_init_state()))
|
| 1237 |
-
restart_btn = gr.Button("↺
|
| 1238 |
scale=0)
|
| 1239 |
voice_btn = gr.Button("🔊", elem_classes="voice-btn", scale=0)
|
| 1240 |
|
|
|
|
| 1234 |
'<div id="game-groundfog"></div>')
|
| 1235 |
with gr.Row(elem_id="game-topbar"):
|
| 1236 |
title_panel = gr.HTML(value=_render_title(_init_state()))
|
| 1237 |
+
restart_btn = gr.Button("↺", elem_classes="restart-btn",
|
| 1238 |
scale=0)
|
| 1239 |
voice_btn = gr.Button("🔊", elem_classes="voice-btn", scale=0)
|
| 1240 |
|
styles.css
CHANGED
|
@@ -854,20 +854,38 @@ footer { display: none !important; }
|
|
| 854 |
peace_settle render lands seamlessly as the relief sigh plays */
|
| 855 |
.entity-convulse-soft .entity-settle-face { animation-duration: 1.95s; }
|
| 856 |
|
| 857 |
-
/* restart
|
| 858 |
.restart-btn {
|
| 859 |
-
|
| 860 |
-
|
| 861 |
-
|
| 862 |
-
|
| 863 |
-
|
| 864 |
-
opacity:
|
|
|
|
|
|
|
| 865 |
}
|
| 866 |
.restart-btn:hover {
|
|
|
|
| 867 |
opacity: 1;
|
| 868 |
-
|
| 869 |
-
|
| 870 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 871 |
}
|
| 872 |
|
| 873 |
/* the voice channel: mounted in the DOM (so the <audio> plays) but collapsed
|
|
@@ -1476,10 +1494,10 @@ footer { display: none !important; }
|
|
| 1476 |
|
| 1477 |
#game-title {
|
| 1478 |
font-family: 'Special Elite', monospace;
|
| 1479 |
-
font-size:
|
| 1480 |
letter-spacing: 0.22em;
|
| 1481 |
text-transform: uppercase;
|
| 1482 |
-
color: #
|
| 1483 |
text-shadow: 0 1px 6px rgba(0,0,0,0.9), 0 0 12px rgba(120,90,160,0.35);
|
| 1484 |
}
|
| 1485 |
#game-title .named {
|
|
|
|
| 854 |
peace_settle render lands seamlessly as the relief sigh plays */
|
| 855 |
.entity-convulse-soft .entity-settle-face { animation-duration: 1.95s; }
|
| 856 |
|
| 857 |
+
/* restart + mute — minimal icon cluster, top-right, low-contrast */
|
| 858 |
.restart-btn {
|
| 859 |
+
background: transparent !important;
|
| 860 |
+
border: none !important;
|
| 861 |
+
max-width: none; min-width: 0; width: auto !important;
|
| 862 |
+
font-size: 1rem !important; letter-spacing: normal; text-transform: none;
|
| 863 |
+
color: #8b83a2 !important;
|
| 864 |
+
opacity: .7; box-shadow: none !important;
|
| 865 |
+
padding: 4px 6px;
|
| 866 |
+
margin-left: 10px;
|
| 867 |
}
|
| 868 |
.restart-btn:hover {
|
| 869 |
+
color: #e0cdb0 !important;
|
| 870 |
opacity: 1;
|
| 871 |
+
background: transparent !important;
|
| 872 |
+
border: none !important;
|
| 873 |
+
}
|
| 874 |
+
.voice-btn {
|
| 875 |
+
background: transparent !important;
|
| 876 |
+
border: none !important;
|
| 877 |
+
max-width: none; min-width: 0; width: auto !important;
|
| 878 |
+
font-size: 1rem !important;
|
| 879 |
+
color: #b6acd0 !important;
|
| 880 |
+
opacity: .7; box-shadow: none !important;
|
| 881 |
+
padding: 4px 6px;
|
| 882 |
+
margin-left: 10px;
|
| 883 |
+
}
|
| 884 |
+
.voice-btn:hover {
|
| 885 |
+
color: #e0cdb0 !important;
|
| 886 |
+
opacity: 1;
|
| 887 |
+
background: transparent !important;
|
| 888 |
+
border: none !important;
|
| 889 |
}
|
| 890 |
|
| 891 |
/* the voice channel: mounted in the DOM (so the <audio> plays) but collapsed
|
|
|
|
| 1494 |
|
| 1495 |
#game-title {
|
| 1496 |
font-family: 'Special Elite', monospace;
|
| 1497 |
+
font-size: 0.9rem;
|
| 1498 |
letter-spacing: 0.22em;
|
| 1499 |
text-transform: uppercase;
|
| 1500 |
+
color: #7d7596;
|
| 1501 |
text-shadow: 0 1px 6px rgba(0,0,0,0.9), 0 0 12px rgba(120,90,160,0.35);
|
| 1502 |
}
|
| 1503 |
#game-title .named {
|