@etus/tokens 0.4.0-beta.11 → 0.4.0-beta.12

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/tokens.css CHANGED
@@ -944,30 +944,26 @@
944
944
  --extended-chart-3: oklch(62.31% 0.1880 259.81);
945
945
  --extended-chart-4: oklch(79.52% 0.1617 86.05);
946
946
  --extended-chart-5: oklch(63.68% 0.2078 25.33);
947
- --feature-item-body-gap: 4px;
947
+ --feature-item-badge-bg: oklch(97.05% 0.0142 254.60);
948
+ --feature-item-badge-border: oklch(88.23% 0.0571 254.13);
949
+ --feature-item-badge-fg: oklch(48.82% 0.2172 264.38);
950
+ --feature-item-badge-font-size: 12px;
951
+ --feature-item-badge-font-weight: 500;
952
+ --feature-item-badge-line-height: 16px;
953
+ --feature-item-badge-padding-x: 8px;
954
+ --feature-item-badge-padding-y: 4px;
955
+ --feature-item-badge-radius: 2px;
956
+ --feature-item-body-gap: 8px;
948
957
  --feature-item-description-color: oklch(55.55% 0.0000 0);
949
- --feature-item-description-font-size: 13px;
950
- --feature-item-description-line-height: 1.55;
951
- --feature-item-icon-radius: 10px;
952
- --feature-item-icon-size: 40px;
953
- --feature-item-link-color: oklch(56.08% 0.1221 160.56);
954
- --feature-item-link-font-size: 12px;
955
- --feature-item-link-font-weight: 600;
956
- --feature-item-link-gap: 4px;
957
- --feature-item-link-margin-top: 4px;
958
- --feature-item-root-gap: 14px;
959
- --feature-item-root-padding: 4px;
958
+ --feature-item-description-font-size: 16px;
959
+ --feature-item-description-font-weight: 400;
960
+ --feature-item-description-line-height: 24px;
961
+ --feature-item-icon-size: 20px;
962
+ --feature-item-root-gap: 16px;
960
963
  --feature-item-title-color: oklch(14.48% 0.0000 0);
961
- --feature-item-title-font-size: 14px;
964
+ --feature-item-title-font-size: 18px;
962
965
  --feature-item-title-font-weight: 600;
963
- --feature-item-tone-brand-bg: oklch(81.75% 0.1821 159.79);
964
- --feature-item-tone-brand-fg: oklch(18.34% 0.0338 166.67);
965
- --feature-item-tone-info-bg: oklch(97.05% 0.0142 254.60);
966
- --feature-item-tone-info-fg: oklch(48.82% 0.2172 264.38);
967
- --feature-item-tone-subtle-bg: oklch(97.65% 0.0243 170.99);
968
- --feature-item-tone-subtle-fg: oklch(56.08% 0.1221 160.56);
969
- --feature-item-tone-warning-bg: oklch(98.73% 0.0262 102.21);
970
- --feature-item-tone-warning-fg: oklch(55.38% 0.1207 66.44);
966
+ --feature-item-title-line-height: 24px;
971
967
  --featured-icon-color-brand-bg: oklch(97.65% 0.0243 170.99);
972
968
  --featured-icon-color-brand-fg: oklch(81.75% 0.1821 159.79);
973
969
  --featured-icon-color-default-bg: oklch(97.02% 0.0000 0);
@@ -1507,6 +1503,7 @@
1507
1503
  --link-text-lg: 18px;
1508
1504
  --link-text-sm: 14px;
1509
1505
  --link-text-xs: 12px;
1506
+ --logo-conta-size: 24px;
1510
1507
  --markdown-editor-area-background: transparent;
1511
1508
  --markdown-editor-area-foreground: oklch(14.48% 0.0000 0);
1512
1509
  --markdown-editor-area-padding: 16px;
@@ -3233,17 +3230,11 @@
3233
3230
  --extended-chart-3: oklch(62.31% 0.1880 259.81);
