@mittwald/flow-design-tokens 0.1.0-alpha.289 → 0.1.0-alpha.290

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 (3) hide show
  1. package/dist/variables.css +85 -0
  2. package/dist/variables.json +1447 -0
  3. package/package.json +2 -2
package/dist/variables.css CHANGED
@@ -53,6 +53,81 @@
53
53
  --counter-badge--height: 1.25rem;
54
54
  --counter-badge--font-size: 0.625rem;
55
55
  --contextual-help--max-width: 500px;
56
+ --code-block--dark-syntax-color-variable: #8c3b3b;
57
+ --code-block--dark-syntax-color-type: #880000;
58
+ --code-block--dark-syntax-color-title: #880000;
59
+ --code-block--dark-syntax-color-template-variable: #8c3b3b;
60
+ --code-block--dark-syntax-color-template-tag: #880000;
61
+ --code-block--dark-syntax-color-symbol: #8c3b3b;
62
+ --code-block--dark-syntax-color-string: #880000;
63
+ --code-block--dark-syntax-color-selector-id: #880000;
64
+ --code-block--dark-syntax-color-selector-class: #880000;
65
+ --code-block--dark-syntax-color-selector-attr: #8c3b3b;
66
+ --code-block--dark-syntax-color-section: #880000;
67
+ --code-block--dark-syntax-color-regexp: #8c3b3b;
68
+ --code-block--dark-syntax-color-quote: #880000;
69
+ --code-block--dark-syntax-color-pseudo: #8c3b3b;
70
+ --code-block--dark-syntax-color-number: #880000;
71
+ --code-block--dark-syntax-color-meta-string: #2a5b74;
72
+ --code-block--dark-syntax-color-meta: #195b7b;
73
+ --code-block--dark-syntax-color-literal: #405d32;
74
+ --code-block--dark-syntax-color-link: #8c3b3b;
75
+ --code-block--dark-syntax-color-deletion: #880000;
76
+ --code-block--dark-syntax-color-comment: #575757;
77
+ --code-block--dark-syntax-color-code: #306100;
78
+ --code-block--dark-syntax-color-bullet: #306100;
79
+ --code-block--dark-syntax-color-built-in: #306100;
80
+ --code-block--dark-syntax-color-addition: #306100;
81
+ --code-block--light-syntax-color-variable: #dcacac;
82
+ --code-block--light-syntax-color-type: #ff9e9e;
83
+ --code-block--light-syntax-color-title: #ff9e9e;
84
+ --code-block--light-syntax-color-template-variable: #dcacac;
85
+ --code-block--light-syntax-color-template-tag: #ff9e9e;
86
+ --code-block--light-syntax-color-symbol: #dcacac;
87
+ --code-block--light-syntax-color-string: #ff9e9e;
88
+ --code-block--light-syntax-color-selector-id: #ff9e9e;
89
+ --code-block--light-syntax-color-selector-class: #ff9e9e;
90
+ --code-block--light-syntax-color-selector-attr: #dcacac;
91
+ --code-block--light-syntax-color-section: #ff9e9e;
92
+ --code-block--light-syntax-color-regexp: #dcacac;
93
+ --code-block--light-syntax-color-quote: #ff9e9e;
94
+ --code-block--light-syntax-color-pseudo: #dcacac;
95
+ --code-block--light-syntax-color-number: #ff9e9e;
96
+ --code-block--light-syntax-color-meta-string: #8ebfd7;
97
+ --code-block--light-syntax-color-meta: #77c0e4;
98
+ --code-block--light-syntax-color-literal: #9fc28e;
99
+ --code-block--light-syntax-color-link: #dcacac;
100
+ --code-block--light-syntax-color-deletion: #ff9e9e;
101
+ --code-block--light-syntax-color-comment: #b8b8b8;
102
+ --code-block--light-syntax-color-code: #68d100;
103
+ --code-block--light-syntax-color-bullet: #68d100;
104
+ --code-block--light-syntax-color-built-in: #68d100;
105
+ --code-block--light-syntax-color-addition: #68d100;
106
+ --code-block--default-syntax-color-variable: #a94747;
107
+ --code-block--default-syntax-color-type: #880000;
108
+ --code-block--default-syntax-color-title: #880000;
109
+ --code-block--default-syntax-color-template-variable: #a94747;
110
+ --code-block--default-syntax-color-template-tag: #880000;
111
+ --code-block--default-syntax-color-symbol: #a94747;
112
+ --code-block--default-syntax-color-string: #880000;
113
+ --code-block--default-syntax-color-selector-pseudo: #a94747;
114
+ --code-block--default-syntax-color-selector-id: #880000;
115
+ --code-block--default-syntax-color-selector-class: #880000;
116
+ --code-block--default-syntax-color-selector-attr: #a94747;
117
+ --code-block--default-syntax-color-section: #880000;
118
+ --code-block--default-syntax-color-regexp: #a94747;
119
+ --code-block--default-syntax-color-quote: #880000;
120
+ --code-block--default-syntax-color-number: #880000;
121
+ --code-block--default-syntax-color-meta-string: #326d8b;
122
+ --code-block--default-syntax-color-meta: #1e6e94;
123
+ --code-block--default-syntax-color-literal: #4c6d3b;
124
+ --code-block--default-syntax-color-link: #a94747;
125
+ --code-block--default-syntax-color-deletion: #880000;
126
+ --code-block--default-syntax-color-comment: #666666;
127
+ --code-block--default-syntax-color-code: #397300;
128
+ --code-block--default-syntax-color-bullet: #397300;
129
+ --code-block--default-syntax-color-built-in: #397300;
130
+ --code-block--default-syntax-color-addition: #397300;
56
131
  --avatar--size--m: 2.5rem;
