@taiga-ui/design-tokens 0.123.0 → 0.124.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 (7) hide show
  1. package/angular/desktop.less +35 -1
  2. package/angular/mobile.less +30 -0
  3. package/package.json +1 -1
  4. package/palette/dark.css +17 -0
  5. package/palette/light.css +18 -1
  6. package/palette/mobile/dark.css +15 -0
  7. package/palette/mobile/light.css +15 -0
package/angular/desktop.less CHANGED
@@ -195,10 +195,12 @@
195
195
  --tui-const-yellow-alpha-14: #FFDD2D24; // 14% opacity
196
196
  --tui-const-yellow-alpha-24: #FFDD2D3D; // 24% opacity
197
197
  --tui-const-yellow-alpha-30: #FFDD2D4D; // 30% opacity
198
+ --tui-const-yellow-alpha-40: #FFDD2D66; // 40% opacity
198
199
  --tui-const-yellow-alpha-48: #FFDD2D7A; // 48% opacity
199
200
  --tui-const-green-lighter-64: #94D274; // hsL=64
200
201
  --tui-const-green-lighter-57: #60C366; // hsL=57
201
202
  --tui-const-green-lighter-44: #00E037; // hsL=44
203
+ --tui-const-green-lighter-42: #00D635; // hsL=42
202
204
  --tui-const-green: #00B92D; // N11
203
205
  --tui-const-green-darker-34: #00A328; // hsL=34
204
206
  --tui-const-green-darker-21: #115B24; // hsL=21
@@ -206,6 +208,8 @@
206
208
  --tui-const-green-alpha-16: #00B92D29; // 16% opacity
207
209
  --tui-const-green-alpha-24: #00B92D3D; // 24% opacity
208
210
  --tui-const-green-alpha-32: #00B92D52; // 32% opacity
211
+ --tui-const-green-alpha-38: #00B92D61; // 38% opacity
212
+ --tui-const-green-alpha-44: #00B92D70; // 44% opacity
209
213
  --tui-const-blue: #428BF9; // N8
210
214
  --tui-const-blue-lighter-70: #6BA4FA; // @Deprecated: Заменён на цвет blue-darker-70
211
215
  --tui-const-blue-darker-70: #6BA4FA; // hsL=70
@@ -229,7 +233,12 @@
229
233
  --tui-const-dark-blue-alpha-12: #244A7F1F; // 12% opacity
230
234
  --tui-const-red-alpha-14: #F5222224; // 12% opacity
231
235
  --tui-const-red-alpha-24: #F522223D; // 24% opacity
236
+ --tui-const-red-alpha-32: #F5222252; // 32% opacity
237
+ --tui-const-red-alpha-38: #F5222261; // 38% opacity
238
+ --tui-const-red-alpha-44: #F5222270; // 44% opacity
232
239
  --tui-const-red-lighter-62: #F74646; // hsL=62
240
+ --tui-const-red-lighter-65: #FF4D4D; // hsL=65
241
+ --tui-const-red-lighter-70: #FF6666; // hsL=70
233
242
  --tui-const-red: #F52222; // N10
234
243
  --tui-const-red-darker-32: #9C0707; // hsL=32
235
244
  --tui-const-red-darker-29: #731F20; // hsL=29
@@ -416,9 +425,15 @@
416
425
  --tui-status-positive-pale: var(--tui-const-green-darker-18); // Контейнеры позитивных блоков
417
426
  --tui-status-positive-pale-hover: var(--tui-const-green-darker-21); // Только для веба. Контейнеры позитивных блоков при наведении
418
427
  --tui-status-positive-pale-pressed: var(--tui-const-green-darker-21); // Нажатое состояние positive в iOS
428
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); // Контейнеры позитивных блоков на тёмных фонах, не меняются от темы
429
+ --tui-status-positive-pale-on-dark-hover: var(--tui-const-green-alpha-38); // Только для веба. Контейнеры позитивных блоков на тёмных фонах при наведении
430
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); // Нажатое состояние positive-on-dark
419
431
  --tui-status-negative-pale: var(--tui-const-red-darker-23); // Контейнеры негативных блоков
420
432
  --tui-status-negative-pale-hover: var(--tui-const-red-darker-29); // Только для веба. Контейнеры негативных блоков при наведении
421
433
  --tui-status-negative-pale-pressed: var(--tui-const-red-darker-29); // Нажатое состояние negative в iOS
434
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); // Контейнеры негативных блоков на тёмных фонах
435
+ --tui-status-negative-pale-on-dark-hover: var(--tui-const-red-alpha-38); // Только для веба. Контейнеры негативных блоков на тёмных фонах при наведении
436
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); // Нажатое состояние negative-pale-on-dark
422
437
  --tui-status-info-pale: var(--tui-const-blue-darker-25); // Контейнеры информационных блоков
423
438
  --tui-status-info-pale-hover: var(--tui-const-blue-darker-32); // Только для веба. Контейнеры информационных блоков при наведении
424
439
  --tui-status-info-pale-pressed: var(--tui-const-blue-darker-32); // Контейнеры информационных блоков при нажатии
@@ -480,8 +495,10 @@
480
495
  --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); // @Deprecated: Заменён на цвет accent-pressed
481
496
  --tui-text-positive: var(--tui-const-green-lighter-44); // Текст позитивного лейбла, например пополнение счета или рост цены акций
482
497
  --tui-text-positive-hover: var(--tui-const-green); // Только для веба. Текст позитивного лейбла при нажатии
498
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-44); // Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций
483
499
  --tui-text-negative: var(--tui-const-red-lighter-62); // Текст негативного лейбла, например падение цены акций или ошибка
484
500
  --tui-text-negative-hover: var(--tui-const-red); // Только для веба. Текст негативного лейбла при наведении на вебе
501
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-70); // Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка
485
502
  --tui-text-warning: var(--tui-const-yellow-darker-54); // Предупреждающие текст и иконки