3234
3231
  --extended-chart-4: oklch(79.52% 0.1617 86.05);
3235
3232
  --extended-chart-5: oklch(63.68% 0.2078 25.33);
3233
+ --feature-item-badge-bg: oklch(28.23% 0.0874 267.94);
3234
+ --feature-item-badge-border: oklch(54.61% 0.2152 262.88);
3235
+ --feature-item-badge-fg: oklch(80.91% 0.0956 251.81);
3236
3236
  --feature-item-description-color: oklch(71.55% 0.0000 0);
3237
- --feature-item-link-color: oklch(87.18% 0.1296 166.48);
3238
3237
  --feature-item-title-color: oklch(98.51% 0.0000 0);
3239
- --feature-item-tone-brand-bg: oklch(84.11% 0.1609 163.31);
3240
- --feature-item-tone-brand-fg: oklch(18.34% 0.0338 166.67);
3241
- --feature-item-tone-info-bg: oklch(28.23% 0.0874 267.94);
3242
- --feature-item-tone-info-fg: oklch(80.91% 0.0956 251.81);
3243
- --feature-item-tone-subtle-bg: oklch(18.34% 0.0338 166.67);
3244
- --feature-item-tone-subtle-fg: oklch(87.18% 0.1296 166.48);
3245
- --feature-item-tone-warning-bg: oklch(28.57% 0.0639 53.81);
3246
- --feature-item-tone-warning-fg: oklch(90.52% 0.1657 98.11);
3247
3238
  --featured-icon-color-brand-bg: oklch(18.34% 0.0338 166.67);
3248
3239
  --featured-icon-color-brand-fg: oklch(84.11% 0.1609 163.31);
3249
3240
  --featured-icon-color-default-bg: oklch(37.15% 0.0000 0);
@@ -4009,17 +4000,11 @@
4009
4000
  --extended-chart-3: oklch(62.31% 0.1880 259.81);
4010
4001
  --extended-chart-4: oklch(79.52% 0.1617 86.05);
4011
4002
  --extended-chart-5: oklch(63.68% 0.2078 25.33);
4003
+ --feature-item-badge-bg: oklch(97.05% 0.0142 254.60);
4004
+ --feature-item-badge-border: oklch(88.23% 0.0571 254.13);
4005
+ --feature-item-badge-fg: oklch(48.82% 0.2172 264.38);
4012
4006
  --feature-item-description-color: oklch(55.55% 0.0000 0);
4013
- --feature-item-link-color: oklch(56.08% 0.1221 160.56);
4014
4007
  --feature-item-title-color: oklch(14.48% 0.0000 0);
4015
- --feature-item-tone-brand-bg: oklch(81.75% 0.1821 159.79);
4016
- --feature-item-tone-brand-fg: oklch(18.34% 0.0338 166.67);
4017
- --feature-item-tone-info-bg: oklch(97.05% 0.0142 254.60);
4018
- --feature-item-tone-info-fg: oklch(48.82% 0.2172 264.38);
4019
- --feature-item-tone-subtle-bg: oklch(97.65% 0.0243 170.99);
4020
- --feature-item-tone-subtle-fg: oklch(56.08% 0.1221 160.56);
4021
- --feature-item-tone-warning-bg: oklch(98.73% 0.0262 102.21);
4022
- --feature-item-tone-warning-fg: oklch(55.38% 0.1207 66.44);
4023
4008
  --featured-icon-color-brand-bg: oklch(97.65% 0.0243 170.99);
4024
4009
  --featured-icon-color-brand-fg: oklch(81.75% 0.1821 159.79);
4025
4010
  --featured-icon-color-default-bg: oklch(97.02% 0.0000 0);
@@ -4897,17 +4882,11 @@
4897
4882
  --color-extended-chart-3: var(--extended-chart-3);
4898
4883
  --color-extended-chart-4: var(--extended-chart-4);
