/** * Nodica shared design tokens (D19). * * Loaded by both index.html (file mode) and sparql.html (SPARQL mode) so * the two pages cannot visually drift apart - there is exactly one place * these colors are defined. Keyed off data-theme="light"|"dark" on , * set by each page's own bootstrap script before first paint. * * --btn-graph-bg / --btn-graph-bg-hover intentionally do NOT change between * themes: they match YASGUI's own Run button (.yasqe_queryButton is #337ab7, * hover #2868a0, unchanged in its dark theme too). --btn-bg / --btn-bg-hover * (every primary action button - Render, etc.) follow the same value via * var(), so there's exactly one blue across the whole app, in both modes * and both themes, not two adjacent-but-different shades. */ :root { --bg: #f5f5f5; --panel: #ffffff; --border: #e0e0e0; --border-light: #eeeeee; --input-border: #cccccc; --text: #1a1a1a; --muted: #777777; --link: #0066cc; --btn-graph-bg: #337ab7; --btn-graph-bg-hover: #2868a0; --btn-bg: var(--btn-graph-bg); --btn-bg-hover: var(--btn-graph-bg-hover); --btn-secondary-bg: #e8e8e8; --btn-secondary-text: #222222; --btn-secondary-hover: #d8d8d8; --status-info-bg: #e3f2fd; --status-info-text: #0d47a1; --status-success-bg: #d4edda; --status-success-text: #155724; --status-error-bg: #f8d7da; --status-error-text: #721c24; --prop-shadow: rgba(0, 0, 0, 0.15); --count-color: #888888; } html[data-theme="dark"] { --bg: #0d1117; --panel: #161b22; --border: #30363d; --border-light: #21262d; --input-border: #30363d; --text: #c9d1d9; --muted: #8b949e; --link: #58a6ff; --btn-graph-bg: #337ab7; --btn-graph-bg-hover: #2868a0; --btn-bg: var(--btn-graph-bg); --btn-bg-hover: var(--btn-graph-bg-hover); --btn-secondary-bg: #21262d; --btn-secondary-text: #c9d1d9; --btn-secondary-hover: #30363d; --status-info-bg: #0d2a4a; --status-info-text: #79c0ff; --status-success-bg: #0f2e1a; --status-success-text: #56d364; --status-error-bg: #3d1418; --status-error-text: #ff7b72; --prop-shadow: rgba(0, 0, 0, 0.5); --count-color: #8b949e; }