486
503
  --tui-text-warning-hover: var(--tui-const-yellow-darker-38); // Предупреждающие текст и иконки при наведении на вебе
487
504
  --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); // @Deprecated: Заменён на цвет primary-on-t-bank
@@ -679,10 +696,12 @@
679
696
  --tui-const-yellow-alpha-14: #FFDD2D24; // 14% opacity
680
697
  --tui-const-yellow-alpha-24: #FFDD2D3D; // 24% opacity
681
698
  --tui-const-yellow-alpha-30: #FFDD2D4D; // 30% opacity
699
+ --tui-const-yellow-alpha-40: #FFDD2D66; // 40% opacity
682
700
  --tui-const-yellow-alpha-48: #FFDD2D7A; // 48% opacity
683
701
  --tui-const-green-lighter-64: #94D274; // hsL=64
684
702
  --tui-const-green-lighter-57: #60C366; // hsL=57
685
703
  --tui-const-green-lighter-44: #00E037; // hsL=44
704
+ --tui-const-green-lighter-42: #00D635; // hsL=42
686
705
  --tui-const-green: #00B92D; // N11
687
706
  --tui-const-green-darker-34: #00A328; // hsL=34
688
707
  --tui-const-green-darker-21: #115B24; // hsL=21
@@ -690,6 +709,8 @@
690
709
  --tui-const-green-alpha-16: #00B92D29; // 16% opacity
691
710
  --tui-const-green-alpha-24: #00B92D3D; // 24% opacity
692
711
  --tui-const-green-alpha-32: #00B92D52; // 32% opacity
712
+ --tui-const-green-alpha-38: #00B92D61; // 38% opacity
713
+ --tui-const-green-alpha-44: #00B92D70; // 44% opacity
693
714
  --tui-const-blue: #428BF9; // N8
694
715
  --tui-const-blue-lighter-70: #6BA4FA; // @Deprecated: Заменён на цвет blue-darker-70
695
716
  --tui-const-blue-darker-70: #6BA4FA; // hsL=70
@@ -713,7 +734,12 @@
713
734
  --tui-const-dark-blue-alpha-12: #244A7F1F; // 12% opacity
714
735
  --tui-const-red-alpha-14: #F5222224; // 12% opacity
715
736
  --tui-const-red-alpha-24: #F522223D; // 24% opacity
737
+ --tui-const-red-alpha-32: #F5222252; // 32% opacity
738
+ --tui-const-red-alpha-38: #F5222261; // 38% opacity
739
+ --tui-const-red-alpha-44: #F5222270; // 44% opacity
716
740
  --tui-const-red-lighter-62: #F74646; // hsL=62
741
+ --tui-const-red-lighter-65: #FF4D4D; // hsL=65
742
+ --tui-const-red-lighter-70: #FF6666; // hsL=70
717
743
  --tui-const-red: #F52222; // N10
718
744
  --tui-const-red-darker-32: #9C0707; // hsL=32
719
745
  --tui-const-red-darker-29: #731F20; // hsL=29
@@ -895,14 +921,20 @@
895
921
  --tui-service-underline-monochrome: var(--tui-const-black-alpha-24); // Подчеркивание для монохромных ссылок
896
922
  --tui-service-underline-on-dark: var(--tui-const-white-alpha-50); // Подчеркивание для монохромных ссылок на темном фоне. Не меняется при смене темы
897
923
  --tui-status-warning-pale: var(--tui-const-yellow-alpha-14); // Контейнеры предупреждающих блоков
898
- --tui-status-warning-pale-hover: var(--tui-const-yellow-alpha-24); // Только для веба. Контейнеры предупреждающих блоков при наведении
924
+ --tui-status-warning-pale-hover: var(--tui-const-yellow-alpha-40); // Только для веба. Контейнеры предупреждающих блоков при наведении
899
925
  --tui-status-warning-pale-pressed: var(--tui-const-yellow-alpha-48); // Нажатое состояние контейнера предупреждающих блоков
900
926
  --tui-status-positive-pale: var(--tui-const-green-alpha-16); // Контейнеры позитивных блоков
901
927
  --tui-status-positive-pale-hover: var(--tui-const-green-alpha-24); // Только для веба. Контейнеры позитивных блоков при наведении
902
928
  --tui-status-positive-pale-pressed: var(--tui-const-green-alpha-32); // Нажатое состояние positive в iOS
929
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); // Контейнеры позитивных блоков на тёмных фонах, не меняются от темы
930
+ --tui-status-positive-pale-on-dark-hover: var(--tui-const-green-alpha-38); // Только для веба. Контейнеры позитивных блоков на тёмных фонах при наведении
931
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); // Нажатое состояние positive-on-dark
903
932
  --tui-status-negative-pale: var(--tui-const-red-alpha-14); // Контейнеры негативных блоков
904
933
  --tui-status-negative-pale-hover: var(--tui-const-red-alpha-24); // Только для веба. Контейнеры негативных блоков при наведении
905
934
  --tui-status-negative-pale-pressed: var(--tui-const-red-alpha-24); // Нажатое состояние negative в iOS
935
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); // Контейнеры негативных блоков на тёмных фонах
936
+ --tui-status-negative-pale-on-dark-hover: var(--tui-const-red-alpha-38); // Только для веба. Контейнеры негативных блоков на тёмных фонах при наведении
937
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); // Нажатое состояние negative-pale-on-dark
906
938
  --tui-status-info-pale: var(--tui-const-blue-alpha-16); // Контейнеры информационных блоков
907
939
  --tui-status-info-pale-hover: var(--tui-const-blue-alpha-24); // Только для веба. Контейнеры информационных блоков при наведении
908
940
  --tui-status-info-pale-pressed: var(--tui-const-blue-alpha-24); // Контейнеры информационных блоков при нажатии
