@tensor_1/tokens 2.56.0 → 2.57.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.
- package/build/css/components.css +1 -1
- package/build/css/styles.css +1 -1
- package/build/css/tokens.css +82 -0
- package/build/tailwind/preset.cjs +41 -0
- package/build/tailwind/theme.css +41 -0
- package/build/ts/tokens.d.ts +1 -1
- package/build/ts/tokens.js +123 -0
- package/package.json +1 -1
- package/styles/components/file-kit.css +155 -0
- package/styles/components/flow.css +4 -8
- package/styles/components/heartbeat.css +6 -19
- package/tokens/base/color.json +42 -0
- package/tokens/dark/color.json +42 -0
package/tokens/base/color.json
CHANGED
|
@@ -95,6 +95,48 @@
|
|
|
95
95
|
"chart-partial": { "$type": "color", "$value": "rgba(10,10,10,.10)", "$description": "Hatch base for a partial (incomplete) period." },
|
|
96
96
|
"chart-comparison": { "$type": "color", "$value": "#B8B8B8", "$description": "Muted ghost line for the comparison period (last week, last year)." },
|
|
97
97
|
|
|
98
|
+
"file-img": { "$type": "color", "$value": "var(--uix-chart-3)", "$description": "File kinds (file kit 2.57): one hue per kind of attachment, drawn by FileIcon, FileRow and FileDrop. None is red (red stays for broken) and none is the brand blue (blue stays for actions). Five equal a calm chart slot in light and alias it, so a file and a chart never fight: img chart-3, doc chart-5, mail chart-7, code chart-2, log chart-6. Every kind clears 3:1 on --uix-surface and --uix-bg-app as an icon stroke (file-kinds.test.mjs)." },
|
|
99
|
+
"file-img-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-img) 12%, transparent)", "$description": "The kind as a resting tint: the left edge of a FileRow, the start of an upload fill. Dark 15 %." },
|
|
100
|
+
"file-img-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-img) 22%, transparent)", "$description": "The leading end of an upload fill. Dark 26 %." },
|
|
101
|
+
"file-img-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-img) 28%, var(--uix-border))", "$description": "A FileRow border: the kind mixed into the line colour. Dark 32 %." },
|
|
102
|
+
"file-img-label": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-img) 86%, #000000)", "$description": "The fill of the type label on a FileIcon corner, under --uix-file-label-fg. Light deepens the kind by 14 % black so white label text clears 4.5:1 on every kind (the plain kinds give white 3.6-4.2:1); dark uses the kind itself." },
|
|
103
|
+
"file-doc": { "$type": "color", "$value": "var(--uix-chart-5)", "$description": "Dokument. Alias of --uix-chart-5 (#B45E9A)." },
|
|
104
|
+
"file-doc-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-doc) 12%, transparent)" },
|
|
105
|
+
"file-doc-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-doc) 22%, transparent)" },
|
|
106
|
+
"file-doc-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-doc) 28%, var(--uix-border))" },
|
|
107
|
+
"file-doc-label": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-doc) 86%, #000000)" },
|
|
108
|
+
"file-sheet": { "$type": "color", "$value": "#3F8F55", "$description": "Tabelle (#3F8F55)." },
|
|
109
|
+
"file-sheet-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-sheet) 12%, transparent)" },
|
|
110
|
+
"file-sheet-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-sheet) 22%, transparent)" },
|
|
111
|
+
"file-sheet-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-sheet) 28%, var(--uix-border))" },
|
|
112
|
+
"file-sheet-label": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-sheet) 86%, #000000)" },
|
|
113
|
+
"file-mail": { "$type": "color", "$value": "var(--uix-chart-7)", "$description": "E-Mail. Alias of --uix-chart-7 (#2F8FC2)." },
|
|
114
|
+
"file-mail-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-mail) 12%, transparent)" },
|
|
115
|
+
"file-mail-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-mail) 22%, transparent)" },
|
|
116
|
+
"file-mail-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-mail) 28%, var(--uix-border))" },
|
|
117
|
+
"file-mail-label": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-mail) 86%, #000000)" },
|
|
118
|
+
"file-code": { "$type": "color", "$value": "var(--uix-chart-2)", "$description": "Code & Konfiguration. Alias of --uix-chart-2 (#1F978A)." },
|
|
119
|
+
"file-code-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-code) 12%, transparent)" },
|
|
120
|
+
"file-code-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-code) 22%, transparent)" },
|
|
121
|
+
"file-code-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-code) 28%, var(--uix-border))" },
|
|
122
|
+
"file-code-label": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-code) 86%, #000000)" },
|
|
123
|
+
"file-log": { "$type": "color", "$value": "var(--uix-chart-6)", "$description": "Protokoll. Alias of --uix-chart-6 (#7F8A2E)." },
|
|
124
|
+
"file-log-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-log) 12%, transparent)" },
|
|
125
|
+
"file-log-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-log) 22%, transparent)" },
|
|
126
|
+
"file-log-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-log) 28%, var(--uix-border))" },
|
|
127
|
+
"file-log-label": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-log) 86%, #000000)" },
|
|
128
|
+
"file-archive": { "$type": "color", "$value": "#8A7A66", "$description": "Archiv (#8A7A66)." },
|
|
129
|
+
"file-archive-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-archive) 12%, transparent)" },
|
|
130
|
+
"file-archive-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-archive) 22%, transparent)" },
|
|
131
|
+
"file-archive-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-archive) 28%, var(--uix-border))" },
|
|
132
|
+
"file-archive-label": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-archive) 86%, #000000)" },
|
|
133
|
+
"file-other": { "$type": "color", "$value": "#808080", "$description": "Datei (#808080)." },
|
|
134
|
+
"file-other-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-other) 12%, transparent)" },
|
|
135
|
+
"file-other-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-other) 22%, transparent)" },
|
|
136
|
+
"file-other-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-other) 28%, var(--uix-border))" },
|
|
137
|
+
"file-other-label": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-other) 86%, #000000)" },
|
|
138
|
+
"file-label-fg": { "$type": "color", "$value": "#FFFFFF", "$description": "Text on a file type label: white in light, ink in dark. 4.5:1 or more on every --uix-file-*-label." },
|
|
139
|
+
|
|
98
140
|
"row": { "$type": "color", "$value": "#FFFFFF" },
|
|
99
141
|
"row-alt": { "$type": "color", "$value": "#FAFAFA" },
|
|
100
142
|
"row-pinned-bg": { "$type": "color", "$value": "#F4F7FF" },
|
package/tokens/dark/color.json
CHANGED
|
@@ -78,6 +78,48 @@
|
|
|
78
78
|
"chart-partial": { "$type": "color", "$value": "rgba(250,250,250,.12)" },
|
|
79
79
|
"chart-comparison": { "$type": "color", "$value": "#5C5C5C" },
|
|
80
80
|
|
|
81
|
+
"file-img": { "$type": "color", "$value": "#A58FE6" },
|
|
82
|
+
"file-img-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-img) 15%, transparent)" },
|
|
83
|
+
"file-img-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-img) 26%, transparent)" },
|
|
84
|
+
"file-img-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-img) 32%, var(--uix-border))" },
|
|
85
|
+
"file-img-label": { "$type": "color", "$value": "var(--uix-file-img)" },
|
|
86
|
+
"file-doc": { "$type": "color", "$value": "#CF7FB6" },
|
|
87
|
+
"file-doc-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-doc) 15%, transparent)" },
|
|
88
|
+
"file-doc-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-doc) 26%, transparent)" },
|
|
89
|
+
"file-doc-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-doc) 32%, var(--uix-border))" },
|
|
90
|
+
"file-doc-label": { "$type": "color", "$value": "var(--uix-file-doc)" },
|
|
91
|
+
"file-sheet": { "$type": "color", "$value": "#5DB07A" },
|
|
92
|
+
"file-sheet-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-sheet) 15%, transparent)" },
|
|
93
|
+
"file-sheet-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-sheet) 26%, transparent)" },
|
|
94
|
+
"file-sheet-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-sheet) 32%, var(--uix-border))" },
|
|
95
|
+
"file-sheet-label": { "$type": "color", "$value": "var(--uix-file-sheet)" },
|
|
96
|
+
"file-mail": { "$type": "color", "$value": "#55A9D9" },
|
|
97
|
+
"file-mail-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-mail) 15%, transparent)" },
|
|
98
|
+
"file-mail-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-mail) 26%, transparent)" },
|
|
99
|
+
"file-mail-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-mail) 32%, var(--uix-border))" },
|
|
100
|
+
"file-mail-label": { "$type": "color", "$value": "var(--uix-file-mail)" },
|
|
101
|
+
"file-code": { "$type": "color", "$value": "#3DB5A7" },
|
|
102
|
+
"file-code-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-code) 15%, transparent)" },
|
|
103
|
+
"file-code-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-code) 26%, transparent)" },
|
|
104
|
+
"file-code-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-code) 32%, var(--uix-border))" },
|
|
105
|
+
"file-code-label": { "$type": "color", "$value": "var(--uix-file-code)" },
|
|
106
|
+
"file-log": { "$type": "color", "$value": "#A3AE4C" },
|
|
107
|
+
"file-log-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-log) 15%, transparent)" },
|
|
108
|
+
"file-log-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-log) 26%, transparent)" },
|
|
109
|
+
"file-log-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-log) 32%, var(--uix-border))" },
|
|
110
|
+
"file-log-label": { "$type": "color", "$value": "var(--uix-file-log)" },
|
|
111
|
+
"file-archive": { "$type": "color", "$value": "#B0A08A" },
|
|
112
|
+
"file-archive-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-archive) 15%, transparent)" },
|
|
113
|
+
"file-archive-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-archive) 26%, transparent)" },
|
|
114
|
+
"file-archive-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-archive) 32%, var(--uix-border))" },
|
|
115
|
+
"file-archive-label": { "$type": "color", "$value": "var(--uix-file-archive)" },
|
|
116
|
+
"file-other": { "$type": "color", "$value": "#8C8C8C" },
|
|
117
|
+
"file-other-soft": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-other) 15%, transparent)" },
|
|
118
|
+
"file-other-strong": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-other) 26%, transparent)" },
|
|
119
|
+
"file-other-edge": { "$type": "color", "$value": "color-mix(in srgb, var(--uix-file-other) 32%, var(--uix-border))" },
|
|
120
|
+
"file-other-label": { "$type": "color", "$value": "var(--uix-file-other)" },
|
|
121
|
+
"file-label-fg": { "$type": "color", "$value": "#0A0A0A" },
|
|
122
|
+
|
|
81
123
|
"row": { "$type": "color", "$value": "#111111" },
|
|
82
124
|
"row-alt": { "$type": "color", "$value": "#161616" },
|
|
83
125
|
"row-pinned-bg": { "$type": "color", "$value": "rgba(48,128,255,.08)" },
|