[Thème Spark] Ajout du thème 'spark' (dark/light, 39 variables) et défaut spark/dark
This commit is contained in:
+67
-2
@@ -1,5 +1,5 @@
|
|||||||
/* ObsiGate — Theme System
|
/* ObsiGate — Theme System
|
||||||
* 15 themes x 2 modes (dark/light)
|
* 16 themes x 2 modes (dark/light)
|
||||||
* Persisted in localStorage as 'obsigate-theme'
|
* Persisted in localStorage as 'obsigate-theme'
|
||||||
* Usage: import { initThemes, applyTheme, getCurrentTheme, THEMES } from './themes.js'
|
* Usage: import { initThemes, applyTheme, getCurrentTheme, THEMES } from './themes.js'
|
||||||
*/
|
*/
|
||||||
@@ -45,6 +45,71 @@ var THEMES = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// ── Thème Spark ──────────────────────────────────────────────────────
|
||||||
|
// Palette source : console Spark (agent.dracodev.net), app/console/console.css
|
||||||
|
// (variables --p-*). Mapping Spark -> ObsiGate, identique en structure pour
|
||||||
|
// dark et light ; seules les valeurs changent (sauf accent/ok/warn/err).
|
||||||
|
// Fidèle (valeur Spark directe) :
|
||||||
|
// fond -> --bg-primary, --surface2 ; surface -> --surface ;
|
||||||
|
// chip -> --bg-secondary, --tag-bg ; chip-survol -> --bg-hover ;
|
||||||
|
// bord -> --border ; chip-bord -> --border-md, --scrollbar, --resize-handle ;
|
||||||
|
// texte -> --text-primary, --text ; doux -> --text-secondary, --text-2 ;
|
||||||
|
// faint -> --text-muted, --text-3 ; champ -> --search-bg ;
|
||||||
|
// code -> --code-bg ; accent -> --accent, --accent-card, --purple, --ai ;
|
||||||
|
// lien -> --accent-text (variante lisible de l'accent sur fond teinté) ;
|
||||||
|
// ok -> --accent-green, --success, --green ;
|
||||||
|
// danger -> --danger ; danger-fond -> --danger-bg ;
|
||||||
|
// pastilles ok (fond) -> --success-bg, --green-bg ;
|
||||||
|
// pastilles ok (texte) -> --ok ; ambre -> --warn ; rouge -> --err.
|
||||||
|
// Approximations documentées (ObsiGate a plus de variables que Spark,
|
||||||
|
// ce ne sont PAS des valeurs Spark) :
|
||||||
|
// --bg-sidebar <- fond (Spark n'a pas de token sidebar dédié) ;
|
||||||
|
// --accent-bg <- agent (surface teintée de Spark, pas de teinte lavande) ;
|
||||||
|
// --surface3 <- agent ; --purple-bg <- appro-fond (fond teinté le plus
|
||||||
|
// proche, la palette Spark n'a pas de teinte lavande) ;
|
||||||
|
// --overlay-bg <- convention ObsiGate (rgba noir 0.3 clair / 0.5 sombre,
|
||||||
|
// aucun token voile dans la palette Spark).
|
||||||
|
// Non reportés (aucune variable ObsiGate correspondante dans les 39) :
|
||||||
|
// bulle utilisateur/envoi #2f6fed, titres approbation #9a6a1c / #e8bc7a.
|
||||||
|
// Une seule entrée 'spark' : dark et light sont ses deux modes, jamais
|
||||||
|
// deux thèmes séparés. Modes high-contrast/sepia générés comme pour les
|
||||||
|
// autres thèmes (à partir de dark/light).
|
||||||
|
'spark': {
|
||||||
|
name: 'Spark', desc: 'Palette de la console Spark',
|
||||||
|
modes: {
|
||||||
|
dark: {
|
||||||
|
'--bg-primary': '#17181a', '--bg-secondary': '#26272b', '--bg-sidebar': '#17181a',
|
||||||
|
'--bg-hover': '#2e3036', '--border': '#33353a', '--text-primary': '#eceeeb',
|
||||||
|
'--text-secondary': '#a6aba0', '--text-muted': '#83887e', '--accent': '#7c5cd6',
|
||||||
|
'--accent-green': '#2ea36b', '--tag-bg': '#26272b', '--tag-text': '#7c5cd6',
|
||||||
|
'--code-bg': '#2c2e33', '--search-bg': '#1f2023', '--scrollbar': '#3a3c41',
|
||||||
|
'--resize-handle': '#3a3c41', '--overlay-bg': 'rgba(0,0,0,0.5)', '--danger': '#e8a08d',
|
||||||
|
'--danger-bg': '#40241f', '--success': '#2ea36b', '--success-bg': '#173d29',
|
||||||
|
'--accent-card': '#7c5cd6', '--accent-bg': '#26272b', '--accent-text': '#b39df5',
|
||||||
|
'--green': '#2ea36b', '--green-bg': '#173d29', '--purple': '#7c5cd6',
|
||||||
|
'--purple-bg': '#2a2118', '--surface': '#1f2023', '--surface2': '#17181a',
|
||||||
|
'--surface3': '#26272b', '--border-md': '#3a3c41', '--text': '#eceeeb',
|
||||||
|
'--text-2': '#a6aba0', '--text-3': '#83887e', '--ok': '#7fd6a8',
|
||||||
|
'--warn': '#e8a13c', '--ai': '#7c5cd6', '--err': '#cf4b32'
|
||||||
|
},
|
||||||
|
light: {
|
||||||
|
'--bg-primary': '#fbfbfa', '--bg-secondary': '#f4f5f1', '--bg-sidebar': '#fbfbfa',
|
||||||
|
'--bg-hover': '#e9ebe4', '--border': '#e4e5e0', '--text-primary': '#242624',
|
||||||
|
'--text-secondary': '#6c7268', '--text-muted': '#8a8f84', '--accent': '#7c5cd6',
|
||||||
|
'--accent-green': '#2ea36b', '--tag-bg': '#f4f5f1', '--tag-text': '#7c5cd6',
|
||||||
|
'--code-bg': '#e8eae3', '--search-bg': '#ffffff', '--scrollbar': '#d6d8d1',
|
||||||
|
'--resize-handle': '#d6d8d1', '--overlay-bg': 'rgba(0,0,0,0.3)', '--danger': '#a03a28',
|
||||||
|
'--danger-bg': '#f6e3de', '--success': '#2ea36b', '--success-bg': '#dff2e7',
|
||||||
|
'--accent-card': '#7c5cd6', '--accent-bg': '#eef0ea', '--accent-text': '#5b3df0',
|
||||||
|
'--green': '#2ea36b', '--green-bg': '#dff2e7', '--purple': '#7c5cd6',
|
||||||
|
'--purple-bg': '#fdf6ec', '--surface': '#ffffff', '--surface2': '#fbfbfa',
|
||||||
|
'--surface3': '#eef0ea', '--border-md': '#d6d8d1', '--text': '#242624',
|
||||||
|
'--text-2': '#6c7268', '--text-3': '#8a8f84', '--ok': '#1d7a4c',
|
||||||
|
'--warn': '#e8a13c', '--ai': '#7c5cd6', '--err': '#cf4b32'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
'github': {
|
'github': {
|
||||||
name: 'GitHub', desc: 'Contraste doux',
|
name: 'GitHub', desc: 'Contraste doux',
|
||||||
modes: {
|
modes: {
|
||||||
@@ -523,7 +588,7 @@ var THEMES = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
// ── Theme Engine ─────────────────────────────────────────────────────
|
// ── Theme Engine ─────────────────────────────────────────────────────
|
||||||
var _currentTheme = 'defaut-obsigate';
|
var _currentTheme = 'spark';
|
||||||
var _currentMode = 'dark';
|
var _currentMode = 'dark';
|
||||||
|
|
||||||
var AVAILABLE_MODES = ['dark', 'light', 'high-contrast', 'sepia'];
|
var AVAILABLE_MODES = ['dark', 'light', 'high-contrast', 'sepia'];
|
||||||
|
|||||||
Reference in New Issue
Block a user