@vector-im/compound-design-tokens 6.4.0 → 6.4.2
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/assets/web/css/cpd-common-semantic.css +3 -3
- package/assets/web/icons/threads-solid.cjs +4 -8
- package/assets/web/icons/threads-solid.js +5 -9
- package/assets/web/icons/threads.cjs +2 -4
- package/assets/web/icons/threads.js +2 -4
- package/assets/web/js/cpdDark.js +3 -3
- package/assets/web/js/cpdDarkHc.js +3 -3
- package/assets/web/js/cpdLight.js +3 -3
- package/assets/web/js/cpdLightHc.js +3 -3
- package/icons/threads-solid.svg +1 -1
- package/icons/threads.svg +1 -1
- package/package.json +1 -1
|
@@ -4,10 +4,10 @@
|
|
|
4
4
|
--cpd-color-text-disabled: var(--cpd-color-gray-800);
|
|
5
5
|
--cpd-color-text-action-primary: var(--cpd-color-gray-1400);
|
|
6
6
|
--cpd-color-text-action-accent: var(--cpd-color-green-900);
|
|
7
|
-
--cpd-color-text-link-external: var(--cpd-color-blue-
|
|
7
|
+
--cpd-color-text-link-external: var(--cpd-color-blue-1100);
|
|
8
8
|
--cpd-color-text-critical-primary: var(--cpd-color-red-900);
|
|
9
9
|
--cpd-color-text-success-primary: var(--cpd-color-green-900);
|
|
10
|
-
--cpd-color-text-info-primary: var(--cpd-color-blue-
|
|
10
|
+
--cpd-color-text-info-primary: var(--cpd-color-blue-1100);
|
|
11
11
|
--cpd-color-text-on-solid-primary: var(--cpd-color-theme-bg);
|
|
12
12
|
--cpd-color-text-decorative-1: var(--cpd-color-lime-1100);
|
|
13
13
|
--cpd-color-text-decorative-2: var(--cpd-color-cyan-1100);
|
|
@@ -71,7 +71,7 @@
|
|
|
71
71
|
--cpd-color-icon-accent-primary: var(--cpd-color-green-900);
|
|
72
72
|
--cpd-color-icon-critical-primary: var(--cpd-color-red-900);
|
|
73
73
|
--cpd-color-icon-success-primary: var(--cpd-color-green-900);
|
|
74
|
-
--cpd-color-icon-info-primary: var(--cpd-color-blue-
|
|
74
|
+
--cpd-color-icon-info-primary: var(--cpd-color-blue-1100);
|
|
75
75
|
--cpd-color-icon-on-solid-primary: var(--cpd-color-theme-bg);
|
|
76
76
|
--cpd-color-gradient-subtle-stop1: var(--cpd-color-alpha-green-500);
|
|
77
77
|
--cpd-color-gradient-subtle-stop2: var(--cpd-color-alpha-green-400);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
var _reactJsxRuntime = require("react/jsx-runtime");
|
|
2
2
|
var React = require("react");
|
|
3
3
|
function ThreadsSolidIcon(props, ref) {
|
|
4
|
-
return /*#__PURE__*/_reactJsxRuntime.
|
|
4
|
+
return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
|
|
5
5
|
xmlns: "http://www.w3.org/2000/svg",
|
|
6
6
|
width: "1em",
|
|
7
7
|
height: "1em",
|
|
@@ -9,13 +9,9 @@ function ThreadsSolidIcon(props, ref) {
|
|
|
9
9
|
viewBox: "0 0 24 24",
|
|
10
10
|
ref: ref,
|
|
11
11
|
...props,
|
|
12
|
-
children:
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
clipRule: "evenodd"
|
|
16
|
-
}), /*#__PURE__*/_reactJsxRuntime.jsx("path", {
|
|
17
|
-
d: "M19.5 2a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5"
|
|
18
|
-
})]
|
|
12
|
+
children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
|
|
13
|
+
d: "M4 3h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6l-2.293 2.293c-.63.63-1.707.184-1.707-.707V5a2 2 0 0 1 2-2m3 7h10q.424 0 .712-.287A.97.97 0 0 0 18 9a.97.97 0 0 0-.288-.713A.97.97 0 0 0 17 8H7a.97.97 0 0 0-.713.287A.97.97 0 0 0 6 9q0 .424.287.713Q6.576 10 7 10m0 4h6q.424 0 .713-.287A.97.97 0 0 0 14 13a.97.97 0 0 0-.287-.713A.97.97 0 0 0 13 12H7a.97.97 0 0 0-.713.287A.97.97 0 0 0 6 13q0 .424.287.713Q6.576 14 7 14"
|
|
14
|
+
})
|
|
19
15
|
});
|
|
20
16
|
}
|
|
21
17
|
;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { forwardRef } from "react";
|
|
2
|
-
import { jsx as _jsx
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
function ThreadsSolidIcon(props, ref) {
|
|
4
|
-
return /*#__PURE__*/
|
|
4
|
+
return /*#__PURE__*/_jsx("svg", {
|
|
5
5
|
xmlns: "http://www.w3.org/2000/svg",
|
|
6
6
|
width: "1em",
|
|
7
7
|
height: "1em",
|
|
@@ -9,13 +9,9 @@ function ThreadsSolidIcon(props, ref) {
|
|
|
9
9
|
viewBox: "0 0 24 24",
|
|
10
10
|
ref: ref,
|
|
11
11
|
...props,
|
|
12
|
-
children:
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
clipRule: "evenodd"
|
|
16
|
-
}), /*#__PURE__*/_jsx("path", {
|
|
17
|
-
d: "M19.5 2a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5"
|
|
18
|
-
})]
|
|
12
|
+
children: /*#__PURE__*/_jsx("path", {
|
|
13
|
+
d: "M4 3h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6l-2.293 2.293c-.63.63-1.707.184-1.707-.707V5a2 2 0 0 1 2-2m3 7h10q.424 0 .712-.287A.97.97 0 0 0 18 9a.97.97 0 0 0-.288-.713A.97.97 0 0 0 17 8H7a.97.97 0 0 0-.713.287A.97.97 0 0 0 6 9q0 .424.287.713Q6.576 10 7 10m0 4h6q.424 0 .713-.287A.97.97 0 0 0 14 13a.97.97 0 0 0-.287-.713A.97.97 0 0 0 13 12H7a.97.97 0 0 0-.713.287A.97.97 0 0 0 6 13q0 .424.287.713Q6.576 14 7 14"
|
|
14
|
+
})
|
|
19
15
|
});
|
|
20
16
|
}
|
|
21
17
|
;
|
|
@@ -10,11 +10,9 @@ function ThreadsIcon(props, ref) {
|
|
|
10
10
|
ref: ref,
|
|
11
11
|
...props,
|
|
12
12
|
children: [/*#__PURE__*/_reactJsxRuntime.jsx("path", {
|
|
13
|
-
d: "
|
|
13
|
+
d: "M7 10a.97.97 0 0 1-.713-.287A.97.97 0 0 1 6 9q0-.424.287-.713A.97.97 0 0 1 7 8h10q.424 0 .712.287Q18 8.576 18 9t-.288.713A.97.97 0 0 1 17 10zm0 4a.97.97 0 0 1-.713-.287A.97.97 0 0 1 6 13q0-.424.287-.713A.97.97 0 0 1 7 12h6q.424 0 .713.287.287.288.287.713 0 .424-.287.713A.97.97 0 0 1 13 14z"
|
|
14
14
|
}), /*#__PURE__*/_reactJsxRuntime.jsx("path", {
|
|
15
|
-
d: "
|
|
16
|
-
}), /*#__PURE__*/_reactJsxRuntime.jsx("path", {
|
|
17
|
-
d: "M19.5 2a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5"
|
|
15
|
+
d: "M3.707 21.293c-.63.63-1.707.184-1.707-.707V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6zM6 17h14V5H4v13.172l.586-.586A2 2 0 0 1 6 17"
|
|
18
16
|
})]
|
|
19
17
|
});
|
|
20
18
|
}
|
|
@@ -10,11 +10,9 @@ function ThreadsIcon(props, ref) {
|
|
|
10
10
|
ref: ref,
|
|
11
11
|
...props,
|
|
12
12
|
children: [/*#__PURE__*/_jsx("path", {
|
|
13
|
-
d: "
|
|
13
|
+
d: "M7 10a.97.97 0 0 1-.713-.287A.97.97 0 0 1 6 9q0-.424.287-.713A.97.97 0 0 1 7 8h10q.424 0 .712.287Q18 8.576 18 9t-.288.713A.97.97 0 0 1 17 10zm0 4a.97.97 0 0 1-.713-.287A.97.97 0 0 1 6 13q0-.424.287-.713A.97.97 0 0 1 7 12h6q.424 0 .713.287.287.288.287.713 0 .424-.287.713A.97.97 0 0 1 13 14z"
|
|
14
14
|
}), /*#__PURE__*/_jsx("path", {
|
|
15
|
-
d: "
|
|
16
|
-
}), /*#__PURE__*/_jsx("path", {
|
|
17
|
-
d: "M19.5 2a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5"
|
|
15
|
+
d: "M3.707 21.293c-.63.63-1.707.184-1.707-.707V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6zM6 17h14V5H4v13.172l.586-.586A2 2 0 0 1 6 17"
|
|
18
16
|
})]
|
|
19
17
|
});
|
|
20
18
|
}
|
package/assets/web/js/cpdDark.js
CHANGED
|
@@ -620,10 +620,10 @@ export const cpdColorTextSecondary = "#808994";
|
|
|
620
620
|
export const cpdColorTextDisabled = "#656c76";
|
|
621
621
|
export const cpdColorTextActionPrimary = "#ebeef2";
|
|
622
622
|
export const cpdColorTextActionAccent = "#129a78";
|
|
623
|
-
export const cpdColorTextLinkExternal = "#
|
|
623
|
+
export const cpdColorTextLinkExternal = "#7aacf4";
|
|
624
624
|
export const cpdColorTextCriticalPrimary = "#fd3e3c";
|
|
625
625
|
export const cpdColorTextSuccessPrimary = "#129a78";
|
|
626
|
-
export const cpdColorTextInfoPrimary = "#
|
|
626
|
+
export const cpdColorTextInfoPrimary = "#7aacf4";
|
|
627
627
|
export const cpdColorTextOnSolidPrimary = "#101317";
|
|
628
628
|
export const cpdColorTextDecorative1 = "#56c02c";
|
|
629
629
|
export const cpdColorTextDecorative2 = "#21bacd";
|
|
@@ -692,7 +692,7 @@ export const cpdColorIconAccentTertiary = "#007a62";
|
|
|
692
692
|
export const cpdColorIconAccentPrimary = "#129a78";
|
|
693
693
|
export const cpdColorIconCriticalPrimary = "#fd3e3c";
|
|
694
694
|
export const cpdColorIconSuccessPrimary = "#129a78";
|
|
695
|
-
export const cpdColorIconInfoPrimary = "#
|
|
695
|
+
export const cpdColorIconInfoPrimary = "#7aacf4";
|
|
696
696
|
export const cpdColorIconOnSolidPrimary = "#101317";
|
|
697
697
|
export const cpdColorGradientSubtleStop1 = "hsl(160, 100%, 12%, 1)";
|
|
698
698
|
export const cpdColorGradientSubtleStop2 = "hsl(155, 100%, 9%, 1)";
|
|
@@ -620,10 +620,10 @@ export const cpdColorTextSecondary = "#acb4bd";
|
|
|
620
620
|
export const cpdColorTextDisabled = "#79818d";
|
|
621
621
|
export const cpdColorTextActionPrimary = "#f2f5f7";
|
|
622
622
|
export const cpdColorTextActionAccent = "#37c998";
|
|
623
|
-
export const cpdColorTextLinkExternal = "#
|
|
623
|
+
export const cpdColorTextLinkExternal = "#b2cffa";
|
|
624
624
|
export const cpdColorTextCriticalPrimary = "#ff968c";
|
|
625
625
|
export const cpdColorTextSuccessPrimary = "#37c998";
|
|
626
|
-
export const cpdColorTextInfoPrimary = "#
|
|
626
|
+
export const cpdColorTextInfoPrimary = "#b2cffa";
|
|
627
627
|
export const cpdColorTextOnSolidPrimary = "#101317";
|
|
628
628
|
export const cpdColorTextDecorative1 = "#92e175";
|
|
629
629
|
export const cpdColorTextDecorative2 = "#93d9e2";
|
|
@@ -692,7 +692,7 @@ export const cpdColorIconAccentTertiary = "#109173";
|
|
|
692
692
|
export const cpdColorIconAccentPrimary = "#37c998";
|
|
693
693
|
export const cpdColorIconCriticalPrimary = "#ff968c";
|
|
694
694
|
export const cpdColorIconSuccessPrimary = "#37c998";
|
|
695
|
-
export const cpdColorIconInfoPrimary = "#
|
|
695
|
+
export const cpdColorIconInfoPrimary = "#b2cffa";
|
|
696
696
|
export const cpdColorIconOnSolidPrimary = "#101317";
|
|
697
697
|
export const cpdColorGradientSubtleStop1 = "hsl(162, 100%, 14%, 1)";
|
|
698
698
|
export const cpdColorGradientSubtleStop2 = "hsl(158, 100%, 11%, 1)";
|
|
@@ -620,10 +620,10 @@ export const cpdColorTextSecondary = "#656d77";
|
|
|
620
620
|
export const cpdColorTextDisabled = "#818a95";
|
|
621
621
|
export const cpdColorTextActionPrimary = "#1b1d22";
|
|
622
622
|
export const cpdColorTextActionAccent = "#007a61";
|
|
623
|
-
export const cpdColorTextLinkExternal = "#
|
|
623
|
+
export const cpdColorTextLinkExternal = "#064ab1";
|
|
624
624
|
export const cpdColorTextCriticalPrimary = "#d51928";
|
|
625
625
|
export const cpdColorTextSuccessPrimary = "#007a61";
|
|
626
|
-
export const cpdColorTextInfoPrimary = "#
|
|
626
|
+
export const cpdColorTextInfoPrimary = "#064ab1";
|
|
627
627
|
export const cpdColorTextOnSolidPrimary = "#ffffff";
|
|
628
628
|
export const cpdColorTextDecorative1 = "#005f00";
|
|
629
629
|
export const cpdColorTextDecorative2 = "#00548c";
|
|
@@ -692,7 +692,7 @@ export const cpdColorIconAccentTertiary = "#009b78";
|
|
|
692
692
|
export const cpdColorIconAccentPrimary = "#007a61";
|
|
693
693
|
export const cpdColorIconCriticalPrimary = "#d51928";
|
|
694
694
|
export const cpdColorIconSuccessPrimary = "#007a61";
|
|
695
|
-
export const cpdColorIconInfoPrimary = "#
|
|
695
|
+
export const cpdColorIconInfoPrimary = "#064ab1";
|
|
696
696
|
export const cpdColorIconOnSolidPrimary = "#ffffff";
|
|
697
697
|
export const cpdColorGradientSubtleStop1 = "hsla(154, 96%, 37%, 0.41)";
|
|
698
698
|
export const cpdColorGradientSubtleStop2 = "hsla(151, 93%, 37%, 0.23)";
|
|
@@ -620,10 +620,10 @@ export const cpdColorTextSecondary = "#474a51";
|
|
|
620
620
|
export const cpdColorTextDisabled = "#6c737e";
|
|
621
621
|
export const cpdColorTextActionPrimary = "#1a1c21";
|
|
622
622
|
export const cpdColorTextActionAccent = "#00553d";
|
|
623
|
-
export const cpdColorTextLinkExternal = "#
|
|
623
|
+
export const cpdColorTextLinkExternal = "#043088";
|
|
624
624
|
export const cpdColorTextCriticalPrimary = "#99001a";
|
|
625
625
|
export const cpdColorTextSuccessPrimary = "#00553d";
|
|
626
|
-
export const cpdColorTextInfoPrimary = "#
|
|
626
|
+
export const cpdColorTextInfoPrimary = "#043088";
|
|
627
627
|
export const cpdColorTextOnSolidPrimary = "#ffffff";
|
|
628
628
|
export const cpdColorTextDecorative1 = "#004200";
|
|
629
629
|
export const cpdColorTextDecorative2 = "#00376e";
|
|
@@ -692,7 +692,7 @@ export const cpdColorIconAccentTertiary = "#008268";
|
|
|
692
692
|
export const cpdColorIconAccentPrimary = "#00553d";
|
|
693
693
|
export const cpdColorIconCriticalPrimary = "#99001a";
|
|
694
694
|
export const cpdColorIconSuccessPrimary = "#00553d";
|
|
695
|
-
export const cpdColorIconInfoPrimary = "#
|
|
695
|
+
export const cpdColorIconInfoPrimary = "#043088";
|
|
696
696
|
export const cpdColorIconOnSolidPrimary = "#ffffff";
|
|
697
697
|
export const cpdColorGradientSubtleStop1 = "hsla(156, 99%, 36%, 0.56)";
|
|
698
698
|
export const cpdColorGradientSubtleStop2 = "hsla(153, 95%, 37%, 0.32)";
|
package/icons/threads-solid.svg
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24"><path
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24"><path d="M4 3h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6l-2.293 2.293c-.63.63-1.707.184-1.707-.707V5a2 2 0 0 1 2-2m3 7h10q.424 0 .712-.287A.97.97 0 0 0 18 9a.97.97 0 0 0-.288-.713A.97.97 0 0 0 17 8H7a.97.97 0 0 0-.713.287A.97.97 0 0 0 6 9q0 .424.287.713Q6.576 10 7 10m0 4h6q.424 0 .713-.287A.97.97 0 0 0 14 13a.97.97 0 0 0-.287-.713A.97.97 0 0 0 13 12H7a.97.97 0 0 0-.713.287A.97.97 0 0 0 6 13q0 .424.287.713Q6.576 14 7 14"/></svg>
|
package/icons/threads.svg
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24"><path d="
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24"><path d="M7 10a.97.97 0 0 1-.713-.287A.97.97 0 0 1 6 9q0-.424.287-.713A.97.97 0 0 1 7 8h10q.424 0 .712.287Q18 8.576 18 9t-.288.713A.97.97 0 0 1 17 10zm0 4a.97.97 0 0 1-.713-.287A.97.97 0 0 1 6 13q0-.424.287-.713A.97.97 0 0 1 7 12h6q.424 0 .713.287.287.288.287.713 0 .424-.287.713A.97.97 0 0 1 13 14z"/><path d="M3.707 21.293c-.63.63-1.707.184-1.707-.707V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6zM6 17h14V5H4v13.172l.586-.586A2 2 0 0 1 6 17"/></svg>
|