@taiga-ui/design-tokens 0.74.0 → 0.76.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.
Files changed (5) hide show
  1. package/package.json +1 -1
  2. package/palette/dark.css +11 -1
  3. package/palette/light.css +10 -0
  4. package/palette/mobile/dark.css +9 -1
  5. package/palette/mobile/light.css +9 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@taiga-ui/design-tokens",
3
- "version": "0.74.0",
3
+ "version": "0.76.0",
4
4
  "description": "Taiga UI palette",
5
5
  "keywords": ["angular", "palette"],
6
6
  "publishConfig": {
package/palette/dark.css CHANGED
@@ -88,7 +88,7 @@
88
88
  --tui-background-button-glass-on-dark: var(--tui-const-white-alpha-30); /* @Deprecated: Заменен на overlay-glass-on-dark */
89
89
  --tui-background-button-glass-on-light: var(--tui-const-black-alpha-40); /* @Deprecated: Заменен на overlay-glass-on-light */
90
90
  --tui-background-progress-bar: var(--tui-const-white-alpha-15); /* Пустая полоска прогресс-баров. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
91
- --tui-background-tooltip: var(--tui-const-cool-gray-lighter-51); /* Фон для тултипов */
91
+ --tui-background-tooltip: var(--tui-const-white); /* Фон для тултипов */
92
92
  --tui-background-thumbnail-card-badge: var(--tui-const-black-alpha-12); /* Прозрачный контейнер бейджа на миниатюре карты. Временный компонентный токен, существует пока не зарелизятся токены 2.0. */
93
93
  --tui-background-overlay-glass-on-dark: var(--tui-const-white-alpha-30); /* Оверлей стеклянных поверхностей на темных фонах, не меняется при смене темы. */
94
94
  --tui-background-overlay-glass-on-dark-hover: var(--tui-const-white-alpha-40); /* Оверлей стеклянных поверхностей при наведении на темных фонах, не меняется при смене темы. */
@@ -98,6 +98,8 @@
98
98
  --tui-background-overlay-glass-on-light-hover: var(--tui-const-black-alpha-48); /* Оверлей стеклянных поверхностей при наведении на cветлых фонах, не меняется при смене темы. */
99
99
  --tui-border-normal: var(--tui-const-white-alpha-15); /* Бордеры и сепараторы на основных фонах */
100
100
  --tui-border-hover: var(--tui-const-white-alpha-20); /* Только для веба. Бордеры при наведении */
101
+ --tui-border-normal-opaque: var(--tui-const-black-lighter-25); /* Бордеры и сепараторы на основных фонах без прозрачности */
102
+ --tui-border-normal-opaque-hover: var(--tui-const-black-lighter-30); /* Бордеры и сепараторы на основных фонах без прозрачности */
101
103
  --tui-border-focus: var(--tui-const-white); /* Только для веба. Бордеры при фокусировании с клавиатуры */
102
104
  --tui-border-focus-on-dark: var(--tui-const-white-alpha-30); /* Только для веба. Бордеры при фокусировании с клавиатуры темных элементов */
103
105
  --tui-border-selected: var(--tui-const-yellow); /* Обводка выделенных элементов */
@@ -113,6 +115,7 @@
113
115
  --tui-brand-tinkoff-mobile-alt-1: #BAB3EC; /* Фирменный цвет Tinkoff Mobile */
114
116
  --tui-brand-tinkoff-all-airlines: #27BEFF; /* Фирменный цвет Tinkoff Mobile */
115
117
  --tui-brand-tinkoff-all-airlines-alt-1: #CBEFFF; /* Бледный оттенок фирменного цвета Tinkoff All Airlines */
118
+ --tui-brand-tinkoff-ai-assistant: #9A6BFF; /* Фирменный цвет Tinkoff Ai Assistant */
116
119
  --tui-brand-tinkoff-insurance: #27AFA5; /* Фирменный цвет Страхования */
117
120
  --tui-brand-tinkoff-business: #B58B60; /* Фирменный цвет Бизнеса */
118
121
  --tui-brand-tinkoff-business-alt-1: #E4D7C1; /* Фирменный цвет Бизнеса */
@@ -148,6 +151,7 @@
148
151
  --tui-chart-categorical-25: var(--tui-const-green-lighter-64);
149
152
  --tui-chart-categorical-26: var(--tui-const-sea-blue-lighter-66);
150
153
  --tui-chart-categorical-27: var(--tui-const-green-lighter-57);
154
+ --tui-component-tab-bar-background-ios: #1A1A1DB3; /* Цвет фона для имитации системного таббара iOS */
151
155
  --tui-const-yellow: #FFDD2D; /* N9 */
152
156
  --tui-const-yellow-darker-60: #FFCD33; /* N9 pressed, hsL=60 */
153
157
  --tui-const-yellow-darker-54: #FAB619; /* hsL=54 */
@@ -248,6 +252,7 @@
248
252
  --tui-const-black-alpha-70: #000000B3; /* 70% opacity */
249
253
  --tui-const-black-alpha-60: #00000099; /* 60% opacity */
250
254
  --tui-const-black-alpha-54: #0000008A; /* 54% opacity */
255
+ --tui-const-black-alpha-50: #00000080; /* 50% opacity */
251
256
  --tui-const-black-alpha-48: #0000007A; /* 48% opacity */
252
257
  --tui-const-black-alpha-40: #00000066; /* 40% opacity */
253
258
  --tui-const-black-alpha-30: #0000004D; /* 30% opacity */
@@ -280,10 +285,15 @@
280
285
  --tui-const-black-lighter-16: #292929;
281
286
  --tui-const-black-lighter-20: #333333; /* N1 */
282
287
  --tui-const-black-lighter-22: #383838;
288
+ --tui-const-black-lighter-25: #414141;
289
+ --tui-const-black-lighter-30: #4D4D4D;
290
+ --tui-const-black-lighter-79: #C9C9C9;
283
291
  --tui-const-cool-gray-lighter-36: #575B61;
284
292
  --tui-const-cool-gray-lighter-60: #9299A2; /* N3 */
285
293
  --tui-const-cool-gray-lighter-79: #C7C9CC; /* N4 */
294
+ --tui-const-cool-gray-lighter-85: #C7CBCF;
286
295
  --tui-const-cool-gray-lighter-87: #DDDFE0; /* N5 */
296
+ --tui-const-cool-gray-lighter-90: #E1E3E4;
287
297
  --tui-const-cool-gray-lighter-93: #EAECEE; /* N6 */
288
298
  --tui-const-cool-gray-lighter-96: #F2F4F7; /* N7 */
289
299
  --tui-const-cool-gray-lighter-97: #F6F7F8; /* N7 */
package/palette/light.css CHANGED
@@ -98,6 +98,8 @@
98
98
  --tui-background-overlay-glass-on-light-hover: var(--tui-const-black-alpha-48); /* Оверлей стеклянных поверхностей при наведении на cветлых фонах, не меняется при смене темы. */
99
99
  --tui-border-normal: var(--tui-const-cool-gray-alpha-12); /* Бордеры и сепараторы на основных фонах */
100
100
  --tui-border-hover: var(--tui-const-cool-gray-alpha-22); /* Только для веба. Бордеры при наведении */
101
+ --tui-border-normal-opaque: var(--tui-const-cool-gray-lighter-90); /* Бордеры и сепараторы на основных фонах без прозрачности */
102
+ --tui-border-normal-opaque-hover: var(--tui-const-cool-gray-lighter-85); /* Бордеры и сепараторы на основных фонах без прозрачности */
101
103
  --tui-border-focus: var(--tui-const-cool-gray-alpha-44); /* Только для веба. Бордеры при фокусировании с клавиатуры */
102
104
  --tui-border-focus-on-dark: var(--tui-const-white-alpha-30); /* Только для веба. Бордеры при фокусировании с клавиатуры темных элементов */
103
105
  --tui-border-selected: var(--tui-const-yellow); /* Обводка выделенных элементов */
@@ -113,6 +115,7 @@
113
115
  --tui-brand-tinkoff-mobile-alt-1: #BAB3EC; /* Фирменный цвет Tinkoff Mobile */
114
116
  --tui-brand-tinkoff-all-airlines: #27BEFF; /* Фирменный цвет Tinkoff Mobile */
115
117
  --tui-brand-tinkoff-all-airlines-alt-1: #CBEFFF; /* Бледный оттенок фирменного цвета Tinkoff All Airlines */
118
+ --tui-brand-tinkoff-ai-assistant: #9A6BFF; /* Фирменный цвет Tinkoff Ai Assistant */
116
119
  --tui-brand-tinkoff-insurance: #27AFA5; /* Фирменный цвет Страхования */
117
120
  --tui-brand-tinkoff-business: #B58B60; /* Фирменный цвет Бизнеса */
118
121
  --tui-brand-tinkoff-business-alt-1: #E4D7C1; /* Фирменный цвет Бизнеса */
@@ -148,6 +151,7 @@
148
151
  --tui-chart-categorical-25: var(--tui-const-green-lighter-64);
149
152
  --tui-chart-categorical-26: var(--tui-const-sea-blue-lighter-66);
150
153
  --tui-chart-categorical-27: var(--tui-const-green-lighter-57);
154
+ --tui-component-tab-bar-background-ios: #F6F7F8CC; /* Цвет фона для имитации системного таббара iOS */
151
155
  --tui-const-yellow: #FFDD2D; /* N9 */
152
156
  --tui-const-yellow-darker-60: #FFCD33; /* N9 pressed, hsL=60 */
153
157
  --tui-const-yellow-darker-54: #FAB619; /* hsL=54 */
@@ -248,6 +252,7 @@
248
252
  --tui-const-black-alpha-70: #000000B3; /* 70% opacity */
249
253
  --tui-const-black-alpha-60: #00000099; /* 60% opacity */
250
254
  --tui-const-black-alpha-54: #0000008A; /* 54% opacity */
255
+ --tui-const-black-alpha-50: #00000080; /* 50% opacity */
251
256
  --tui-const-black-alpha-48: #0000007A; /* 48% opacity */
252
257
  --tui-const-black-alpha-40: #00000066; /* 40% opacity */
253
258
  --tui-const-black-alpha-30: #0000004D; /* 30% opacity */
@@ -280,10 +285,15 @@
280
285
  --tui-const-black-lighter-16: #292929;
281
286
  --tui-const-black-lighter-20: #333333; /* N1 */
282
287
  --tui-const-black-lighter-22: #383838;
288
+ --tui-const-black-lighter-25: #414141;
289
+ --tui-const-black-lighter-30: #4D4D4D;
290
+ --tui-const-black-lighter-79: #C9C9C9;
283
291
  --tui-const-cool-gray-lighter-36: #575B61;
284
292
  --tui-const-cool-gray-lighter-60: #9299A2; /* N3 */
285
293
  --tui-const-cool-gray-lighter-79: #C7C9CC; /* N4 */
294
+ --tui-const-cool-gray-lighter-85: #C7CBCF;
286
295
  --tui-const-cool-gray-lighter-87: #DDDFE0; /* N5 */
296
+ --tui-const-cool-gray-lighter-90: #E1E3E4;
287
297
  --tui-const-cool-gray-lighter-93: #EAECEE; /* N6 */
288
298
  --tui-const-cool-gray-lighter-96: #F2F4F7; /* N7 */
289
299
  --tui-const-cool-gray-lighter-97: #F6F7F8; /* N7 */
package/palette/mobile/dark.css CHANGED
@@ -83,6 +83,7 @@
83
83
  --tui-background-overlay-glass-on-dark: var(--tui-const-white-alpha-30); /* Оверлей стеклянных поверхностей на темных фонах, не меняется при смене темы. */
84
84
  --tui-background-overlay-glass-on-light: var(--tui-const-black-alpha-40); /* Оверлей стеклянных поверхностей на cветлых фонах, не меняется при смене темы */
85
85
  --tui-border-normal: var(--tui-const-white-alpha-20); /* Бордеры и сепараторы на основных фонах */
86
+ --tui-border-normal-opaque: var(--tui-const-black-lighter-20); /* Бордеры и сепараторы на основных фонах без прозрачности */
86
87
  --tui-border-selected: var(--tui-const-blue); /* Обводка выделенных элементов */
87
88
  --tui-border-darkmode-only: var(--tui-const-white-alpha-10); /* Обводка, отделяющая цветные элементы от фона в темной теме */
88
89
  --tui-border-on-light: var(--tui-const-black-alpha-3); /* Обводка, отделяющая цветные элементы от светлого фонов */
@@ -96,6 +97,7 @@
96
97
  --tui-brand-tinkoff-mobile-alt-1: #BAB3EC; /* Фирменный цвет Tinkoff Mobile */
97
98
  --tui-brand-tinkoff-all-airlines: #27BEFF; /* Фирменный цвет Tinkoff Mobile */
98
99
  --tui-brand-tinkoff-all-airlines-alt-1: #CBEFFF; /* Бледный оттенок фирменного цвета Tinkoff All Airlines */
100
+ --tui-brand-tinkoff-ai-assistant: #9A6BFF; /* Фирменный цвет Tinkoff Ai Assistant */
99
101
  --tui-brand-tinkoff-insurance: #27AFA5; /* Фирменный цвет Страхования */
100
102
  --tui-brand-tinkoff-business: #B58B60; /* Фирменный цвет Бизнеса */
101
103
  --tui-brand-tinkoff-business-alt-1: #E4D7C1; /* Фирменный цвет Бизнеса */
@@ -231,6 +233,7 @@
231
233
  --tui-const-black-alpha-70: #000000B3; /* 70% opacity */
232
234
  --tui-const-black-alpha-60: #00000099; /* 60% opacity */
233
235
  --tui-const-black-alpha-54: #0000008A; /* 54% opacity */
236
+ --tui-const-black-alpha-50: #00000080; /* 50% opacity */
234
237
  --tui-const-black-alpha-48: #0000007A; /* 48% opacity */
235
238
  --tui-const-black-alpha-40: #00000066; /* 40% opacity */
236
239
  --tui-const-black-alpha-30: #0000004D; /* 30% opacity */
@@ -263,10 +266,15 @@
263
266
  --tui-const-black-lighter-16: #292929;
264
267
  --tui-const-black-lighter-20: #333333; /* N1 */
265
268
  --tui-const-black-lighter-22: #383838;
269
+ --tui-const-black-lighter-25: #414141;
270
+ --tui-const-black-lighter-30: #4D4D4D;
271
+ --tui-const-black-lighter-79: #C9C9C9;
266
272
  --tui-const-cool-gray-lighter-36: #575B61;
267
273
  --tui-const-cool-gray-lighter-60: #9299A2; /* N3 */
268
274
  --tui-const-cool-gray-lighter-79: #C7C9CC; /* N4 */
275
+ --tui-const-cool-gray-lighter-85: #C7CBCF;
269
276
  --tui-const-cool-gray-lighter-87: #DDDFE0; /* N5 */
277
+ --tui-const-cool-gray-lighter-90: #E1E3E4;
270
278
  --tui-const-cool-gray-lighter-93: #EAECEE; /* N6 */
271
279
  --tui-const-cool-gray-lighter-96: #F2F4F7; /* N7 */
272
280
  --tui-const-cool-gray-lighter-97: #F6F7F8; /* N7 */
@@ -321,7 +329,7 @@
321
329
  --tui-service-skeleton: var(--tui-const-white-alpha-10); /* Цвет для шиммеров, отображаемых при загрузке экрана */
322
330
  --tui-service-skeleton-on-dark: var(--tui-const-white-alpha-10); /* Скелетон на темном фоне, не меняется при переключении темы */
323
331
  --tui-service-selected-text: var(--tui-const-blue-alpha-24); /* Фон под выделенным пользователем текстом */
324
- --tui-service-backdrop: var(--tui-const-black-alpha-48); /* Затемнение на фоне модальных окон и шторок */
332
+ --tui-service-backdrop: var(--tui-const-black-alpha-50); /* Затемнение на фоне модальных окон и шторок */
325
333
  --tui-service-underline: var(--tui-const-blue-alpha-64); /* Подчеркивание для ссылок */
326
334
  --tui-service-underline-monochrome: var(--tui-const-white-alpha-50); /* Подчеркивание для монохромных ссылок */
327
335
  --tui-service-underline-on-dark: var(--tui-const-white-alpha-50); /* Подчеркивание для монохромных ссылок на темном фоне. Не меняется при смене темы */
package/palette/mobile/light.css CHANGED
@@ -83,6 +83,7 @@
83
83
  --tui-background-overlay-glass-on-dark: var(--tui-const-white-alpha-30); /* Оверлей стеклянных поверхностей на темных фонах, не меняется при смене темы. */
84
84
  --tui-background-overlay-glass-on-light: var(--tui-const-black-alpha-40); /* Оверлей стеклянных поверхностей на cветлых фонах, не меняется при смене темы */
85
85
  --tui-border-normal: var(--tui-const-black-alpha-21); /* Бордеры и сепараторы на основных фонах */
86
+ --tui-border-normal-opaque: var(--tui-const-black-lighter-79); /* Бордеры и сепараторы на основных фонах без прозрачности */
86
87
  --tui-border-selected: var(--tui-const-blue); /* Обводка выделенных элементов */
87
88
  --tui-border-darkmode-only: var(--tui-const-clear); /* Обводка, отделяющая цветные элементы от фона в темной теме */
88
89
  --tui-border-on-light: var(--tui-const-black-alpha-3); /* Обводка, отделяющая цветные элементы от светлого фонов */
@@ -96,6 +97,7 @@
96
97
  --tui-brand-tinkoff-mobile-alt-1: #BAB3EC; /* Фирменный цвет Tinkoff Mobile */
97
98
  --tui-brand-tinkoff-all-airlines: #27BEFF; /* Фирменный цвет Tinkoff Mobile */
98
99
  --tui-brand-tinkoff-all-airlines-alt-1: #CBEFFF; /* Бледный оттенок фирменного цвета Tinkoff All Airlines */
100
+ --tui-brand-tinkoff-ai-assistant: #9A6BFF; /* Фирменный цвет Tinkoff Ai Assistant */
99
101
  --tui-brand-tinkoff-insurance: #27AFA5; /* Фирменный цвет Страхования */
100
102
  --tui-brand-tinkoff-business: #B58B60; /* Фирменный цвет Бизнеса */
101
103
  --tui-brand-tinkoff-business-alt-1: #E4D7C1; /* Фирменный цвет Бизнеса */
@@ -231,6 +233,7 @@
231
233
  --tui-const-black-alpha-70: #000000B3; /* 70% opacity */
232
234
  --tui-const-black-alpha-60: #00000099; /* 60% opacity */
233
235
  --tui-const-black-alpha-54: #0000008A; /* 54% opacity */
236
+ --tui-const-black-alpha-50: #00000080; /* 50% opacity */
234
237
  --tui-const-black-alpha-48: #0000007A; /* 48% opacity */
235
238
  --tui-const-black-alpha-40: #00000066; /* 40% opacity */
236
239
  --tui-const-black-alpha-30: #0000004D; /* 30% opacity */
@@ -263,10 +266,15 @@
263
266
  --tui-const-black-lighter-16: #292929;
264
267
  --tui-const-black-lighter-20: #333333; /* N1 */
265
268
  --tui-const-black-lighter-22: #383838;
269
+ --tui-const-black-lighter-25: #414141;
270
+ --tui-const-black-lighter-30: #4D4D4D;
271
+ --tui-const-black-lighter-79: #C9C9C9;
266
272
  --tui-const-cool-gray-lighter-36: #575B61;
267
273
  --tui-const-cool-gray-lighter-60: #9299A2; /* N3 */
268
274
  --tui-const-cool-gray-lighter-79: #C7C9CC; /* N4 */
275
+ --tui-const-cool-gray-lighter-85: #C7CBCF;
269
276
  --tui-const-cool-gray-lighter-87: #DDDFE0; /* N5 */
277
+ --tui-const-cool-gray-lighter-90: #E1E3E4;
270
278
  --tui-const-cool-gray-lighter-93: #EAECEE; /* N6 */
271
279
  --tui-const-cool-gray-lighter-96: #F2F4F7; /* N7 */
272
280
  --tui-const-cool-gray-lighter-97: #F6F7F8; /* N7 */
@@ -321,7 +329,7 @@
321
329
  --tui-service-skeleton: var(--tui-const-black-alpha-3); /* Цвет для шиммеров, отображаемых при загрузке экрана */
322
330
  --tui-service-skeleton-on-dark: var(--tui-const-white-alpha-10); /* Скелетон на темном фоне, не меняется при переключении темы */
323
331
  --tui-service-selected-text: var(--tui-const-blue-alpha-24); /* Фон под выделенным пользователем текстом */
324
- --tui-service-backdrop: var(--tui-const-black-alpha-48); /* Затемнение на фоне модальных окон и шторок */
332
+ --tui-service-backdrop: var(--tui-const-black-alpha-50); /* Затемнение на фоне модальных окон и шторок */
325
333
  --tui-service-underline: var(--tui-const-blue-alpha-64); /* Подчеркивание для ссылок */
326
334
  --tui-service-underline-monochrome: var(--tui-const-black-alpha-24); /* Подчеркивание для монохромных ссылок */
327
335
  --tui-service-underline-on-dark: var(--tui-const-white-alpha-50); /* Подчеркивание для монохромных ссылок на темном фоне. Не меняется при смене темы */