@solid-design-system/tokens 5.0.0 → 5.2.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/README.md +2 -27
- package/dist/tokens.scss +1 -0
- package/dist/tokens.tailwind.json +8 -0
- package/package.json +12 -51
package/README.md
CHANGED
|
@@ -2,34 +2,9 @@
|
|
|
2
2
|

|
|
3
3
|

|
|
4
4
|
</div>
|
|
5
|
-
|
|
5
|
+
|
|
6
|
+
# @solid-design-system/tokens
|
|
6
7
|
|
|
7
8
|
The Solid Design System Tokens package provides a collection of design tokens for colors, typography and spacing. It ensures design consistency and collaboration between our designers and developers when building components for the Solid Design System.
|
|
8
9
|
|
|
9
10
|
Check out the [full documentation](https://solid-design-system.fe.union-investment.de/docs/) for detailed information.
|
|
10
|
-
|
|
11
|
-
### Handling tokens (for Figma maintainers ONLY)
|
|
12
|
-
|
|
13
|
-
Any changes in the token set in Token Studio plugin must be in a new branch branched from `main`with these information:
|
|
14
|
-
|
|
15
|
-
Branch Name:
|
|
16
|
-
|
|
17
|
-
feat/title
|
|
18
|
-
|
|
19
|
-
fix/title
|
|
20
|
-
|
|
21
|
-
Description: closes #123 (Write ticket number if it exists, automatically closes linked ticket when merged)
|
|
22
|
-
|
|
23
|
-

|
|
24
|
-
|
|
25
|
-

|
|
26
|
-
|
|
27
|
-
> Note: If the token is related to Figma native style i.e.: color, choose "create styles" so Figma style and token are in sync
|
|
28
|
-
|
|
29
|
-
Then push with a commit message according to the development standards and create a PR ticket to hand over
|
|
30
|
-
|
|
31
|
-

|
|
32
|
-
|
|
33
|
-

|
|
34
|
-
|
|
35
|
-
After front-end's approval and all tests are passed (quality gate, Chromatic tests etc.) hit `Squash and Merge` button, write a message (especially if there's any changes in token naming or deprecating note "BREAKING CHANGE: ..."
|
package/dist/tokens.scss
CHANGED
|
@@ -40,6 +40,7 @@ $sd-borderColor-primary-800: (rgb(var(--sd-color-primary-800, 5 21 48)) /* Used
|
|
|
40
40
|
$sd-borderColor-primary-DEFAULT: (rgb(var(--sd-color-primary, 0 53 142)) /* Used for buttons, select field, focus state */);
|
|
41
41
|
$sd-borderColor-white: (rgb(var(--sd-color-white, 255 255 255)) /* Used for buttons, inverted focus state */);
|
|
42
42
|
$sd-borderColor-accent-550: (rgb(var(--sd-color-accent-550, 54 123 40)) /* Used for hover interaction */);
|
|
43
|
+
$sd-borderColor-accent-700: (rgb(var(--sd-color-accent-700, 33 87 37)) /* Used for motion design only */);
|
|
43
44
|
$sd-borderColor-accent-DEFAULT: (rgb(var(--sd-color-accent, 45 157 0)) /* Used to highlight active/selected elements
|
|
44
45
|
*/);
|
|
45
46
|
$sd-borderColor-neutral-400: (rgb(var(--sd-color-neutral-400, 195 195 195)) /* Default border color.
|
|
@@ -85,6 +85,7 @@
|
|
|
85
85
|
"white": "rgb(var(--sd-color-white, 255 255 255) / <alpha-value>) /* Used for buttons, inverted focus state */",
|
|
86
86
|
"accent": {
|
|
87
87
|
"550": "rgb(var(--sd-color-accent-550, 54 123 40) / <alpha-value>) /* Used for hover interaction */",
|
|
88
|
+
"700": "rgb(var(--sd-color-accent-700, 33 87 37) / <alpha-value>) /* Used for motion design only */",
|
|
88
89
|
"DEFAULT": "rgb(var(--sd-color-accent, 45 157 0) / <alpha-value>) /* Used to highlight active/selected elements\n */"
|
|
89
90
|
},
|
|
90
91
|
"neutral": {
|
|
@@ -374,6 +375,7 @@
|
|
|
374
375
|
"white": "rgb(var(--sd-color-white, 255 255 255) / <alpha-value>) /* Used for buttons, inverted focus state */",
|
|
375
376
|
"accent": {
|
|
376
377
|
"550": "rgb(var(--sd-color-accent-550, 54 123 40) / <alpha-value>) /* Used for hover interaction */",
|
|
378
|
+
"700": "rgb(var(--sd-color-accent-700, 33 87 37) / <alpha-value>) /* Used for motion design only */",
|
|
377
379
|
"DEFAULT": "rgb(var(--sd-color-accent, 45 157 0) / <alpha-value>) /* Used to highlight active/selected elements\n */"
|
|
378
380
|
},
|
|
379
381
|
"neutral": {
|
|
@@ -442,6 +444,7 @@
|
|
|
442
444
|
"white": "rgb(var(--sd-color-white, 255 255 255) / <alpha-value>) /* Used for buttons, inverted focus state */",
|
|
443
445
|
"accent": {
|
|
444
446
|
"550": "rgb(var(--sd-color-accent-550, 54 123 40) / <alpha-value>) /* Used for hover interaction */",
|
|
447
|
+
"700": "rgb(var(--sd-color-accent-700, 33 87 37) / <alpha-value>) /* Used for motion design only */",
|
|
445
448
|
"DEFAULT": "rgb(var(--sd-color-accent, 45 157 0) / <alpha-value>) /* Used to highlight active/selected elements\n */"
|
|
446
449
|
},
|
|
447
450
|
"neutral": {
|
|
@@ -566,6 +569,7 @@
|
|
|
566
569
|
"white": "rgb(var(--sd-color-white, 255 255 255) / <alpha-value>) /* Used for buttons, inverted focus state */",
|
|
567
570
|
"accent": {
|
|
568
571
|
"550": "rgb(var(--sd-color-accent-550, 54 123 40) / <alpha-value>) /* Used for hover interaction */",
|
|
572
|
+
"700": "rgb(var(--sd-color-accent-700, 33 87 37) / <alpha-value>) /* Used for motion design only */",
|
|
569
573
|
"DEFAULT": "rgb(var(--sd-color-accent, 45 157 0) / <alpha-value>) /* Used to highlight active/selected elements\n */"
|
|
570
574
|
},
|
|
571
575
|
"neutral": {
|
|
@@ -658,6 +662,10 @@
|
|
|
658
662
|
"DEFAULT": "var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%))",
|
|
659
663
|
"sm": "var(--sd-shadow-sm, 0.5px 0.5px 1.5px 0px rgb(81 81 81 / 100%))"
|
|
660
664
|
},
|
|
665
|
+
"dropShadow": {
|
|
666
|
+
"DEFAULT": "var(--sd-shadow, 0px 1px 3px rgb(81 81 81))",
|
|
667
|
+
"sm": "var(--sd-shadow-sm, 0.5px 0.5px 1.5px rgb(81 81 81))"
|
|
668
|
+
},
|
|
661
669
|
"zIndex": {
|
|
662
670
|
"10": "10",
|
|
663
671
|
"20": "20",
|
package/package.json
CHANGED
|
@@ -1,15 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@solid-design-system/tokens",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.2.0",
|
|
4
4
|
"description": "Solid Design System: Tokens",
|
|
5
|
-
"
|
|
6
|
-
|
|
7
|
-
"
|
|
8
|
-
"verify": "pnpm build",
|
|
9
|
-
"postversion": "pnpm build",
|
|
10
|
-
"release": "semantic-release --tagFormat 'tokens/${version}' -e semantic-release-monorepo",
|
|
11
|
-
"release.dry": "semantic-release -d --tagFormat 'tokens/${version}' -e semantic-release-monorepo"
|
|
5
|
+
"publishConfig": {
|
|
6
|
+
"access": "public",
|
|
7
|
+
"registry": "https://registry.npmjs.org/"
|
|
12
8
|
},
|
|
9
|
+
"main": "index.js",
|
|
13
10
|
"files": [
|
|
14
11
|
"dist"
|
|
15
12
|
],
|
|
@@ -29,48 +26,12 @@
|
|
|
29
26
|
},
|
|
30
27
|
"license": "MIT",
|
|
31
28
|
"devDependencies": {
|
|
32
|
-
"@semantic-release/changelog": "^6.0.3",
|
|
33
|
-
"@semantic-release/git": "^10.0.1",
|
|
34
|
-
"semantic-release": "^19.0.5",
|
|
35
|
-
"semantic-release-monorepo": "^7.0.5",
|
|
36
29
|
"tailwindcss-export-config": "^4.1.0"
|
|
37
30
|
},
|
|
38
|
-
"
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
"
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
[
|
|
46
|
-
"@semantic-release/changelog",
|
|
47
|
-
{
|
|
48
|
-
"changelogFile": "CHANGELOG.md"
|
|
49
|
-
}
|
|
50
|
-
],
|
|
51
|
-
[
|
|
52
|
-
"@semantic-release/npm",
|
|
53
|
-
{
|
|
54
|
-
"npmPublish": true
|
|
55
|
-
}
|
|
56
|
-
],
|
|
57
|
-
[
|
|
58
|
-
"@semantic-release/git",
|
|
59
|
-
{
|
|
60
|
-
"message": "chore(release/tokens): ${nextRelease.version} [skip actions]\n\n${nextRelease.notes}",
|
|
61
|
-
"assets": [
|
|
62
|
-
"CHANGELOG.md",
|
|
63
|
-
"package.json"
|
|
64
|
-
]
|
|
65
|
-
}
|
|
66
|
-
],
|
|
67
|
-
[
|
|
68
|
-
"@semantic-release/github",
|
|
69
|
-
{
|
|
70
|
-
"successComment": false
|
|
71
|
-
}
|
|
72
|
-
]
|
|
73
|
-
]
|
|
74
|
-
},
|
|
75
|
-
"readme": "README.md"
|
|
76
|
-
}
|
|
31
|
+
"readme": "README.md",
|
|
32
|
+
"scripts": {
|
|
33
|
+
"build": "node scripts/build.mjs && echo '✅ Build verified'",
|
|
34
|
+
"verify": "pnpm build",
|
|
35
|
+
"postversion": "pnpm build"
|
|
36
|
+
}
|
|
37
|
+
}
|