Adriano/Multi_Swarm_Coevolutive
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(dashboard): icone Material rese come testo + JSON keys invisibili

Browse Source 
Due bug visivi distinti:

1) Icone Material rotte ("arrow_drop_down" come testo nel selector):
   Il selettore CSS '*' applicava font Inter a tutti gli elementi inclusi
   gli .material-icons che richiedono il loro proprio font ligature.
   Sostituito '*' con whitelist esplicita di elementi UI; aggiunto override
   esplicito per .material-icons / .q-icon che forza font 'Material Icons'.

2) JSON keys invisibili nel code block config:
   NiceGUI ui.code usa Prism.js (non highlight.js) per il syntax highlighting.
   Aggiunti selettori .token.* coordinati con la palette neon:
   - .token.property / .token.attr-name → cyan (chiavi JSON)
   - .token.string → green (valori string)
   - .token.number / .token.boolean / .token.null → pink
   - .token.punctuation / .token.operator → muted
   - .token.keyword / .token.builtin → amber
   Più reset text-shadow per pre[class*=language-].

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
AdrianoDev
2026-05-11 22:48:53 +02:00
parent 9e740cbcbd
commit 171f554916
1 changed files with 23 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/multi_swarm/dashboard/nicegui_app.py
+23 -2
View File
@@ -62,8 +62,16 @@ _CUSTOM_CSS = f"""
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
* {{ font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; letter-spacing: -0.01em; }}
code, pre, .q-code {{ font-family: 'JetBrains Mono', 'Fira Code', monospace !important; font-size: 12.5px !important; }}
html, body, .q-page, .q-card, .q-btn, .q-field, .q-table, .text-h4, .text-h6, .text-subtitle1, .text-caption, .text-body1, .nav-link, .brand, label, p, span, div {{
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
letter-spacing: -0.01em;
}}
.material-icons, .material-icons-outlined, .material-symbols-outlined, .q-icon, i.q-icon, i[class*="material"] {{
font-family: 'Material Icons' !important;
font-feature-settings: 'liga';
letter-spacing: normal !important;
}}
code, pre, .q-code, .nicegui-code {{ font-family: 'JetBrains Mono', 'Fira Code', monospace !important; font-size: 13.5px !important; }}
body, .q-page-container, .q-page {{
background: {COLOR_BG} !important;
@@ -247,6 +255,19 @@ code, pre, .nicegui-code {{
.hljs-comment {{ color: {COLOR_TEXT_MUTED} !important; font-style: italic; }}
.hljs-name, .hljs-title {{ color: {COLOR_PRIMARY} !important; }}
/* Prism.js tokens (NiceGUI usa Prism per ui.code) */
.token.property, .token.attr-name, .token.tag {{ color: {COLOR_SECONDARY} !important; font-weight: 500; }}
.token.string, .token.url {{ color: {COLOR_SUCCESS} !important; }}
.token.number, .token.boolean, .token.null, .token.symbol {{ color: {COLOR_PRIMARY} !important; font-weight: 500; }}
.token.keyword, .token.constant, .token.builtin, .token.atrule {{ color: {COLOR_ACCENT} !important; }}
.token.punctuation, .token.operator {{ color: {COLOR_TEXT_MUTED} !important; }}
.token.comment {{ color: {COLOR_TEXT_MUTED} !important; font-style: italic; }}
.token.function, .token.class-name {{ color: {COLOR_PRIMARY} !important; }}
pre[class*="language-"], code[class*="language-"] {{
color: {COLOR_TEXT} !important;
text-shadow: none !important;
}}
.q-badge {{ border-radius: 6px !important; font-weight: 500 !important; padding: 4px 10px !important; font-size: 12px !important; }}
</style>
"""