@artivism/tokens 0.1.0 → 0.1.1

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.
Files changed (4) hide show
  1. package/dist/index.css +68 -14
  2. package/package.json +8 -22
  3. package/src/base.css +5 -0
  4. package/src/index.css +91 -0
package/dist/index.css CHANGED
@@ -1,18 +1,43 @@
1
1
  @theme {
2
- /* Colors - semantic roles */
3
- --color-surface: #ffffff;
4
- --color-surface-muted: #f5f5f5;
5
- --color-accent: #6366f1;
6
- --color-accent-hover: #4f46e5;
7
- --color-text: #171717;
8
- --color-text-muted: #737373;
9
- --color-border: #e5e5e5;
10
- --color-error: #ef4444;
11
- --color-success: #22c55e;
12
-
13
- /* Typography */
14
- --font-sans: system-ui, -apple-system, sans-serif;
15
- --font-mono: ui-monospace, monospace;
2
+ /* Artivism Palette (named) */
3
+ --artivism-blackout: #121212;
4
+ --artivism-guerrilla: #1c1c1c;
5
+ --artivism-hijack: #212121;
6
+ --artivism-detour: #2a2a2a;
7
+ --artivism-spoof: #333333;
8
+
9
+ --artivism-pasteup: #666666;
10
+ --artivism-stickerbomb: #a1a1aa;
11
+ --artivism-flashmob: #d4d4d8;
12
+ --artivism-wheatpaste: #ffffff;
13
+
14
+ --artivism-green: #66ff99;
15
+ --artivism-green-hover: color-mix(in oklab, var(--artivism-green), black 15%);
16
+
17
+ --artivism-alert-red: #ef4444;
18
+ --artivism-success-green: #22c55e;
19
+
20
+ /* Semantic mapping */
21
+ --color-canvas: var(--artivism-blackout);
22
+ --color-surface: var(--artivism-guerrilla);
23
+ --color-surface-muted: var(--artivism-hijack);
24
+ --color-surface-elevated: var(--artivism-spoof);
25
+
26
+ --color-accent: var(--artivism-green);
27
+ --color-accent-hover: var(--artivism-green-hover);
28
+
29
+ --color-text: var(--artivism-wheatpaste);
30
+ --color-text-muted: var(--artivism-stickerbomb);
31
+ --color-text-tertiary: var(--artivism-pasteup);
32
+
33
+ --color-border: var(--artivism-detour);
34
+
35
+ --color-error: var(--artivism-alert-red);
36
+ --color-success: var(--artivism-success-green);
37
+
38
+ /* Typography (Geist) */
39
+ --font-sans: Geist, ui-sans-serif, system-ui, sans-serif;
40
+ --font-mono: "Geist Mono", ui-monospace, monospace;
16
41
 
17
42
  --text-xs: 0.75rem;
18
43
  --text-sm: 0.875rem;
@@ -35,3 +60,32 @@
35
60
  --radius-lg: 0.75rem;
36
61
  --radius-full: 9999px;
37
62
  }
63
+
64
+ :root {
65
+ /* shadcn semantic variables */
66
+ --background: var(--artivism-blackout);
67
+ --foreground: var(--artivism-wheatpaste);
68
+ --card: var(--artivism-guerrilla);
69
+ --card-foreground: var(--artivism-wheatpaste);
70
+ --popover: var(--artivism-spoof);
71
+ --popover-foreground: var(--artivism-wheatpaste);
72
+ --primary: var(--artivism-green);
73
+ --primary-foreground: var(--artivism-blackout);
74
+ --secondary: var(--artivism-hijack);
75
+ --secondary-foreground: var(--artivism-flashmob);
76
+ --muted: var(--artivism-hijack);
77
+ --muted-foreground: var(--artivism-stickerbomb);
78
+ --accent: var(--artivism-green);
79
+ --accent-foreground: var(--artivism-blackout);
80
+ --destructive: var(--artivism-alert-red);
81
+ --border: var(--artivism-detour);
82
+ --input: var(--artivism-detour);
83
+ --ring: var(--artivism-green);
84
+ --radius: 0.5rem;
85
+ }
86
+
87
+ /* Aggiungi anche in @theme per generare utility */
88
+ @theme {
89
+ --background: var(--artivism-blackout);
90
+ --foreground: var(--artivism-wheatpaste);
91
+ }
package/package.json CHANGED
@@ -1,31 +1,17 @@
1
1
  {
2
2
  "name": "@artivism/tokens",
3
- "version": "0.1.0",
4
- "description": "Design tokens for Artivism Design System",
5
- "main": "./dist/index.css",
3
+ "version": "0.1.1",
4
+ "type": "module",
6
5
  "exports": {
7
- ".": "./dist/index.css",
6
+ ".": "./src/index.ts",
7
+ "./css": "./dist/index.css",
8
8
  "./base": "./dist/base.css"
9
9
  },
10
10
  "files": [
11
- "dist"
11
+ "dist",
12
+ "src"
12
13
  ],
13
14
  "scripts": {
14
- "build": "mkdir -p dist && cp src/*.css dist/",
15
- "dev": "npm run build"
16
- },
17
- "keywords": [
18
- "design-system",
19
- "design-tokens",
20
- "css",
21
- "artivism"
22
- ],
23
- "author": "artivism",
24
- "license": "MIT",
25
- "repository": {
26
- "type": "git",
27
- "url": "https://github.com/artivism/design-system.git",
28
- "directory": "packages/tokens"
29
- },
30
- "homepage": "https://design.artivism.it"
15
+ "build": "node build.js"
16
+ }
31
17
  }
