@danieltmn/tamnora 0.20.1 → 0.21.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -10,16 +10,20 @@
10
10
  <meta name="theme-color" content="#231a17" />
11
11
  <script>
12
12
  (function () {
13
+ var THEMES = ['paper', 'dark', 'midnight', 'nord', 'dracula', 'solarized', 'solarized-dark', 'bosque', 'vino', 'vercel', 'dark-plus', 'github', 'github-dark'];
14
+ var DARK = ['dark', 'midnight', 'nord', 'dracula', 'solarized-dark', 'vercel', 'dark-plus', 'github-dark'];
13
15
  var theme = null;
14
16
  try {
15
17
  theme = localStorage.getItem('tamnora-console-theme');
16
18
  } catch {
17
19
  theme = null;
18
20
  }
19
- if (theme !== 'dark' && theme !== 'paper') {
21
+ if (theme === 'light') theme = 'paper';
22
+ if (THEMES.indexOf(theme) < 0) {
20
23
  theme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'paper';
21
24
  }
22
25
  document.documentElement.dataset.theme = theme;
26
+ document.documentElement.dataset.scheme = DARK.indexOf(theme) >= 0 ? 'dark' : 'light';
23
27
  })();
24
28
  </script>
25
29
  <link rel="preconnect" href="https://fonts.googleapis.com" />
@@ -88,6 +92,314 @@
88
92
  --page-tint: linear-gradient(180deg, rgba(18, 19, 14, 0.32), rgba(24, 25, 20, 0.32));
89
93
  }
90
94
 