@@ -964,8 +996,10 @@
964
996
  --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); // @Deprecated: Заменён на цвет accent-pressed
965
997
  --tui-text-positive: var(--tui-const-green-darker-34); // Текст позитивного лейбла, например пополнение счета или рост цены акций
966
998
  --tui-text-positive-hover: var(--tui-const-green-darker-21); // Только для веба. Текст позитивного лейбла при нажатии
999
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-44); // Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций
967
1000
  --tui-text-negative: var(--tui-const-red); // Текст негативного лейбла, например падение цены акций или ошибка
968
1001
  --tui-text-negative-hover: var(--tui-const-red-darker-32); // Только для веба. Текст негативного лейбла при наведении на вебе
1002
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-70); // Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка
969
1003
  --tui-text-warning: var(--tui-const-yellow-darker-48); // Предупреждающие текст и иконки
970
1004
  --tui-text-warning-hover: var(--tui-const-yellow-darker-26); // Предупреждающие текст и иконки при наведении на вебе
971
1005
  --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); // @Deprecated: Заменён на цвет primary-on-t-bank
package/angular/mobile.less CHANGED
@@ -179,10 +179,12 @@
179
179
  --tui-const-yellow-alpha-14: #FFDD2D24; // 14% opacity
180
180
  --tui-const-yellow-alpha-24: #FFDD2D3D; // 24% opacity
181
181
  --tui-const-yellow-alpha-30: #FFDD2D4D; // 30% opacity
182
+ --tui-const-yellow-alpha-40: #FFDD2D66; // 40% opacity
182
183
  --tui-const-yellow-alpha-48: #FFDD2D7A; // 48% opacity
183
184
  --tui-const-green-lighter-64: #94D274; // hsL=64
184
185
  --tui-const-green-lighter-57: #60C366; // hsL=57
185
186
  --tui-const-green-lighter-44: #00E037; // hsL=44
187
+ --tui-const-green-lighter-42: #00D635; // hsL=42
186
188
  --tui-const-green: #00B92D; // N11
187
189
  --tui-const-green-darker-34: #00A328; // hsL=34
188
190
  --tui-const-green-darker-21: #115B24; // hsL=21
@@ -190,6 +192,8 @@
190
192
  --tui-const-green-alpha-16: #00B92D29; // 16% opacity
191
193
  --tui-const-green-alpha-24: #00B92D3D; // 24% opacity
192
194
  --tui-const-green-alpha-32: #00B92D52; // 32% opacity
195
+ --tui-const-green-alpha-38: #00B92D61; // 38% opacity
196
+ --tui-const-green-alpha-44: #00B92D70; // 44% opacity
193
197
  --tui-const-blue: #428BF9; // N8
194
198
  --tui-const-blue-lighter-70: #6BA4FA; // @Deprecated: Заменён на цвет blue-darker-70
195
199
  --tui-const-blue-darker-70: #6BA4FA; // hsL=70
@@ -213,7 +217,12 @@
213
217
  --tui-const-dark-blue-alpha-12: #244A7F1F; // 12% opacity
214
218
  --tui-const-red-alpha-14: #F5222224; // 12% opacity
215
219
  --tui-const-red-alpha-24: #F522223D; // 24% opacity
220
+ --tui-const-red-alpha-32: #F5222252; // 32% opacity
221
+ --tui-const-red-alpha-38: #F5222261; // 38% opacity
222
+ --tui-const-red-alpha-44: #F5222270; // 44% opacity
216
223
  --tui-const-red-lighter-62: #F74646; // hsL=62
224
+ --tui-const-red-lighter-65: #FF4D4D; // hsL=65
225
+ --tui-const-red-lighter-70: #FF6666; // hsL=70
217
226
  --tui-const-red: #F52222; // N10
218
227
  --tui-const-red-darker-32: #9C0707; // hsL=32
219
228
  --tui-const-red-darker-29: #731F20; // hsL=29
@@ -396,8 +405,12 @@
396
405
  --tui-status-warning-pale-pressed: var(--tui-const-yellow-darker-32); // Нажатое состояние контейнера предупреждающих блоков
397
406
  --tui-status-positive-pale: var(--tui-const-green-darker-18); // Контейнеры позитивных блоков
398
407
  --tui-status-positive-pale-pressed: var(--tui-const-green-darker-21); // Нажатое состояние positive в iOS
408
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); // Контейнеры позитивных блоков на тёмных фонах, не меняются от темы
409
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); // Нажатое состояние positive-on-dark
399
410
  --tui-status-negative-pale: var(--tui-const-red-darker-23); // Контейнеры негативных блоков
400
411
  --tui-status-negative-pale-pressed: var(--tui-const-red-darker-29); // Нажатое состояние negative в iOS
412
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); // Контейнеры негативных блоков на тёмных фонах
413
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); // Нажатое состояние negative-pale-on-dark
401
414
  --tui-status-info-pale: var(--tui-const-blue-darker-25); // Контейнеры информационных блоков
402
415
  --tui-status-info-pale-pressed: var(--tui-const-blue-darker-32); // Контейнеры информационных блоков при нажатии
403
416
  --tui-status-neutral: var(--tui-const-white-alpha-50); // Акцентный цвет для нейтральных фонах
@@ -452,7 +465,9 @@
452
465
  --tui-text-engaging: var(--tui-const-blue); // @Deprecated: Заменён на цвет accent
453
466
  --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); // @Deprecated: Заменён на цвет accent-pressed
454
467
  --tui-text-positive: var(--tui-const-green); // Текст позитивного лейбла, например пополнение счета или рост цены акций
468
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-42); // Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций
455
469
  --tui-text-negative: var(--tui-const-red); // Текст негативного лейбла, например падение цены акций или ошибка
470
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-65); // Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка
456
471
  --tui-text-warning: var(--tui-const-yellow-darker-54); // Предупреждающие текст и иконки
457
472
  --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); // @Deprecated: Заменён на цвет primary-on-t-bank