4899
4884
  --color-extended-chart-5: var(--extended-chart-5);
4885
+ --color-feature-item-badge-bg: var(--feature-item-badge-bg);
4886
+ --color-feature-item-badge-border: var(--feature-item-badge-border);
4887
+ --color-feature-item-badge-fg: var(--feature-item-badge-fg);
4900
4888
  --color-feature-item-description-color: var(--feature-item-description-color);
4901
- --color-feature-item-link-color: var(--feature-item-link-color);
4902
4889
  --color-feature-item-title-color: var(--feature-item-title-color);
4903
- --color-feature-item-tone-brand-bg: var(--feature-item-tone-brand-bg);
4904
- --color-feature-item-tone-brand-fg: var(--feature-item-tone-brand-fg);
4905
- --color-feature-item-tone-info-bg: var(--feature-item-tone-info-bg);
4906
- --color-feature-item-tone-info-fg: var(--feature-item-tone-info-fg);
4907
- --color-feature-item-tone-subtle-bg: var(--feature-item-tone-subtle-bg);
4908
- --color-feature-item-tone-subtle-fg: var(--feature-item-tone-subtle-fg);
4909
- --color-feature-item-tone-warning-bg: var(--feature-item-tone-warning-bg);
4910
- --color-feature-item-tone-warning-fg: var(--feature-item-tone-warning-fg);
4911
4890
  --color-featured-icon-color-brand-bg: var(--featured-icon-color-brand-bg);
4912
4891
  --color-featured-icon-color-brand-fg: var(--featured-icon-color-brand-fg);
4913
4892
  --color-featured-icon-color-default-bg: var(--featured-icon-color-default-bg);