57
132
  --color--transparent: transparent;
58
133
  --color--bright-lilac--1100: #470062;
@@ -318,6 +393,9 @@
318
393
  --column-layout--gap--m: var(--size-px--m);
319
394
  --column-layout--gap--s: var(--size-px--s);
320
395
  --column-layout--content-to-content-spacing: var(--size-rem--m);
396
+ --code-block--code-to-button-spacing: var(--size-px--m);
397
+ --code-block--padding: var(--size-px--m);
398
+ --code-block--font-size: var(--font-size--s);
321
399
  --checkbox--icon-to-text-spacing: var(--size-rem--s);
322
400
  --checkbox-group--checkbox-to-checkbox-spacing: var(--size-rem--s);
323
401
  --checkbox-button--label-font-weight-with-content: var(--font-weight--bold);
@@ -670,6 +748,11 @@
670
748
  --calendar--heading-font-size: var(--font-size--default);
671
749
  --counter-badge--border-color: var(--neutral--color--100);
672
750
  --counter-badge--border-width: var(--border-width--200);
751
+ --code-block--dark-content-color: var(--dark-soft-content-color);
752
+ --code-block--dark-background-color: var(--dark-soft-background-color--default);
753
+ --code-block--light-content-color: var(--light-soft-content-color);
754
+ --code-block--light-background-color: var(--light-soft-background-color--default);
755
+ --code-block--corner-radius: var(--corner-radius--default);
673
756
  --checkbox--icon-color--selected: var(--primary--color--800);
674
757
  --button--light-outline-border-color--disabled: var(--disabled-light-outline-border-color);
675
758
  --button--light-outline-border-color--default: var(--light-outline-border-color);
@@ -958,6 +1041,8 @@
958
1041
  --date-picker--date-segment-background-color--focused: var(--primary-plain-background-color--pressed);
959
1042
  --counter-badge--color: var(--success-solid-content-color);
960
1043
  --counter-badge--background-color: var(--success-solid-background-color--default);
1044
+ --code-block--default-content-color: var(--neutral-soft-content-color--default);
1045
+ --code-block--default-background-color: var(--neutral-soft-background-color--default);
961
1046
  --checkbox--icon-color--disabled: var(--disabled-outline-content-color);
962
1047
  --checkbox--icon-color--default: var(--icon--color--default);
963
1048
  --checkbox--color--disabled: var(--disabled-outline-content-color);