458
473
  }
@@ -634,10 +649,12 @@
634
649
  --tui-const-yellow-alpha-14: #FFDD2D24; // 14% opacity
635
650
  --tui-const-yellow-alpha-24: #FFDD2D3D; // 24% opacity
636
651
  --tui-const-yellow-alpha-30: #FFDD2D4D; // 30% opacity
652
+ --tui-const-yellow-alpha-40: #FFDD2D66; // 40% opacity
637
653
  --tui-const-yellow-alpha-48: #FFDD2D7A; // 48% opacity
638
654
  --tui-const-green-lighter-64: #94D274; // hsL=64
639
655
  --tui-const-green-lighter-57: #60C366; // hsL=57
640
656
  --tui-const-green-lighter-44: #00E037; // hsL=44
657
+ --tui-const-green-lighter-42: #00D635; // hsL=42
641
658
  --tui-const-green: #00B92D; // N11
642
659
  --tui-const-green-darker-34: #00A328; // hsL=34
643
660
  --tui-const-green-darker-21: #115B24; // hsL=21
@@ -645,6 +662,8 @@
645
662
  --tui-const-green-alpha-16: #00B92D29; // 16% opacity
646
663
  --tui-const-green-alpha-24: #00B92D3D; // 24% opacity
647
664
  --tui-const-green-alpha-32: #00B92D52; // 32% opacity
665
+ --tui-const-green-alpha-38: #00B92D61; // 38% opacity
666
+ --tui-const-green-alpha-44: #00B92D70; // 44% opacity
648
667
  --tui-const-blue: #428BF9; // N8
649
668
  --tui-const-blue-lighter-70: #6BA4FA; // @Deprecated: Заменён на цвет blue-darker-70
650
669
  --tui-const-blue-darker-70: #6BA4FA; // hsL=70
@@ -668,7 +687,12 @@
668
687
  --tui-const-dark-blue-alpha-12: #244A7F1F; // 12% opacity
669
688
  --tui-const-red-alpha-14: #F5222224; // 12% opacity
670
689
  --tui-const-red-alpha-24: #F522223D; // 24% opacity
690
+ --tui-const-red-alpha-32: #F5222252; // 32% opacity
691
+ --tui-const-red-alpha-38: #F5222261; // 38% opacity
692
+ --tui-const-red-alpha-44: #F5222270; // 44% opacity
671
693
  --tui-const-red-lighter-62: #F74646; // hsL=62
694
+ --tui-const-red-lighter-65: #FF4D4D; // hsL=65
695
+ --tui-const-red-lighter-70: #FF6666; // hsL=70
672
696
  --tui-const-red: #F52222; // N10
673
697
  --tui-const-red-darker-32: #9C0707; // hsL=32
674
698
  --tui-const-red-darker-29: #731F20; // hsL=29
@@ -851,8 +875,12 @@
851
875
  --tui-status-warning-pale-pressed: var(--tui-const-yellow-alpha-48); // Нажатое состояние контейнера предупреждающих блоков
852
876
  --tui-status-positive-pale: var(--tui-const-green-alpha-16); // Контейнеры позитивных блоков
853
877
  --tui-status-positive-pale-pressed: var(--tui-const-green-alpha-32); // Нажатое состояние positive в iOS
878
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); // Контейнеры позитивных блоков на тёмных фонах, не меняются от темы
879
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); // Нажатое состояние positive-on-dark
854
880
  --tui-status-negative-pale: var(--tui-const-red-alpha-14); // Контейнеры негативных блоков
855
881
  --tui-status-negative-pale-pressed: var(--tui-const-red-alpha-24); // Нажатое состояние negative в iOS
882
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); // Контейнеры негативных блоков на тёмных фонах
883
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); // Нажатое состояние negative-pale-on-dark
856
884
  --tui-status-info-pale: var(--tui-const-blue-alpha-16); // Контейнеры информационных блоков
857
885
  --tui-status-info-pale-pressed: var(--tui-const-blue-alpha-24); // Контейнеры информационных блоков при нажатии
858
886
  --tui-status-neutral: var(--tui-const-cool-gray-alpha-44); // Акцентный цвет для нейтральных фонах
@@ -907,7 +935,9 @@
907
935
  --tui-text-engaging: var(--tui-const-blue); // @Deprecated: Заменён на цвет accent
908
936
  --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); // @Deprecated: Заменён на цвет accent-pressed
909
937
  --tui-text-positive: var(--tui-const-green); // Текст позитивного лейбла, например пополнение счета или рост цены акций
938
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-42); // Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций
910
939
  --tui-text-negative: var(--tui-const-red); // Текст негативного лейбла, например падение цены акций или ошибка
940
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-65); // Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка
911
941
  --tui-text-warning: var(--tui-const-yellow-darker-48); // Предупреждающие текст и иконки
912
942
  --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); // @Deprecated: Заменён на цвет primary-on-t-bank
913
943
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@taiga-ui/design-tokens",
3
- "version": "0.123.0",
3
+ "version": "0.124.0",
4
4
  "description": "Taiga UI palette",
