@sfperusacdev/sf-ui 0.1.15 → 0.1.16
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.
- package/dist/theme/dark.css +34 -2
- package/package.json +1 -1
package/dist/theme/dark.css
CHANGED
|
@@ -1,10 +1,21 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Tema oscuro NOC / dashboard — estilo ERP glass.
|
|
3
3
|
* import "@sfperusacdev/sf-ui/theme/dark.css";
|
|
4
|
+
*
|
|
5
|
+
* Es una CAPA que se monta ENCIMA de un tema base (sark.css / erp.css), nunca
|
|
6
|
+
* sola: el tema base ya trae sf-tokens.css. Por eso aquí NO se hace
|
|
7
|
+
* `@import "./sf-tokens.css"` — re-importarlo volvía a aplicar los defaults de
|
|
8
|
+
* tokens DESPUÉS del tema base y le pisaba 96 variables.
|
|
9
|
+
*
|
|
10
|
+
* Va scopeado a [data-theme='dark'] a propósito: así el archivo puede estar
|
|
11
|
+
* cargado permanentemente y el modo depende SOLO del atributo del <html>.
|
|
12
|
+
* Antes iba en `:root` pelado y lo único que separaba claro de oscuro era
|
|
13
|
+
* `link.disabled`, que según CSSOM es un no-op mientras la hoja no terminó de
|
|
14
|
+
* cargar (`link.sheet === null`) — la hoja entraba habilitada y la app se
|
|
15
|
+
* ponía oscura sola.
|
|
4
16
|
*/
|
|
5
|
-
@import "./sf-tokens.css";
|
|
6
17
|
|
|
7
|
-
:root {
|
|
18
|
+
:root[data-theme='dark'] {
|
|
8
19
|
--sf-primary: #e2e8f0;
|
|
9
20
|
--sf-primary-muted: #94a3b8;
|
|
10
21
|
--sf-accent: #38bdf8;
|
|
@@ -153,4 +164,25 @@
|
|
|
153
164
|
--sf-live-route-hover: var(--sf-surface);
|
|
154
165
|
--sf-live-unit-pill-bg: var(--sf-surface);
|
|
155
166
|
--sf-passenger-onboard-bg: color-mix(in srgb, var(--sf-success) 12%, var(--sf-card-bg));
|
|
167
|
+
|
|
168
|
+
/* Las 17 que antes llegaban por el `@import` de sf-tokens.css. Se copian con
|
|
169
|
+
ese mismo valor para que el oscuro se vea EXACTAMENTE igual que antes: al
|
|
170
|
+
quitar el import las heredaría del tema base (sark) y cambiarían de color. */
|
|
171
|
+
--sf-app-shell-accent: #2e9e5b;
|
|
172
|
+
--sf-app-shell-topbar-muted: #9fb6c4;
|
|
173
|
+
--sf-badge-primary-dot: #334155;
|
|
174
|
+
--sf-btn-primary-shadow-hover: none;
|
|
175
|
+
--sf-danger: #dc2626;
|
|
176
|
+
--sf-danger-border: #fecdd3;
|
|
177
|
+
--sf-green-light: #64748b;
|
|
178
|
+
--sf-info: #2563eb;
|
|
179
|
+
--sf-info-border: #bfdbfe;
|
|
180
|
+
--sf-modal-header-icon-bg: var(--sf-app-shell-accent);
|
|
181
|
+
--sf-module-body-min-height-tile: 2.375rem;
|
|
182
|
+
--sf-module-body-min-height-tile-compact: 2.125rem;
|
|
183
|
+
--sf-module-favorite-opacity: 0.78;
|
|
184
|
+
--sf-module-icon-letter-color: var(--sf-module-accent);
|
|
185
|
+
--sf-ring-width: 2px;
|
|
186
|
+
--sf-success: #16a34a;
|
|
187
|
+
--sf-warning: #d97706;
|
|
156
188
|
}
|
package/package.json
CHANGED