package/dist/tokens.js CHANGED
@@ -1088,30 +1088,26 @@ export const tokens = {
1088
1088
  "extended-chart-3": "oklch(62.31% 0.1880 259.81)",
1089
1089
  "extended-chart-4": "oklch(79.52% 0.1617 86.05)",
1090
1090
  "extended-chart-5": "oklch(63.68% 0.2078 25.33)",
1091
- "feature-item-body-gap": "4px",
1091
+ "feature-item-badge-bg": "oklch(97.05% 0.0142 254.60)",
1092
+ "feature-item-badge-border": "oklch(88.23% 0.0571 254.13)",
1093
+ "feature-item-badge-fg": "oklch(48.82% 0.2172 264.38)",
1094
+ "feature-item-badge-font-size": "12px",
1095
+ "feature-item-badge-font-weight": "500",
1096
+ "feature-item-badge-line-height": "16px",
1097
+ "feature-item-badge-padding-x": "8px",
1098
+ "feature-item-badge-padding-y": "4px",
1099
+ "feature-item-badge-radius": "2px",
1100
+ "feature-item-body-gap": "8px",
1092
1101
  "feature-item-description-color": "oklch(55.55% 0.0000 0)",
1093
- "feature-item-description-font-size": "13px",
1094
- "feature-item-description-line-height": "1.55",
1095
- "feature-item-icon-radius": "10px",
1096
- "feature-item-icon-size": "40px",
1097
- "feature-item-link-color": "oklch(56.08% 0.1221 160.56)",
1098
- "feature-item-link-font-size": "12px",
1099
- "feature-item-link-font-weight": "600",
1100
- "feature-item-link-gap": "4px",
1101
- "feature-item-link-margin-top": "4px",
1102
- "feature-item-root-gap": "14px",
1103
- "feature-item-root-padding": "4px",
1102
+ "feature-item-description-font-size": "16px",
1103
+ "feature-item-description-font-weight": "400",
1104
+ "feature-item-description-line-height": "24px",
1105
+ "feature-item-icon-size": "20px",
1106
+ "feature-item-root-gap": "16px",
1104
1107
  "feature-item-title-color": "oklch(14.48% 0.0000 0)",
1105
- "feature-item-title-font-size": "14px",
1108
+ "feature-item-title-font-size": "18px",
1106
1109
  "feature-item-title-font-weight": "600",
1107
- "feature-item-tone-brand-bg": "oklch(81.75% 0.1821 159.79)",
1108
- "feature-item-tone-brand-fg": "oklch(18.34% 0.0338 166.67)",
1109
- "feature-item-tone-info-bg": "oklch(97.05% 0.0142 254.60)",
1110
- "feature-item-tone-info-fg": "oklch(48.82% 0.2172 264.38)",
1111
- "feature-item-tone-subtle-bg": "oklch(97.65% 0.0243 170.99)",
1112
- "feature-item-tone-subtle-fg": "oklch(56.08% 0.1221 160.56)",
1113
- "feature-item-tone-warning-bg": "oklch(98.73% 0.0262 102.21)",
1114
- "feature-item-tone-warning-fg": "oklch(55.38% 0.1207 66.44)",
1110
+ "feature-item-title-line-height": "24px",
1115
1111
  "featured-icon-color-brand-bg": "oklch(97.65% 0.0243 170.99)",
1116
1112
  "featured-icon-color-brand-fg": "oklch(81.75% 0.1821 159.79)",
1117
1113
  "featured-icon-color-default-bg": "oklch(97.02% 0.0000 0)",
@@ -1629,6 +1625,7 @@ export const tokens = {
1629
1625
  "link-text-lg": "18px",
1630
1626
  "link-text-sm": "14px",
1631
1627
  "link-text-xs": "12px",
1628
+ "logo-conta-size": "24px",
1632
1629
  "markdown-editor-area-background": "transparent",
1633
1630
  "markdown-editor-area-foreground": "oklch(14.48% 0.0000 0)",
1634
1631
  "markdown-editor-area-padding": "16px",
@@ -2128,10 +2128,16 @@
2128
2128
  "value": "500"
2129
2129
  },
2130
2130
  {
2131
- "name": "feature-item-link-font-weight",
2132
- "cssVar": "--feature-item-link-font-weight",
2131
+ "name": "feature-item-badge-font-weight",
2132
+ "cssVar": "--feature-item-badge-font-weight",
2133
2133
  "type": "fontWeight",
2134
- "value": "600"
2134
+ "value": "500"
2135
+ },
2136
+ {
2137
+ "name": "feature-item-description-font-weight",
2138
+ "cssVar": "--feature-item-description-font-weight",
2139
+ "type": "fontWeight",
2140
+ "value": "400"
2135
2141
  },
2136
2142
  {
2137
2143
  "name": "feature-item-title-font-weight",
@@ -8787,78 +8793,89 @@
8787
8793
  "value": "500px"
8788
8794
  },
8789
8795
  {
8790
- "name": "feature-item-body-gap",
8791
- "cssVar": "--feature-item-body-gap",
8792
- "type": "dimension",
8793
- "value": "4px"
8796
+ "name": "feature-item-badge-bg",
8797
+ "cssVar": "--feature-item-badge-bg",
8798
+ "type": "color",
8799
+ "value": "oklch(97.05% 0.0142 254.60)"
8794
8800
  },
8795
8801
  {
8796
- "name": "feature-item-description-color",
8797
- "cssVar": "--feature-item-description-color",
8802
+ "name": "feature-item-badge-border",
8803
+ "cssVar": "--feature-item-badge-border",
8798
8804
  "type": "color",
8799
- "value": "oklch(55.55% 0.0000 0)"
8805
+ "value": "oklch(88.23% 0.0571 254.13)"
8800
8806
  },
8801
8807
  {
8802
- "name": "feature-item-description-font-size",
8803
- "cssVar": "--feature-item-description-font-size",
8808
+ "name": "feature-item-badge-fg",
8809
+ "cssVar": "--feature-item-badge-fg",
8810
+ "type": "color",
8811
+ "value": "oklch(48.82% 0.2172 264.38)"
8812
+ },
8813
+ {
8814
+ "name": "feature-item-badge-font-size",
8815
+ "cssVar": "--feature-item-badge-font-size",
8804
8816
  "type": "fontSize",
8805
- "value": "13px"
8817
+ "value": "12px"
8806
8818
  },
8807
8819
  {
8808
- "name": "feature-item-description-line-height",
8809
- "cssVar": "--feature-item-description-line-height",
8820
+ "name": "feature-item-badge-line-height",
8821
+ "cssVar": "--feature-item-badge-line-height",
8810
8822
  "type": "lineHeight",
8811
- "value": "1.55"
8823
+ "value": "16px"
8812
8824
  },
8813
8825
  {
8814
- "name": "feature-item-icon-radius",
8815
- "cssVar": "--feature-item-icon-radius",
8826
+ "name": "feature-item-badge-padding-x",
8827
+ "cssVar": "--feature-item-badge-padding-x",
8816
8828
  "type": "dimension",
8817
- "description": "FeatureItem icon plate radius 10px per Figma /Feature-item canonical.",
8818
- "value": "10px"
8829
+ "value": "8px"
8819
8830
  },
8820
8831
  {
8821
- "name": "feature-item-icon-size",
8822
- "cssVar": "--feature-item-icon-size",
8832
+ "name": "feature-item-badge-padding-y",
8833
+ "cssVar": "--feature-item-badge-padding-y",
8823
8834
  "type": "dimension",
8824
- "description": "FeatureItem icon plate size 40px per Figma /Feature-item canonical.",
8825
- "value": "40px"
8835
+ "value": "4px"
8836
+ },
8837
+ {
8838
+ "name": "feature-item-badge-radius",
8839
+ "cssVar": "--feature-item-badge-radius",
8840
+ "type": "dimension",
8841
+ "value": "2px"
8842
+ },
8843
+ {
8844
+ "name": "feature-item-body-gap",
8845
+ "cssVar": "--feature-item-body-gap",
8846
+ "type": "dimension",
8847
+ "value": "8px"
8826
8848
  },
8827
8849
  {
8828
- "name": "feature-item-link-color",
8829
- "cssVar": "--feature-item-link-color",
8850
+ "name": "feature-item-description-color",
8851
+ "cssVar": "--feature-item-description-color",
8830
8852
  "type": "color",
8831
- "value": "oklch(56.08% 0.1221 160.56)"
8853
+ "value": "oklch(55.55% 0.0000 0)"
8832
8854
  },
8833
8855
  {
8834
- "name": "feature-item-link-font-size",
8835
- "cssVar": "--feature-item-link-font-size",
8856
+ "name": "feature-item-description-font-size",
8857
+ "cssVar": "--feature-item-description-font-size",
8836
8858
  "type": "fontSize",
8837
- "value": "12px"
8859
+ "value": "16px"
8838
8860
  },
8839
8861
  {
8840
- "name": "feature-item-link-gap",
8841
- "cssVar": "--feature-item-link-gap",
8842
- "type": "dimension",
8843
- "value": "4px"
8862
+ "name": "feature-item-description-line-height",
8863
+ "cssVar": "--feature-item-description-line-height",
8864
+ "type": "lineHeight",
8865
+ "value": "24px"
8844
8866
  },
8845
8867
  {
8846
- "name": "feature-item-link-margin-top",
8847
- "cssVar": "--feature-item-link-margin-top",
8868
+ "name": "feature-item-icon-size",
8869
+ "cssVar": "--feature-item-icon-size",
8848
8870
  "type": "dimension",
8849
- "value": "4px"
8871
+ "description": "Glifo inline da variante icon. A placa do feature-icon vem do FeaturedIcon.",
8872
+ "value": "20px"
8850
8873
  },
8851
8874
  {
8852
8875
  "name": "feature-item-root-gap",
8853
8876
  "cssVar": "--feature-item-root-gap",
8854
8877
  "type": "dimension",
8855
- "value": "14px"
8856
- },
8857
- {
8858
- "name": "feature-item-root-padding",
8859
- "cssVar": "--feature-item-root-padding",
8860
- "type": "dimension",
8861
- "value": "4px"
8878
+ "value": "16px"
8862
8879
  },
8863
8880
  {
8864
8881
  "name": "feature-item-title-color",
@@ -8870,55 +8887,13 @@
8870
8887
  "name": "feature-item-title-font-size",
8871
8888
  "cssVar": "--feature-item-title-font-size",
8872
8889
  "type": "fontSize",
8873
- "value": "14px"
8874
- },
8875
- {
8876
- "name": "feature-item-tone-brand-bg",
8877
- "cssVar": "--feature-item-tone-brand-bg",
8878
- "type": "color",
8879
- "value": "oklch(81.75% 0.1821 159.79)"
8880
- },
8881
- {
8882
- "name": "feature-item-tone-brand-fg",
8883
- "cssVar": "--feature-item-tone-brand-fg",
8884
- "type": "color",
8885
- "value": "oklch(18.34% 0.0338 166.67)"
8886
- },
8887
- {
8888
- "name": "feature-item-tone-info-bg",
8889
- "cssVar": "--feature-item-tone-info-bg",
8890
- "type": "color",
8891
- "value": "oklch(97.05% 0.0142 254.60)"
8892
- },
8893
- {
8894
- "name": "feature-item-tone-info-fg",
8895
- "cssVar": "--feature-item-tone-info-fg",
8896
- "type": "color",
8897
- "value": "oklch(48.82% 0.2172 264.38)"
8898
- },
8899
- {
8900
- "name": "feature-item-tone-subtle-bg",
8901
- "cssVar": "--feature-item-tone-subtle-bg",
8902
- "type": "color",
8903
- "value": "oklch(97.65% 0.0243 170.99)"
8904
- },
8905
- {
8906
- "name": "feature-item-tone-subtle-fg",
8907
- "cssVar": "--feature-item-tone-subtle-fg",
8908
- "type": "color",
8909
- "value": "oklch(56.08% 0.1221 160.56)"
8910
- },
8911
- {
8912
- "name": "feature-item-tone-warning-bg",
8913
- "cssVar": "--feature-item-tone-warning-bg",
8914
- "type": "color",
8915
- "value": "oklch(98.73% 0.0262 102.21)"
8890
+ "value": "18px"
8916
8891
  },
8917
8892
  {
8918
- "name": "feature-item-tone-warning-fg",
8919
- "cssVar": "--feature-item-tone-warning-fg",
8920
- "type": "color",
8921
- "value": "oklch(55.38% 0.1207 66.44)"
8893
+ "name": "feature-item-title-line-height",
8894
+ "cssVar": "--feature-item-title-line-height",
8895
+ "type": "lineHeight",
8896
+ "value": "24px"
8922
8897
  },
8923
8898
  {
8924
8899
  "name": "featured-icon-color-brand-bg",
@@ -11334,6 +11309,13 @@
11334
11309
  "type": "fontSize",
11335
11310
  "value": "12px"
11336
11311
  },
11312
+ {
11313
+ "name": "logo-conta-size",
11314
+ "cssVar": "--logo-conta-size",
11315
+ "type": "dimension",
11316
+ "description": "LogoConta circular badge diameter (24px per Figma /Logo-Conta canonical, node 1138:2959).",
11317
+ "value": "24px"
11318
+ },
11337
11319
  {
11338
11320
  "name": "markdown-editor-area-background",
11339
11321
  "cssVar": "--markdown-editor-area-background",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@etus/tokens",
3
- "version": "0.4.0-beta.11",
3
+ "version": "0.4.0-beta.12",
4
4
  "description": "Seven Design System - Design tokens (CSS variables) for ETUS applications",
5
5
  "license": "MIT",
6
6
  "repository": {