5
5
  "keywords": [
6
6
  "angular",
package/palette/dark.css CHANGED
@@ -195,10 +195,12 @@
195
195
  --tui-const-yellow-alpha-14: #FFDD2D24; /* 14% opacity */
196
196
  --tui-const-yellow-alpha-24: #FFDD2D3D; /* 24% opacity */
197
197
  --tui-const-yellow-alpha-30: #FFDD2D4D; /* 30% opacity */
198
+ --tui-const-yellow-alpha-40: #FFDD2D66; /* 40% opacity */
198
199
  --tui-const-yellow-alpha-48: #FFDD2D7A; /* 48% opacity */
199
200
  --tui-const-green-lighter-64: #94D274; /* hsL=64 */
200
201
  --tui-const-green-lighter-57: #60C366; /* hsL=57 */
201
202
  --tui-const-green-lighter-44: #00E037; /* hsL=44 */
203
+ --tui-const-green-lighter-42: #00D635; /* hsL=42 */
202
204
  --tui-const-green: #00B92D; /* N11 */
203
205
  --tui-const-green-darker-34: #00A328; /* hsL=34 */
204
206
  --tui-const-green-darker-21: #115B24; /* hsL=21 */
@@ -206,6 +208,8 @@
206
208
  --tui-const-green-alpha-16: #00B92D29; /* 16% opacity */
207
209
  --tui-const-green-alpha-24: #00B92D3D; /* 24% opacity */
208
210
  --tui-const-green-alpha-32: #00B92D52; /* 32% opacity */
211
+ --tui-const-green-alpha-38: #00B92D61; /* 38% opacity */
212
+ --tui-const-green-alpha-44: #00B92D70; /* 44% opacity */
209
213
  --tui-const-blue: #428BF9; /* N8 */
210
214
  --tui-const-blue-lighter-70: #6BA4FA; /* @Deprecated: Заменён на цвет blue-darker-70 */
211
215
  --tui-const-blue-darker-70: #6BA4FA; /* hsL=70 */
@@ -229,7 +233,12 @@
229
233
  --tui-const-dark-blue-alpha-12: #244A7F1F; /* 12% opacity */
230
234
  --tui-const-red-alpha-14: #F5222224; /* 12% opacity */
231
235
  --tui-const-red-alpha-24: #F522223D; /* 24% opacity */
236
+ --tui-const-red-alpha-32: #F5222252; /* 32% opacity */
237
+ --tui-const-red-alpha-38: #F5222261; /* 38% opacity */
238
+ --tui-const-red-alpha-44: #F5222270; /* 44% opacity */
232
239
  --tui-const-red-lighter-62: #F74646; /* hsL=62 */
240
+ --tui-const-red-lighter-65: #FF4D4D; /* hsL=65 */
241
+ --tui-const-red-lighter-70: #FF6666; /* hsL=70 */
233
242
  --tui-const-red: #F52222; /* N10 */
234
243
  --tui-const-red-darker-32: #9C0707; /* hsL=32 */
235
244
  --tui-const-red-darker-29: #731F20; /* hsL=29 */
@@ -416,9 +425,15 @@
416
425
  --tui-status-positive-pale: var(--tui-const-green-darker-18); /* Контейнеры позитивных блоков */
417
426
  --tui-status-positive-pale-hover: var(--tui-const-green-darker-21); /* Только для веба. Контейнеры позитивных блоков при наведении */
418
427
  --tui-status-positive-pale-pressed: var(--tui-const-green-darker-21); /* Нажатое состояние positive в iOS */
428
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); /* Контейнеры позитивных блоков на тёмных фонах, не меняются от темы */
429
+ --tui-status-positive-pale-on-dark-hover: var(--tui-const-green-alpha-38); /* Только для веба. Контейнеры позитивных блоков на тёмных фонах при наведении */
430
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); /* Нажатое состояние positive-on-dark */
419
431
  --tui-status-negative-pale: var(--tui-const-red-darker-23); /* Контейнеры негативных блоков */
420
432
  --tui-status-negative-pale-hover: var(--tui-const-red-darker-29); /* Только для веба. Контейнеры негативных блоков при наведении */
421
433
  --tui-status-negative-pale-pressed: var(--tui-const-red-darker-29); /* Нажатое состояние negative в iOS */
434
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); /* Контейнеры негативных блоков на тёмных фонах */
435
+ --tui-status-negative-pale-on-dark-hover: var(--tui-const-red-alpha-38); /* Только для веба. Контейнеры негативных блоков на тёмных фонах при наведении */
436
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); /* Нажатое состояние negative-pale-on-dark */
422
437
  --tui-status-info-pale: var(--tui-const-blue-darker-25); /* Контейнеры информационных блоков */
423
438
  --tui-status-info-pale-hover: var(--tui-const-blue-darker-32); /* Только для веба. Контейнеры информационных блоков при наведении */
424
439
  --tui-status-info-pale-pressed: var(--tui-const-blue-darker-32); /* Контейнеры информационных блоков при нажатии */
@@ -480,8 +495,10 @@
480
495
  --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); /* @Deprecated: Заменён на цвет accent-pressed */
481
496
  --tui-text-positive: var(--tui-const-green-lighter-44); /* Текст позитивного лейбла, например пополнение счета или рост цены акций */
482
497
  --tui-text-positive-hover: var(--tui-const-green); /* Только для веба. Текст позитивного лейбла при нажатии */
498
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-44); /* Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций */
483
499
  --tui-text-negative: var(--tui-const-red-lighter-62); /* Текст негативного лейбла, например падение цены акций или ошибка */
484
500
  --tui-text-negative-hover: var(--tui-const-red); /* Только для веба. Текст негативного лейбла при наведении на вебе */
501
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-70); /* Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка */
485
502
  --tui-text-warning: var(--tui-const-yellow-darker-54); /* Предупреждающие текст и иконки */
486
503
  --tui-text-warning-hover: var(--tui-const-yellow-darker-38); /* Предупреждающие текст и иконки при наведении на вебе */
487
504
  --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); /* @Deprecated: Заменён на цвет primary-on-t-bank */
package/palette/light.css CHANGED
@@ -195,10 +195,12 @@
195
195
  --tui-const-yellow-alpha-14: #FFDD2D24; /* 14% opacity */
196
196
  --tui-const-yellow-alpha-24: #FFDD2D3D; /* 24% opacity */
197
197
  --tui-const-yellow-alpha-30: #FFDD2D4D; /* 30% opacity */
198
+ --tui-const-yellow-alpha-40: #FFDD2D66; /* 40% opacity */
198
199
  --tui-const-yellow-alpha-48: #FFDD2D7A; /* 48% opacity */