95
+ html[data-theme='midnight'] {
96
+ color-scheme: dark;
97
+ --paper: #0f1729;
98
+ --paper-2: #16203a;
99
+ --ink: #e2e8f0;
100
+ --muted: #94a3b8;
101
+ --line: rgba(226, 232, 240, 0.14);
102
+ --border-strong: rgba(226, 232, 240, 0.28);
103
+ --accent: #5b8def;
104
+ --accent-dark: #82a8f4;
105
+ --glass: rgba(15, 23, 41, 0.8);
106
+ --nav: #cdd7e6;
107
+ --copy: #b3c0d4;
108
+ --hint: #94a3b8;
109
+ --label: #aab8cc;
110
+ --kicker: #a0aec2;
111
+ --surface: rgba(226, 232, 240, 0.07);
112
+ --surface-strong: rgba(226, 232, 240, 0.15);
113
+ --field-bg: rgba(226, 232, 240, 0.06);
114
+ --btn-bg: var(--accent);
115
+ --btn-fg: #f8fafc;
116
+ --btn-hover: #82a8f4;
117
+ --footer: rgba(226, 232, 240, 0.5);
118
+ --page-outer: #0b1220;
119
+ --page-bg: linear-gradient(90deg, rgba(11, 18, 32, 0.85) 0%, rgba(11, 18, 32, 0.62) 43%, rgba(11, 18, 32, 0.34) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
120
+ --page-tint: linear-gradient(180deg, rgba(11, 18, 32, 0.34), rgba(15, 23, 41, 0.34));
121
+ }
122
+
123
+ html[data-theme='nord'] {
124
+ color-scheme: dark;
125
+ --paper: #353b48;
126
+ --paper-2: #3f4654;
127
+ --ink: #eceff4;
128
+ --muted: #9aa5b5;
129
+ --line: rgba(216, 222, 233, 0.16);
130
+ --border-strong: rgba(216, 222, 233, 0.3);
131
+ --accent: #88c0d0;
132
+ --accent-dark: #9fd0de;
133
+ --glass: rgba(46, 52, 64, 0.8);
134
+ --nav: #d6dde8;
135
+ --copy: #bcc6d4;
136
+ --hint: #9aa5b5;
137
+ --label: #b6c0cf;
138
+ --kicker: #aab5c4;
139
+ --surface: rgba(216, 222, 233, 0.07);
140
+ --surface-strong: rgba(216, 222, 233, 0.15);
141
+ --field-bg: rgba(216, 222, 233, 0.06);
142
+ --btn-bg: var(--accent);
143
+ --btn-fg: #2e3440;
144
+ --btn-hover: #9fd0de;
145
+ --footer: rgba(216, 222, 233, 0.5);
146
+ --page-outer: #272c36;
147
+ --page-bg: linear-gradient(90deg, rgba(39, 44, 54, 0.85) 0%, rgba(39, 44, 54, 0.62) 43%, rgba(39, 44, 54, 0.34) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
148
+ --page-tint: linear-gradient(180deg, rgba(39, 44, 54, 0.34), rgba(53, 59, 72, 0.34));
149
+ }
150
+
151
+ html[data-theme='dracula'] {
152
+ color-scheme: dark;
153
+ --paper: #2f3140;
154
+ --paper-2: #383a4c;
155
+ --ink: #f8f8f2;
156
+ --muted: #a7a9be;
157
+ --line: rgba(248, 248, 242, 0.14);
158
+ --border-strong: rgba(248, 248, 242, 0.28);
159
+ --accent: #bd93f9;
160
+ --accent-dark: #cba9fb;
161
+ --glass: rgba(40, 42, 54, 0.82);
162
+ --nav: #e4e4f0;
163
+ --copy: #c8c8de;
164
+ --hint: #a7a9be;
165
+ --label: #bfc0d6;
166
+ --kicker: #b0b2c8;
167
+ --surface: rgba(248, 248, 242, 0.07);
168
+ --surface-strong: rgba(248, 248, 242, 0.15);
169
+ --field-bg: rgba(248, 248, 242, 0.06);
170
+ --btn-bg: var(--accent);
171
+ --btn-fg: #21222c;
172
+ --btn-hover: #cba9fb;
173
+ --footer: rgba(248, 248, 242, 0.5);
174
+ --page-outer: #21222c;
175
+ --page-bg: linear-gradient(90deg, rgba(33, 34, 44, 0.85) 0%, rgba(33, 34, 44, 0.62) 43%, rgba(33, 34, 44, 0.34) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
176
+ --page-tint: linear-gradient(180deg, rgba(33, 34, 44, 0.34), rgba(47, 49, 64, 0.34));
177
+ }
178
+
179
+ html[data-theme='solarized'] {
180
+ color-scheme: light;
181
+ --paper: #fdf6e3;
182
+ --paper-2: #f5edd6;
183
+ --ink: #073642;
184
+ --muted: #657b83;
185
+ --line: rgba(7, 54, 66, 0.18);
186
+ --border-strong: rgba(7, 54, 66, 0.36);
187
+ --accent: #b58900;
188
+ --accent-dark: #cb4b16;
189
+ --glass: rgba(253, 246, 227, 0.75);
190
+ --nav: #4b5f66;
191
+ --copy: #5a6f75;
192
+ --hint: #657b83;
193
+ --label: #5f7379;
194
+ --kicker: #6a7d82;
195
+ --surface: rgba(238, 232, 213, 0.6);
196
+ --surface-strong: rgba(238, 232, 213, 0.85);
197
+ --field-bg: rgba(255, 252, 240, 0.72);
198
+ --btn-bg: var(--ink);
199
+ --btn-fg: #fdf6e3;
200
+ --btn-hover: #0a4650;
201
+ --footer: rgba(101, 123, 131, 0.62);
202
+ --page-outer: #eee8d5;
203
+ --page-bg: linear-gradient(90deg, rgba(253, 246, 227, 0.78) 0%, rgba(253, 246, 227, 0.46) 43%, rgba(253, 246, 227, 0.16) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
204
+ --page-tint: linear-gradient(180deg, rgba(253, 246, 227, 0.24), rgba(238, 232, 213, 0.24));
205
+ }
206
+
207
+ html[data-theme='solarized-dark'] {
208
+ color-scheme: dark;
209
+ --paper: #073642;
210
+ --paper-2: #0b3f4c;
211
+ --ink: #eee8d5;
212
+ --muted: #93a1a1;
213
+ --line: rgba(238, 232, 213, 0.16);
214
+ --border-strong: rgba(238, 232, 213, 0.3);
215
+ --accent: #b58900;
216
+ --accent-dark: #d3a012;
217
+ --glass: rgba(0, 43, 54, 0.8);
218
+ --nav: #d5cfbd;
219
+ --copy: #c2bcab;
220
+ --hint: #93a1a1;
221
+ --label: #b8b2a1;
222
+ --kicker: #a7a999;
223
+ --surface: rgba(238, 232, 213, 0.07);
224
+ --surface-strong: rgba(238, 232, 213, 0.15);
225
+ --field-bg: rgba(238, 232, 213, 0.06);
226
+ --btn-bg: var(--accent);
227
+ --btn-fg: #002b36;
228
+ --btn-hover: #d3a012;
229
+ --footer: rgba(238, 232, 213, 0.5);
230
+ --page-outer: #002b36;
231
+ --page-bg: linear-gradient(90deg, rgba(0, 43, 54, 0.85) 0%, rgba(0, 43, 54, 0.62) 43%, rgba(0, 43, 54, 0.34) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
232
+ --page-tint: linear-gradient(180deg, rgba(0, 43, 54, 0.34), rgba(7, 54, 66, 0.34));
233
+ }
234
+
235
+ html[data-theme='bosque'] {
236
+ color-scheme: light;
237
+ --paper: #f2f4ec;
238
+ --paper-2: #e8ecdf;
239
+ --ink: #1e241c;
240
+ --muted: #5f6b59;
241
+ --line: rgba(30, 36, 28, 0.16);
242
+ --border-strong: rgba(30, 36, 28, 0.34);
243
+ --accent: #4f8a4a;
244
+ --accent-dark: #3d6f39;
245
+ --glass: rgba(244, 246, 238, 0.75);
246
+ --nav: #3f4a39;
247
+ --copy: #4f5a49;
248
+ --hint: #5f6b59;
249
+ --label: #55614f;
250
+ --kicker: #616b5b;
251
+ --surface: rgba(231, 235, 223, 0.6);
252
+ --surface-strong: rgba(231, 235, 223, 0.85);
253
+ --field-bg: rgba(248, 250, 244, 0.72);
254
+ --btn-bg: var(--ink);
255
+ --btn-fg: #f8faf4;
256
+ --btn-hover: #2b3327;
257
+ --footer: rgba(95, 107, 89, 0.62);
258
+ --page-outer: #dfe4d5;
259
+ --page-bg: linear-gradient(90deg, rgba(242, 244, 236, 0.78) 0%, rgba(242, 244, 236, 0.46) 43%, rgba(242, 244, 236, 0.16) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
260
+ --page-tint: linear-gradient(180deg, rgba(242, 244, 236, 0.24), rgba(231, 235, 223, 0.24));
261
+ }
262
+
263
+ html[data-theme='vino'] {
264
+ color-scheme: light;
265
+ --paper: #f7eeee;
266
+ --paper-2: #efe0e1;
267
+ --ink: #26181a;
268
+ --muted: #6d5a5d;
269
+ --line: rgba(38, 24, 26, 0.16);
270
+ --border-strong: rgba(38, 24, 26, 0.34);
271
+ --accent: #a3344a;
272
+ --accent-dark: #82273a;
273
+ --glass: rgba(248, 240, 240, 0.75);
274
+ --nav: #4a383a;
275
+ --copy: #5a4649;
276
+ --hint: #6d5a5d;
277
+ --label: #614d50;
278
+ --kicker: #6b585b;
279
+ --surface: rgba(238, 223, 223, 0.6);
280
+ --surface-strong: rgba(238, 223, 223, 0.85);
281
+ --field-bg: rgba(252, 246, 246, 0.72);
282
+ --btn-bg: var(--ink);
283
+ --btn-fg: #fbf5f5;
284
+ --btn-hover: #3a2528;
285
+ --footer: rgba(109, 90, 93, 0.62);
286
+ --page-outer: #e5d4d5;
287
+ --page-bg: linear-gradient(90deg, rgba(247, 238, 238, 0.78) 0%, rgba(247, 238, 238, 0.46) 43%, rgba(247, 238, 238, 0.16) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
288
+ --page-tint: linear-gradient(180deg, rgba(247, 238, 238, 0.24), rgba(238, 223, 223, 0.24));
289
+ }
290
+
291
+ html[data-theme='vercel'] {
292
+ color-scheme: dark;
293
+ --paper: #0a0a0a;
294
+ --paper-2: #111111;
295
+ --ink: #ededed;
296
+ --muted: #8f8f8f;
297
+ --line: rgba(255, 255, 255, 0.14);
298
+ --border-strong: rgba(255, 255, 255, 0.28);
299
+ --accent: #0070f3;
300
+ --accent-dark: #3291ff;
301
+ --glass: rgba(0, 0, 0, 0.8);
302
+ --nav: #cfcfcf;
303
+ --copy: #b5b5b5;
304
+ --hint: #8f8f8f;
305
+ --label: #a8a8a8;
306
+ --kicker: #9a9a9a;
307
+ --surface: rgba(255, 255, 255, 0.06);
308
+ --surface-strong: rgba(255, 255, 255, 0.12);
309
+ --field-bg: rgba(255, 255, 255, 0.05);
310
+ --btn-bg: var(--accent);
311
+ --btn-fg: #ffffff;
312
+ --btn-hover: #3291ff;
313
+ --footer: rgba(255, 255, 255, 0.5);
314
+ --page-outer: #000000;
315
+ --page-bg: linear-gradient(90deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.62) 43%, rgba(0, 0, 0, 0.34) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
316
+ --page-tint: linear-gradient(180deg, rgba(0, 0, 0, 0.4), rgba(10, 10, 10, 0.4));
317
+ }
318
+
319
+ html[data-theme='dark-plus'] {
320
+ color-scheme: dark;
321
+ --paper: #252526;
322
+ --paper-2: #2d2d2d;
323
+ --ink: #d4d4d4;
324
+ --muted: #9a9a9a;
325
+ --line: rgba(255, 255, 255, 0.12);
326
+ --border-strong: rgba(255, 255, 255, 0.26);
327
+ --accent: #0e639c;
328
+ --accent-dark: #1177bb;
329
+ --glass: rgba(30, 30, 30, 0.82);
330
+ --nav: #c5c5c5;
331
+ --copy: #b0b0b0;
332
+ --hint: #9a9a9a;
333
+ --label: #ababab;
334
+ --kicker: #a0a0a0;
335
+ --surface: rgba(255, 255, 255, 0.06);
336
+ --surface-strong: rgba(255, 255, 255, 0.12);
337
+ --field-bg: rgba(255, 255, 255, 0.05);
338
+ --btn-bg: var(--accent);
339
+ --btn-fg: #ffffff;
340
+ --btn-hover: #1177bb;
341
+ --footer: rgba(212, 212, 212, 0.5);
342
+ --page-outer: #1e1e1e;
343
+ --page-bg: linear-gradient(90deg, rgba(30, 30, 30, 0.85) 0%, rgba(30, 30, 30, 0.62) 43%, rgba(30, 30, 30, 0.34) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
344
+ --page-tint: linear-gradient(180deg, rgba(30, 30, 30, 0.4), rgba(37, 37, 38, 0.4));
345
+ }
346
+
347
+ html[data-theme='github'] {
348
+ color-scheme: light;
349
+ --paper: #ffffff;
350
+ --paper-2: #f6f8fa;
351
+ --ink: #1f2328;
352
+ --muted: #656d76;
353
+ --line: rgba(31, 35, 40, 0.16);
354
+ --border-strong: rgba(31, 35, 40, 0.34);
355
+ --accent: #0969da;
356
+ --accent-dark: #0757ba;
357
+ --glass: rgba(255, 255, 255, 0.78);
358
+ --nav: #424a53;
359
+ --copy: #57606a;
360
+ --hint: #656d76;
361
+ --label: #59616b;
362
+ --kicker: #646c76;
363
+ --surface: rgba(246, 248, 250, 0.6);
364
+ --surface-strong: rgba(246, 248, 250, 0.9);
365
+ --field-bg: rgba(255, 255, 255, 0.8);
366
+ --btn-bg: var(--ink);
367
+ --btn-fg: #ffffff;
368
+ --btn-hover: #32383f;
369
+ --footer: rgba(101, 109, 118, 0.62);
370
+ --page-outer: #eaeef2;
371
+ --page-bg: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.5) 43%, rgba(255, 255, 255, 0.2) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
372
+ --page-tint: linear-gradient(180deg, rgba(255, 255, 255, 0.3), rgba(246, 248, 250, 0.3));
373
+ }
374
+
375
+ html[data-theme='github-dark'] {
376
+ color-scheme: dark;
377
+ --paper: #161b22;
378
+ --paper-2: #1c2128;
379
+ --ink: #e6edf3;
380
+ --muted: #8b949e;
381
+ --line: rgba(240, 246, 252, 0.14);
382
+ --border-strong: rgba(240, 246, 252, 0.28);
383
+ --accent: #58a6ff;
384
+ --accent-dark: #79c0ff;
385
+ --glass: rgba(13, 17, 23, 0.85);
386
+ --nav: #cdd7e0;
387
+ --copy: #b6c0ca;
388
+ --hint: #8b949e;
389
+ --label: #a8b2bd;
390
+ --kicker: #9ba6b1;
391
+ --surface: rgba(240, 246, 252, 0.06);
392
+ --surface-strong: rgba(240, 246, 252, 0.12);
393
+ --field-bg: rgba(240, 246, 252, 0.05);
394
+ --btn-bg: var(--accent);
395
+ --btn-fg: #0d1117;
396
+ --btn-hover: #79c0ff;
397
+ --footer: rgba(230, 237, 243, 0.5);
398
+ --page-outer: #0d1117;
399
+ --page-bg: linear-gradient(90deg, rgba(13, 17, 23, 0.85) 0%, rgba(13, 17, 23, 0.62) 43%, rgba(13, 17, 23, 0.34) 100%), url("/img/fondo-agentes.webp") center/cover fixed no-repeat;
400
+ --page-tint: linear-gradient(180deg, rgba(13, 17, 23, 0.4), rgba(22, 27, 34, 0.4));
401
+ }
402
+
91
403
  * { box-sizing: border-box; }
92
404
 
93
405
  html, body {
@@ -186,8 +498,8 @@
186
498
  /* El icono muestra el tema al que se va a cambiar: claro -> luna, oscuro -> sol. */
187
499
  #theme-toggle .ico-sun { display: none; }
188
500
  #theme-toggle .ico-moon { display: block; }
189
- html[data-theme='dark'] #theme-toggle .ico-sun { display: block; }
190
- html[data-theme='dark'] #theme-toggle .ico-moon { display: none; }
501
+ html[data-scheme='dark'] #theme-toggle .ico-sun { display: block; }
502
+ html[data-scheme='dark'] #theme-toggle .ico-moon { display: none; }
191
503
 
192
504
  .hero {
193
505
  width: min(1180px, calc(100% - 48px));
@@ -346,14 +658,13 @@
346
658
  border-radius: 11px;
347
659
  padding: 14px;
348
660
  background: var(--accent);
349
- color: #fff;
661
+ color: var(--btn-fg);
350
662
  font-weight: 800;
351
663
  font-size: 13px;
352
664
  cursor: pointer;
353
665
  box-shadow: 0 12px 22px rgba(189, 84, 47, 0.18);
354
666
  }
355
667
  .login-btn:hover { background: var(--accent-dark); }
356
- html[data-theme='dark'] .login-btn { color: #fff7ef; }
357
668
 
358
669
  .divider {
359
670
  display: flex;
@@ -1,5 +1,7 @@
1
1
  // Tamnora Harness landing: login real contra el server local.
2
2
 
3
+ import { nextTheme } from '../appearance.js';
4
+
3
5
  const userInput = document.getElementById('user');
4
6
  const passwordInput = document.getElementById('password');
5
7
  const toggle = document.getElementById('toggle-password');
@@ -10,7 +12,7 @@ const enterDirect = document.getElementById('enter-direct');
10
12
  const themeToggle = document.getElementById('theme-toggle');
11
13
 
12
14
  themeToggle.addEventListener('click', () => {
13
- const next = document.documentElement.dataset.theme === 'dark' ? 'paper' : 'dark';
15
+ const next = nextTheme(document.documentElement.dataset.theme);
14
16
  document.documentElement.dataset.theme = next;
15
17
  try {
16
18
  localStorage.setItem('tamnora-console-theme', next);