package/src/base.css ADDED
@@ -0,0 +1,5 @@
1
+ @layer tokens, components, utilities;
2
+
3
+ @layer tokens {
4
+ @import "./index.css";
5
+ }
package/src/index.css ADDED
@@ -0,0 +1,91 @@
1
+ @theme {
2
+ /* Artivism Palette (named) */
3
+ --artivism-blackout: #121212;
4
+ --artivism-guerrilla: #1c1c1c;
5
+ --artivism-hijack: #212121;
6
+ --artivism-detour: #2a2a2a;
7
+ --artivism-spoof: #333333;
8
+
9
+ --artivism-pasteup: #666666;
10
+ --artivism-stickerbomb: #a1a1aa;
11
+ --artivism-flashmob: #d4d4d8;
12
+ --artivism-wheatpaste: #ffffff;
13
+
14
+ --artivism-green: #66ff99;
15
+ --artivism-green-hover: color-mix(in oklab, var(--artivism-green), black 15%);
16
+
17
+ --artivism-alert-red: #ef4444;
18
+ --artivism-success-green: #22c55e;
19
+
20
+ /* Semantic mapping */
21
+ --color-canvas: var(--artivism-blackout);
22
+ --color-surface: var(--artivism-guerrilla);
23
+ --color-surface-muted: var(--artivism-hijack);
24
+ --color-surface-elevated: var(--artivism-spoof);
25
+
26
+ --color-accent: var(--artivism-green);
27
+ --color-accent-hover: var(--artivism-green-hover);
28
+
29
+ --color-text: var(--artivism-wheatpaste);
30
+ --color-text-muted: var(--artivism-stickerbomb);
31
+ --color-text-tertiary: var(--artivism-pasteup);
32
+
33
+ --color-border: var(--artivism-detour);
34
+
35
+ --color-error: var(--artivism-alert-red);
36
+ --color-success: var(--artivism-success-green);
37
+
38
+ /* Typography (Geist) */
39
+ --font-sans: Geist, ui-sans-serif, system-ui, sans-serif;
40
+ --font-mono: "Geist Mono", ui-monospace, monospace;
41
+
42
+ --text-xs: 0.75rem;
43
+ --text-sm: 0.875rem;
44
+ --text-base: 1rem;
45
+ --text-lg: 1.125rem;
46
+ --text-xl: 1.25rem;
47
+ --text-2xl: 1.5rem;
48
+
49
+ /* Spacing */
50
+ --spacing-1: 0.25rem;
51
+ --spacing-2: 0.5rem;
52
+ --spacing-3: 0.75rem;
53
+ --spacing-4: 1rem;
54
+ --spacing-6: 1.5rem;
55
+ --spacing-8: 2rem;
56
+
57
+ /* Radius */
58
+ --radius-sm: 0.25rem;
59
+ --radius-md: 0.5rem;
60
+ --radius-lg: 0.75rem;
61
+ --radius-full: 9999px;
62
+ }
63
+
64
+ :root {
65
+ /* shadcn semantic variables */
66
+ --background: var(--artivism-blackout);
67
+ --foreground: var(--artivism-wheatpaste);
68
+ --card: var(--artivism-guerrilla);
69
+ --card-foreground: var(--artivism-wheatpaste);
70
+ --popover: var(--artivism-spoof);
71
+ --popover-foreground: var(--artivism-wheatpaste);
72
+ --primary: var(--artivism-green);
73
+ --primary-foreground: var(--artivism-blackout);
74
+ --secondary: var(--artivism-hijack);
75
+ --secondary-foreground: var(--artivism-flashmob);
76
+ --muted: var(--artivism-hijack);
77
+ --muted-foreground: var(--artivism-stickerbomb);
78
+ --accent: var(--artivism-green);
79
+ --accent-foreground: var(--artivism-blackout);
80
+ --destructive: var(--artivism-alert-red);
81
+ --border: var(--artivism-detour);
82
+ --input: var(--artivism-detour);
83
+ --ring: var(--artivism-green);
84
+ --radius: 0.5rem;
85
+ }
86
+
87
+ /* Aggiungi anche in @theme per generare utility */
88
+ @theme {
89
+ --background: var(--artivism-blackout);
90
+ --foreground: var(--artivism-wheatpaste);
91
+ }