199
200
  --tui-const-green-lighter-64: #94D274; /* hsL=64 */
200
201
  --tui-const-green-lighter-57: #60C366; /* hsL=57 */
201
202
  --tui-const-green-lighter-44: #00E037; /* hsL=44 */
203
+ --tui-const-green-lighter-42: #00D635; /* hsL=42 */
202
204
  --tui-const-green: #00B92D; /* N11 */
203
205
  --tui-const-green-darker-34: #00A328; /* hsL=34 */
204
206
  --tui-const-green-darker-21: #115B24; /* hsL=21 */
@@ -206,6 +208,8 @@
206
208
  --tui-const-green-alpha-16: #00B92D29; /* 16% opacity */
207
209
  --tui-const-green-alpha-24: #00B92D3D; /* 24% opacity */
208
210
  --tui-const-green-alpha-32: #00B92D52; /* 32% opacity */
211
+ --tui-const-green-alpha-38: #00B92D61; /* 38% opacity */
212
+ --tui-const-green-alpha-44: #00B92D70; /* 44% opacity */
209
213
  --tui-const-blue: #428BF9; /* N8 */
210
214
  --tui-const-blue-lighter-70: #6BA4FA; /* @Deprecated: Заменён на цвет blue-darker-70 */
211
215
  --tui-const-blue-darker-70: #6BA4FA; /* hsL=70 */
@@ -229,7 +233,12 @@
229
233
  --tui-const-dark-blue-alpha-12: #244A7F1F; /* 12% opacity */
230
234
  --tui-const-red-alpha-14: #F5222224; /* 12% opacity */
231
235
  --tui-const-red-alpha-24: #F522223D; /* 24% opacity */
236
+ --tui-const-red-alpha-32: #F5222252; /* 32% opacity */
237
+ --tui-const-red-alpha-38: #F5222261; /* 38% opacity */
238
+ --tui-const-red-alpha-44: #F5222270; /* 44% opacity */
232
239
  --tui-const-red-lighter-62: #F74646; /* hsL=62 */
240
+ --tui-const-red-lighter-65: #FF4D4D; /* hsL=65 */
241
+ --tui-const-red-lighter-70: #FF6666; /* hsL=70 */
233
242
  --tui-const-red: #F52222; /* N10 */
234
243
  --tui-const-red-darker-32: #9C0707; /* hsL=32 */
235
244
  --tui-const-red-darker-29: #731F20; /* hsL=29 */
@@ -411,14 +420,20 @@
411
420
  --tui-service-underline-monochrome: var(--tui-const-black-alpha-24); /* Подчеркивание для монохромных ссылок */
412
421
  --tui-service-underline-on-dark: var(--tui-const-white-alpha-50); /* Подчеркивание для монохромных ссылок на темном фоне. Не меняется при смене темы */
413
422
  --tui-status-warning-pale: var(--tui-const-yellow-alpha-14); /* Контейнеры предупреждающих блоков */
414
- --tui-status-warning-pale-hover: var(--tui-const-yellow-alpha-24); /* Только для веба. Контейнеры предупреждающих блоков при наведении */
423
+ --tui-status-warning-pale-hover: var(--tui-const-yellow-alpha-40); /* Только для веба. Контейнеры предупреждающих блоков при наведении */
415
424
  --tui-status-warning-pale-pressed: var(--tui-const-yellow-alpha-48); /* Нажатое состояние контейнера предупреждающих блоков */
416
425
  --tui-status-positive-pale: var(--tui-const-green-alpha-16); /* Контейнеры позитивных блоков */
417
426
  --tui-status-positive-pale-hover: var(--tui-const-green-alpha-24); /* Только для веба. Контейнеры позитивных блоков при наведении */
418
427
  --tui-status-positive-pale-pressed: var(--tui-const-green-alpha-32); /* Нажатое состояние positive в iOS */
428
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); /* Контейнеры позитивных блоков на тёмных фонах, не меняются от темы */
429
+ --tui-status-positive-pale-on-dark-hover: var(--tui-const-green-alpha-38); /* Только для веба. Контейнеры позитивных блоков на тёмных фонах при наведении */
430
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); /* Нажатое состояние positive-on-dark */
419
431
  --tui-status-negative-pale: var(--tui-const-red-alpha-14); /* Контейнеры негативных блоков */
420
432
  --tui-status-negative-pale-hover: var(--tui-const-red-alpha-24); /* Только для веба. Контейнеры негативных блоков при наведении */
421
433
  --tui-status-negative-pale-pressed: var(--tui-const-red-alpha-24); /* Нажатое состояние negative в iOS */
434
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); /* Контейнеры негативных блоков на тёмных фонах */
435
+ --tui-status-negative-pale-on-dark-hover: var(--tui-const-red-alpha-38); /* Только для веба. Контейнеры негативных блоков на тёмных фонах при наведении */
436
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); /* Нажатое состояние negative-pale-on-dark */
422
437
  --tui-status-info-pale: var(--tui-const-blue-alpha-16); /* Контейнеры информационных блоков */
423
438
  --tui-status-info-pale-hover: var(--tui-const-blue-alpha-24); /* Только для веба. Контейнеры информационных блоков при наведении */
424
439
  --tui-status-info-pale-pressed: var(--tui-const-blue-alpha-24); /* Контейнеры информационных блоков при нажатии */
@@ -480,8 +495,10 @@
480
495
  --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); /* @Deprecated: Заменён на цвет accent-pressed */
481
496
  --tui-text-positive: var(--tui-const-green-darker-34); /* Текст позитивного лейбла, например пополнение счета или рост цены акций */
482
497
  --tui-text-positive-hover: var(--tui-const-green-darker-21); /* Только для веба. Текст позитивного лейбла при нажатии */
498
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-44); /* Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций */
483
499
  --tui-text-negative: var(--tui-const-red); /* Текст негативного лейбла, например падение цены акций или ошибка */
484
500
  --tui-text-negative-hover: var(--tui-const-red-darker-32); /* Только для веба. Текст негативного лейбла при наведении на вебе */
501
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-70); /* Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка */
485
502
  --tui-text-warning: var(--tui-const-yellow-darker-48); /* Предупреждающие текст и иконки */
486
503
  --tui-text-warning-hover: var(--tui-const-yellow-darker-26); /* Предупреждающие текст и иконки при наведении на вебе */
487
504
  --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); /* @Deprecated: Заменён на цвет primary-on-t-bank */
package/palette/mobile/dark.css CHANGED
@@ -173,10 +173,12 @@
173
173
  --tui-const-yellow-alpha-14: #FFDD2D24; /* 14% opacity */
174
174
  --tui-const-yellow-alpha-24: #FFDD2D3D; /* 24% opacity */
175
175
  --tui-const-yellow-alpha-30: #FFDD2D4D; /* 30% opacity */
176
+ --tui-const-yellow-alpha-40: #FFDD2D66; /* 40% opacity */
176
177
  --tui-const-yellow-alpha-48: #FFDD2D7A; /* 48% opacity */
177
178
  --tui-const-green-lighter-64: #94D274; /* hsL=64 */
178
179
  --tui-const-green-lighter-57: #60C366; /* hsL=57 */
179
180
  --tui-const-green-lighter-44: #00E037; /* hsL=44 */
181
+ --tui-const-green-lighter-42: #00D635; /* hsL=42 */
180
182
  --tui-const-green: #00B92D; /* N11 */
181
183
  --tui-const-green-darker-34: #00A328; /* hsL=34 */
182
184
  --tui-const-green-darker-21: #115B24; /* hsL=21 */
@@ -184,6 +186,8 @@
184
186
  --tui-const-green-alpha-16: #00B92D29; /* 16% opacity */
185
187
  --tui-const-green-alpha-24: #00B92D3D; /* 24% opacity */
186
188
  --tui-const-green-alpha-32: #00B92D52; /* 32% opacity */
189
+ --tui-const-green-alpha-38: #00B92D61; /* 38% opacity */
190
+ --tui-const-green-alpha-44: #00B92D70; /* 44% opacity */
187
191
  --tui-const-blue: #428BF9; /* N8 */
188
192
  --tui-const-blue-lighter-70: #6BA4FA; /* @Deprecated: Заменён на цвет blue-darker-70 */
189
193
  --tui-const-blue-darker-70: #6BA4FA; /* hsL=70 */
@@ -207,7 +211,12 @@
207
211
  --tui-const-dark-blue-alpha-12: #244A7F1F; /* 12% opacity */
208
212
  --tui-const-red-alpha-14: #F5222224; /* 12% opacity */
209
213
  --tui-const-red-alpha-24: #F522223D; /* 24% opacity */
214
+ --tui-const-red-alpha-32: #F5222252; /* 32% opacity */
215
+ --tui-const-red-alpha-38: #F5222261; /* 38% opacity */
216
+ --tui-const-red-alpha-44: #F5222270; /* 44% opacity */
210
217
  --tui-const-red-lighter-62: #F74646; /* hsL=62 */
218
+ --tui-const-red-lighter-65: #FF4D4D; /* hsL=65 */
219
+ --tui-const-red-lighter-70: #FF6666; /* hsL=70 */
211
220
  --tui-const-red: #F52222; /* N10 */
212
221
  --tui-const-red-darker-32: #9C0707; /* hsL=32 */
213
222
  --tui-const-red-darker-29: #731F20; /* hsL=29 */
@@ -390,8 +399,12 @@
390
399
  --tui-status-warning-pale-pressed: var(--tui-const-yellow-darker-32); /* Нажатое состояние контейнера предупреждающих блоков */
391
400
  --tui-status-positive-pale: var(--tui-const-green-darker-18); /* Контейнеры позитивных блоков */
392
401
  --tui-status-positive-pale-pressed: var(--tui-const-green-darker-21); /* Нажатое состояние positive в iOS */
402
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); /* Контейнеры позитивных блоков на тёмных фонах, не меняются от темы */
403
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); /* Нажатое состояние positive-on-dark */
393
404
  --tui-status-negative-pale: var(--tui-const-red-darker-23); /* Контейнеры негативных блоков */
394
405
  --tui-status-negative-pale-pressed: var(--tui-const-red-darker-29); /* Нажатое состояние negative в iOS */
406
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); /* Контейнеры негативных блоков на тёмных фонах */
407
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); /* Нажатое состояние negative-pale-on-dark */
395
408
  --tui-status-info-pale: var(--tui-const-blue-darker-25); /* Контейнеры информационных блоков */
396
409
  --tui-status-info-pale-pressed: var(--tui-const-blue-darker-32); /* Контейнеры информационных блоков при нажатии */
397
410
  --tui-status-neutral: var(--tui-const-white-alpha-50); /* Акцентный цвет для нейтральных фонах */
@@ -446,7 +459,9 @@
446
459
  --tui-text-engaging: var(--tui-const-blue); /* @Deprecated: Заменён на цвет accent */
447
460
  --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); /* @Deprecated: Заменён на цвет accent-pressed */
448
461
  --tui-text-positive: var(--tui-const-green); /* Текст позитивного лейбла, например пополнение счета или рост цены акций */
462
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-42); /* Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций */
449
463
  --tui-text-negative: var(--tui-const-red); /* Текст негативного лейбла, например падение цены акций или ошибка */
464
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-65); /* Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка */
450
465
  --tui-text-warning: var(--tui-const-yellow-darker-54); /* Предупреждающие текст и иконки */
451
466
  --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); /* @Deprecated: Заменён на цвет primary-on-t-bank */
452
467
  }
package/palette/mobile/light.css CHANGED
@@ -173,10 +173,12 @@
173
173
  --tui-const-yellow-alpha-14: #FFDD2D24; /* 14% opacity */
174
174
  --tui-const-yellow-alpha-24: #FFDD2D3D; /* 24% opacity */
175
175
  --tui-const-yellow-alpha-30: #FFDD2D4D; /* 30% opacity */
176
+ --tui-const-yellow-alpha-40: #FFDD2D66; /* 40% opacity */
176
177
  --tui-const-yellow-alpha-48: #FFDD2D7A; /* 48% opacity */
177
178
  --tui-const-green-lighter-64: #94D274; /* hsL=64 */
178
179
  --tui-const-green-lighter-57: #60C366; /* hsL=57 */
179
180
  --tui-const-green-lighter-44: #00E037; /* hsL=44 */
181
+ --tui-const-green-lighter-42: #00D635; /* hsL=42 */
180
182
  --tui-const-green: #00B92D; /* N11 */
181
183
  --tui-const-green-darker-34: #00A328; /* hsL=34 */
182
184
  --tui-const-green-darker-21: #115B24; /* hsL=21 */
@@ -184,6 +186,8 @@
184
186
  --tui-const-green-alpha-16: #00B92D29; /* 16% opacity */
185
187
  --tui-const-green-alpha-24: #00B92D3D; /* 24% opacity */
186
188
  --tui-const-green-alpha-32: #00B92D52; /* 32% opacity */
189
+ --tui-const-green-alpha-38: #00B92D61; /* 38% opacity */
190
+ --tui-const-green-alpha-44: #00B92D70; /* 44% opacity */
187
191
  --tui-const-blue: #428BF9; /* N8 */
188
192
  --tui-const-blue-lighter-70: #6BA4FA; /* @Deprecated: Заменён на цвет blue-darker-70 */
189
193
  --tui-const-blue-darker-70: #6BA4FA; /* hsL=70 */
@@ -207,7 +211,12 @@
207
211
  --tui-const-dark-blue-alpha-12: #244A7F1F; /* 12% opacity */
208
212
  --tui-const-red-alpha-14: #F5222224; /* 12% opacity */
209
213
  --tui-const-red-alpha-24: #F522223D; /* 24% opacity */
214
+ --tui-const-red-alpha-32: #F5222252; /* 32% opacity */
215
+ --tui-const-red-alpha-38: #F5222261; /* 38% opacity */
216
+ --tui-const-red-alpha-44: #F5222270; /* 44% opacity */
210
217
  --tui-const-red-lighter-62: #F74646; /* hsL=62 */
218
+ --tui-const-red-lighter-65: #FF4D4D; /* hsL=65 */
219
+ --tui-const-red-lighter-70: #FF6666; /* hsL=70 */
211
220
  --tui-const-red: #F52222; /* N10 */
212
221
  --tui-const-red-darker-32: #9C0707; /* hsL=32 */
213
222
  --tui-const-red-darker-29: #731F20; /* hsL=29 */
@@ -390,8 +399,12 @@
390
399
  --tui-status-warning-pale-pressed: var(--tui-const-yellow-alpha-48); /* Нажатое состояние контейнера предупреждающих блоков */
391
400
  --tui-status-positive-pale: var(--tui-const-green-alpha-16); /* Контейнеры позитивных блоков */
392
401
  --tui-status-positive-pale-pressed: var(--tui-const-green-alpha-32); /* Нажатое состояние positive в iOS */
402
+ --tui-status-positive-pale-on-dark: var(--tui-const-green-alpha-32); /* Контейнеры позитивных блоков на тёмных фонах, не меняются от темы */
403
+ --tui-status-positive-pale-on-dark-pressed: var(--tui-const-green-alpha-44); /* Нажатое состояние positive-on-dark */
393
404
  --tui-status-negative-pale: var(--tui-const-red-alpha-14); /* Контейнеры негативных блоков */
394
405
  --tui-status-negative-pale-pressed: var(--tui-const-red-alpha-24); /* Нажатое состояние negative в iOS */
406
+ --tui-status-negative-pale-on-dark: var(--tui-const-red-alpha-32); /* Контейнеры негативных блоков на тёмных фонах */
407
+ --tui-status-negative-pale-on-dark-pressed: var(--tui-const-red-alpha-44); /* Нажатое состояние negative-pale-on-dark */
395
408
  --tui-status-info-pale: var(--tui-const-blue-alpha-16); /* Контейнеры информационных блоков */
396
409
  --tui-status-info-pale-pressed: var(--tui-const-blue-alpha-24); /* Контейнеры информационных блоков при нажатии */
397
410
  --tui-status-neutral: var(--tui-const-cool-gray-alpha-44); /* Акцентный цвет для нейтральных фонах */
@@ -446,7 +459,9 @@
446
459
  --tui-text-engaging: var(--tui-const-blue); /* @Deprecated: Заменён на цвет accent */
447
460
  --tui-text-engaging-pressed: var(--tui-const-blue-darker-46); /* @Deprecated: Заменён на цвет accent-pressed */
448
461
  --tui-text-positive: var(--tui-const-green); /* Текст позитивного лейбла, например пополнение счета или рост цены акций */
462
+ --tui-text-positive-on-dark: var(--tui-const-green-lighter-42); /* Текст позитивного лейбла на тёмном фоне, например пополнение счета или рост цены акций */
449
463
  --tui-text-negative: var(--tui-const-red); /* Текст негативного лейбла, например падение цены акций или ошибка */
464
+ --tui-text-negative-on-dark: var(--tui-const-red-lighter-65); /* Текст негативного лейбла на тёмном фоне, например падение цены акций или ошибка */
450
465
  --tui-text-warning: var(--tui-const-yellow-darker-48); /* Предупреждающие текст и иконки */
451
466
  --tui-text-primary-on-tinkoff: var(--tui-const-black-lighter-20); /* @Deprecated: Заменён на цвет primary-on-t-bank */
452
467
  }