npm - @vkontakte/vkui-tokens - Versions diffs - 4.78.1 → 4.80.0 - Mend

@vkontakte/vkui-tokens 4.78.1 → 4.80.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 (677) hide show

package/themes/legoIOSDark/cssVars/declarations/onlyVariablesLocalIncremental.css CHANGED Viewed

@@ -65,6 +65,14 @@
 	--vkui--font_body--line_height--regular: 21px;
 	--vkui--font_body--font_weight--regular: 520;
 	--vkui--font_body--font_variation_settings--optical_size--regular: 21.5;
+	--vkui--font_text_bold--font_size--regular: 16px;
+	--vkui--font_text_bold--line_height--regular: 18.5px;
+	--vkui--font_text_bold--font_weight--regular: 700;
+	--vkui--font_text_bold--font_variation_settings--optical_size--regular: 21.8;
+	--vkui--font_footnote_bold--font_size--regular: 13.5px;
+	--vkui--font_footnote_bold--line_height--regular: 15px;
+	--vkui--font_footnote_bold--font_weight--regular: 700;
+	--vkui--font_footnote_bold--font_variation_settings--optical_size--regular: 22.2;
 	--vkui--font_headline--font_size--regular: 17px;
 	--vkui--font_headline--line_height--regular: 20px;
 	--vkui--font_headline--font_family--regular: -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif;
@@ -87,12 +95,15 @@
 	--vkui--color_background_tertiary: #141414;
 	--vkui--color_background_tertiary--hover: #1D1D1D;
 	--vkui--color_background_tertiary--active: #272727;
+	--vkui--color_background_contrast_secondary_alpha: #ffffff33;
+	--vkui--color_background_contrast_secondary_alpha--hover: rgba(255, 255, 255, 0.24);
+	--vkui--color_background_contrast_secondary_alpha--active: rgba(255, 255, 255, 0.28);
 	--vkui--color_background_contrast_inverse: #000000;
 	--vkui--color_background_contrast_inverse--hover: #0A0A0A;
 	--vkui--color_background_contrast_inverse--active: #141414;
-	--vkui--color_background_contrast_themed: #000000;
-	--vkui--color_background_contrast_themed--hover: #0A0A0A;
-	--vkui--color_background_contrast_themed--active: #141414;
+	--vkui--color_background_contrast_themed: #1e1e1c;
+	--vkui--color_background_contrast_themed--hover: #272725;
+	--vkui--color_background_contrast_themed--active: #30302E;
 	--vkui--color_background_modal: #000000;
 	--vkui--color_background_modal--hover: #0A0A0A;
 	--vkui--color_background_modal--active: #141414;
@@ -105,7 +116,7 @@
 	--vkui--color_background_warning: #483416;
 	--vkui--color_background_warning--hover: #4F3C1F;
 	--vkui--color_background_warning--active: #574429;
-	--vkui--color_background_negative: #FD6571;
+	--vkui--color_background_negative: #fd6571;
 	--vkui--color_background_negative--hover: #FD6B77;
 	--vkui--color_background_negative--active: #FD717C;
 	--vkui--color_background_negative_tint: #4b2727;
@@ -135,7 +146,7 @@
 	--vkui--color_text_positive: #34c759;
 	--vkui--color_text_positive--hover: #3CC960;
 	--vkui--color_text_positive--active: #44CB66;
-	--vkui--color_text_negative: #FD6571;
+	--vkui--color_text_negative: #fd6571;
 	--vkui--color_text_negative--hover: #FD6B77;
 	--vkui--color_text_negative--active: #FD717C;
 	--vkui--color_text_link: #2e90ff;
@@ -168,7 +179,7 @@
 	--vkui--color_icon_warning: #ff6900;
 	--vkui--color_icon_warning--hover: #FF6F0A;
 	--vkui--color_icon_warning--active: #FF7514;
-	--vkui--color_icon_negative: #FD6571;
+	--vkui--color_icon_negative: #fd6571;
 	--vkui--color_icon_negative--hover: #FD6B77;
 	--vkui--color_icon_negative--active: #FD717C;
 	--vkui--color_separator_primary: #303030;
@@ -180,7 +191,7 @@
 	--vkui--color_stroke_positive: #34c759;
 	--vkui--color_stroke_positive--hover: #3CC960;
 	--vkui--color_stroke_positive--active: #44CB66;
-	--vkui--color_stroke_negative: #FD6571;
+	--vkui--color_stroke_negative: #fd6571;
 	--vkui--color_stroke_negative--hover: #FD6B77;
 	--vkui--color_stroke_negative--active: #FD717C;
 	--vkui--color_image_border_alpha: #ffffff3d;
@@ -225,13 +236,13 @@
 	--vkui--color_write_bar_input_border_alpha: #ddff00;
 	--vkui--color_write_bar_input_border_alpha--hover: #DEFF0A;
 	--vkui--color_write_bar_input_border_alpha--active: #E0FF14;
-	--vkui--color_transparent: #00000000;
-	--vkui--color_transparent--hover: rgba(0, 0, 0, 0.04);
-	--vkui--color_transparent--active: rgba(0, 0, 0, 0.08);
 	--vkui--color_background_inverse: #FFFFFF;
 	--vkui--color_background_inverse--hover: #EBEDF0;
 	--vkui--color_background_inverse--active: #D7D8DB;
-	--vkui--color_stroke_contrast_secondary_alpha: #ffffff1f;
+	--vkui--color_stroke_contrast_secondary_alpha: #ffffff1e;
 	--vkui--color_stroke_contrast_secondary_alpha--hover: rgba(255, 255, 255, 0.16);
 	--vkui--color_stroke_contrast_secondary_alpha--active: rgba(255, 255, 255, 0.2);
+	--vkui--color_text_tertiary_alpha: #ffffff7f;
+	--vkui--color_text_tertiary_alpha--hover: rgba(255, 255, 255, 0.54);
+	--vkui--color_text_tertiary_alpha--active: rgba(255, 255, 255, 0.58);
 }

package/themes/legoIOSDark/cssVars/theme/fallbacks/index.css CHANGED Viewed

@@ -10,7 +10,10 @@
 	--vkui--elevation2: var(--vkui--elevation2, 0px 4px 8px 0px rgba(0, 0, 0, 0.15), 0px 0px 4px 0px rgba(0, 0, 0, 0.20));
 	--vkui--elevation3: var(--vkui--elevation3, 0px 0px 2px 0px rgba(0, 0, 0, 0.30), 0px 4px 16px 0px rgba(0, 0, 0, 0.30));
 	--vkui--elevation4: var(--vkui--elevation4, 0px 0px 8px 0px rgba(0, 0, 0, 0.10), 0px 16px 16px 0px rgba(0, 0, 0, 0.20));
+	--vkui--blur_s: var(--vkui--blur_s, 8px);
 	--vkui--blur_m: var(--vkui--blur_m, 16px);
+	--vkui--blur_l: var(--vkui--blur_l, 48px);
+	--vkui--blur_x_l: var(--vkui--blur_x_l, 96px);
 	--vkui--font_family_fallbacks: var(--vkui--font_family_fallbacks, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
 	--vkui--font_family_accent: var(--vkui--font_family_accent, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
 	--vkui--font_family_base: var(--vkui--font_family_base, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
@@ -241,6 +244,14 @@
 	--vkui--font_body--line_height--regular: var(--vkui--font_body--line_height--regular, 21px);
 	--vkui--font_body--font_weight--regular: var(--vkui--font_body--font_weight--regular, 520);
 	--vkui--font_body--font_variation_settings--optical_size--regular: var(--vkui--font_body--font_variation_settings--optical_size--regular, 21.5);
+	--vkui--font_text_bold--font_size--regular: var(--vkui--font_text_bold--font_size--regular, 16px);
+	--vkui--font_text_bold--line_height--regular: var(--vkui--font_text_bold--line_height--regular, 18.5px);
+	--vkui--font_text_bold--font_weight--regular: var(--vkui--font_text_bold--font_weight--regular, 700);
+	--vkui--font_text_bold--font_variation_settings--optical_size--regular: var(--vkui--font_text_bold--font_variation_settings--optical_size--regular, 21.8);
+	--vkui--font_footnote_bold--font_size--regular: var(--vkui--font_footnote_bold--font_size--regular, 13.5px);
+	--vkui--font_footnote_bold--line_height--regular: var(--vkui--font_footnote_bold--line_height--regular, 15px);
+	--vkui--font_footnote_bold--font_weight--regular: var(--vkui--font_footnote_bold--font_weight--regular, 700);
+	--vkui--font_footnote_bold--font_variation_settings--optical_size--regular: var(--vkui--font_footnote_bold--font_variation_settings--optical_size--regular, 22.2);
 	--vkui--font_headline--font_size--regular: var(--vkui--font_headline--font_size--regular, 17px);
 	--vkui--font_headline--line_height--regular: var(--vkui--font_headline--line_height--regular, 20px);
 	--vkui--font_headline--font_family--regular: var(--vkui--font_headline--font_family--regular, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
@@ -291,15 +302,15 @@
 	--vkui--color_background_contrast: var(--vkui--color_background_contrast, #FFFFFF);
 	--vkui--color_background_contrast--hover: var(--vkui--color_background_contrast--hover, #EBEDF0);
 	--vkui--color_background_contrast--active: var(--vkui--color_background_contrast--active, #D7D8DB);
-	--vkui--color_background_contrast_secondary_alpha: var(--vkui--color_background_contrast_secondary_alpha, rgba(255, 255, 255, 0.2));
+	--vkui--color_background_contrast_secondary_alpha: var(--vkui--color_background_contrast_secondary_alpha, #ffffff33);
 	--vkui--color_background_contrast_secondary_alpha--hover: var(--vkui--color_background_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.24));
 	--vkui--color_background_contrast_secondary_alpha--active: var(--vkui--color_background_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.28));
 	--vkui--color_background_contrast_inverse: var(--vkui--color_background_contrast_inverse, #000000);
 	--vkui--color_background_contrast_inverse--hover: var(--vkui--color_background_contrast_inverse--hover, #0A0A0A);
 	--vkui--color_background_contrast_inverse--active: var(--vkui--color_background_contrast_inverse--active, #141414);
-	--vkui--color_background_contrast_themed: var(--vkui--color_background_contrast_themed, #000000);
-	--vkui--color_background_contrast_themed--hover: var(--vkui--color_background_contrast_themed--hover, #0A0A0A);
-	--vkui--color_background_contrast_themed--active: var(--vkui--color_background_contrast_themed--active, #141414);
+	--vkui--color_background_contrast_themed: var(--vkui--color_background_contrast_themed, #1e1e1c);
+	--vkui--color_background_contrast_themed--hover: var(--vkui--color_background_contrast_themed--hover, #272725);
+	--vkui--color_background_contrast_themed--active: var(--vkui--color_background_contrast_themed--active, #30302E);
 	--vkui--color_background_modal: var(--vkui--color_background_modal, #000000);
 	--vkui--color_background_modal--hover: var(--vkui--color_background_modal--hover, #0A0A0A);
 	--vkui--color_background_modal--active: var(--vkui--color_background_modal--active, #141414);
@@ -315,7 +326,7 @@
 	--vkui--color_background_warning: var(--vkui--color_background_warning, #483416);
 	--vkui--color_background_warning--hover: var(--vkui--color_background_warning--hover, #4F3C1F);
 	--vkui--color_background_warning--active: var(--vkui--color_background_warning--active, #574429);
-	--vkui--color_background_negative: var(--vkui--color_background_negative, #FD6571);
+	--vkui--color_background_negative: var(--vkui--color_background_negative, #fd6571);
 	--vkui--color_background_negative--hover: var(--vkui--color_background_negative--hover, #FD6B77);
 	--vkui--color_background_negative--active: var(--vkui--color_background_negative--active, #FD717C);
 	--vkui--color_background_negative_tint: var(--vkui--color_background_negative_tint, #4b2727);
@@ -366,7 +377,7 @@
 	--vkui--color_text_positive: var(--vkui--color_text_positive, #34c759);
 	--vkui--color_text_positive--hover: var(--vkui--color_text_positive--hover, #3CC960);
 	--vkui--color_text_positive--active: var(--vkui--color_text_positive--active, #44CB66);
-	--vkui--color_text_negative: var(--vkui--color_text_negative, #FD6571);
+	--vkui--color_text_negative: var(--vkui--color_text_negative, #fd6571);
 	--vkui--color_text_negative--hover: var(--vkui--color_text_negative--hover, #FD6B77);
 	--vkui--color_text_negative--active: var(--vkui--color_text_negative--active, #FD717C);
 	--vkui--color_text_link: var(--vkui--color_text_link, #2e90ff);
@@ -432,7 +443,7 @@
 	--vkui--color_icon_warning: var(--vkui--color_icon_warning, #ff6900);
 	--vkui--color_icon_warning--hover: var(--vkui--color_icon_warning--hover, #FF6F0A);
 	--vkui--color_icon_warning--active: var(--vkui--color_icon_warning--active, #FF7514);
-	--vkui--color_icon_negative: var(--vkui--color_icon_negative, #FD6571);
+	--vkui--color_icon_negative: var(--vkui--color_icon_negative, #fd6571);
 	--vkui--color_icon_negative--hover: var(--vkui--color_icon_negative--hover, #FD6B77);
 	--vkui--color_icon_negative--active: var(--vkui--color_icon_negative--active, #FD717C);
 	--vkui--color_stroke_accent: var(--vkui--color_stroke_accent, #529ef4);
@@ -459,7 +470,7 @@
 	--vkui--color_stroke_positive: var(--vkui--color_stroke_positive, #34c759);
 	--vkui--color_stroke_positive--hover: var(--vkui--color_stroke_positive--hover, #3CC960);
 	--vkui--color_stroke_positive--active: var(--vkui--color_stroke_positive--active, #44CB66);
-	--vkui--color_stroke_negative: var(--vkui--color_stroke_negative, #FD6571);
+	--vkui--color_stroke_negative: var(--vkui--color_stroke_negative, #fd6571);
 	--vkui--color_stroke_negative--hover: var(--vkui--color_stroke_negative--hover, #FD6B77);
 	--vkui--color_stroke_negative--active: var(--vkui--color_stroke_negative--active, #FD717C);
 	--vkui--color_stroke_contrast: var(--vkui--color_stroke_contrast, #FFFFFF);
@@ -585,15 +596,18 @@
 	--vkui--color_tabbar_text_inactive: var(--vkui--color_tabbar_text_inactive, #76787a);
 	--vkui--color_tabbar_text_inactive--hover: var(--vkui--color_tabbar_text_inactive--hover, #7B7D7F);
 	--vkui--color_tabbar_text_inactive--active: var(--vkui--color_tabbar_text_inactive--active, #818385);
-	--vkui--color_transparent: var(--vkui--color_transparent, #00000000);
-	--vkui--color_transparent--hover: var(--vkui--color_transparent--hover, rgba(0, 0, 0, 0.04));
-	--vkui--color_transparent--active: var(--vkui--color_transparent--active, rgba(0, 0, 0, 0.08));
+	--vkui--color_transparent: var(--vkui--color_transparent, transparent);
+	--vkui--color_transparent--hover: var(--vkui--color_transparent--hover, rgba(255, 255, 255, 0.04));
+	--vkui--color_transparent--active: var(--vkui--color_transparent--active, rgba(255, 255, 255, 0.08));
 	--vkui--color_background_inverse: var(--vkui--color_background_inverse, #FFFFFF);
 	--vkui--color_background_inverse--hover: var(--vkui--color_background_inverse--hover, #EBEDF0);
 	--vkui--color_background_inverse--active: var(--vkui--color_background_inverse--active, #D7D8DB);
-	--vkui--color_stroke_contrast_secondary_alpha: var(--vkui--color_stroke_contrast_secondary_alpha, #ffffff1f);
+	--vkui--color_stroke_contrast_secondary_alpha: var(--vkui--color_stroke_contrast_secondary_alpha, #ffffff1e);
 	--vkui--color_stroke_contrast_secondary_alpha--hover: var(--vkui--color_stroke_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.16));
 	--vkui--color_stroke_contrast_secondary_alpha--active: var(--vkui--color_stroke_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.2));
+	--vkui--color_text_tertiary_alpha: var(--vkui--color_text_tertiary_alpha, #ffffff7f);
+	--vkui--color_text_tertiary_alpha--hover: var(--vkui--color_text_tertiary_alpha--hover, rgba(255, 255, 255, 0.54));
+	--vkui--color_text_tertiary_alpha--active: var(--vkui--color_text_tertiary_alpha--active, rgba(255, 255, 255, 0.58));
 }
 .vkui--font_display_title1--regular {
@@ -882,6 +896,22 @@
 	font-weight: var(--vkui--font_body--font_weight--regular, 520);
 	font-weight: var(--vkui--font_body--font_weight--regular, var(--vkui--font_body--font_weight--regular, 520));
 }
+.vkui--font_text_bold--regular {
+	font-size: var(--vkui--font_text_bold--font_size--regular, 16px);
+	font-size: var(--vkui--font_text_bold--font_size--regular, var(--vkui--font_text_bold--font_size--regular, 16px));
+	line-height: var(--vkui--font_text_bold--line_height--regular, 18.5px);
+	line-height: var(--vkui--font_text_bold--line_height--regular, var(--vkui--font_text_bold--line_height--regular, 18.5px));
+	font-weight: var(--vkui--font_text_bold--font_weight--regular, 700);
+	font-weight: var(--vkui--font_text_bold--font_weight--regular, var(--vkui--font_text_bold--font_weight--regular, 700));
+}
+.vkui--font_footnote_bold--regular {
+	font-size: var(--vkui--font_footnote_bold--font_size--regular, 13.5px);
+	font-size: var(--vkui--font_footnote_bold--font_size--regular, var(--vkui--font_footnote_bold--font_size--regular, 13.5px));
+	line-height: var(--vkui--font_footnote_bold--line_height--regular, 15px);
+	line-height: var(--vkui--font_footnote_bold--line_height--regular, var(--vkui--font_footnote_bold--line_height--regular, 15px));
+	font-weight: var(--vkui--font_footnote_bold--font_weight--regular, 700);
+	font-weight: var(--vkui--font_footnote_bold--font_weight--regular, var(--vkui--font_footnote_bold--font_weight--regular, 700));
+}
 .vkui--font_headline--regular {
 	font-size: var(--vkui--font_headline--font_size--regular, 17px);
 	font-size: var(--vkui--font_headline--font_size--regular, var(--vkui--font_headline--font_size--regular, 17px));

package/themes/legoIOSDark/cssVars/theme/fallbacks/index.less CHANGED Viewed

@@ -9,7 +9,10 @@
 @elevation2: var(--vkui--elevation2, 0px 4px 8px 0px rgba(0, 0, 0, 0.15), 0px 0px 4px 0px rgba(0, 0, 0, 0.20));
 @elevation3: var(--vkui--elevation3, 0px 0px 2px 0px rgba(0, 0, 0, 0.30), 0px 4px 16px 0px rgba(0, 0, 0, 0.30));
 @elevation4: var(--vkui--elevation4, 0px 0px 8px 0px rgba(0, 0, 0, 0.10), 0px 16px 16px 0px rgba(0, 0, 0, 0.20));
+@blur-s: var(--vkui--blur_s, 8px);
 @blur-m: var(--vkui--blur_m, 16px);
+@blur-l: var(--vkui--blur_l, 48px);
+@blur-x-l: var(--vkui--blur_x_l, 96px);
 @font-family-fallbacks: var(--vkui--font_family_fallbacks, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
 @font-family-accent: var(--vkui--font_family_accent, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
 @font-family-base: var(--vkui--font_family_base, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
@@ -167,15 +170,15 @@
 @color-background-contrast: var(--vkui--color_background_contrast, #FFFFFF);
 @color-background-contrast--hover: var(--vkui--color_background_contrast--hover, #EBEDF0);
 @color-background-contrast--active: var(--vkui--color_background_contrast--active, #D7D8DB);
-@color-background-contrast-secondary-alpha: var(--vkui--color_background_contrast_secondary_alpha, rgba(255, 255, 255, 0.2));
+@color-background-contrast-secondary-alpha: var(--vkui--color_background_contrast_secondary_alpha, #ffffff33);
 @color-background-contrast-secondary-alpha--hover: var(--vkui--color_background_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.24));
 @color-background-contrast-secondary-alpha--active: var(--vkui--color_background_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.28));
 @color-background-contrast-inverse: var(--vkui--color_background_contrast_inverse, #000000);
 @color-background-contrast-inverse--hover: var(--vkui--color_background_contrast_inverse--hover, #0A0A0A);
 @color-background-contrast-inverse--active: var(--vkui--color_background_contrast_inverse--active, #141414);
-@color-background-contrast-themed: var(--vkui--color_background_contrast_themed, #000000);
-@color-background-contrast-themed--hover: var(--vkui--color_background_contrast_themed--hover, #0A0A0A);
-@color-background-contrast-themed--active: var(--vkui--color_background_contrast_themed--active, #141414);
+@color-background-contrast-themed: var(--vkui--color_background_contrast_themed, #1e1e1c);
+@color-background-contrast-themed--hover: var(--vkui--color_background_contrast_themed--hover, #272725);
+@color-background-contrast-themed--active: var(--vkui--color_background_contrast_themed--active, #30302E);
 @color-background-modal: var(--vkui--color_background_modal, #000000);
 @color-background-modal--hover: var(--vkui--color_background_modal--hover, #0A0A0A);
 @color-background-modal--active: var(--vkui--color_background_modal--active, #141414);
@@ -191,7 +194,7 @@
 @color-background-warning: var(--vkui--color_background_warning, #483416);
 @color-background-warning--hover: var(--vkui--color_background_warning--hover, #4F3C1F);
 @color-background-warning--active: var(--vkui--color_background_warning--active, #574429);
-@color-background-negative: var(--vkui--color_background_negative, #FD6571);
+@color-background-negative: var(--vkui--color_background_negative, #fd6571);
 @color-background-negative--hover: var(--vkui--color_background_negative--hover, #FD6B77);
 @color-background-negative--active: var(--vkui--color_background_negative--active, #FD717C);
 @color-background-negative-tint: var(--vkui--color_background_negative_tint, #4b2727);
@@ -242,7 +245,7 @@
 @color-text-positive: var(--vkui--color_text_positive, #34c759);
 @color-text-positive--hover: var(--vkui--color_text_positive--hover, #3CC960);
 @color-text-positive--active: var(--vkui--color_text_positive--active, #44CB66);
-@color-text-negative: var(--vkui--color_text_negative, #FD6571);
+@color-text-negative: var(--vkui--color_text_negative, #fd6571);
 @color-text-negative--hover: var(--vkui--color_text_negative--hover, #FD6B77);
 @color-text-negative--active: var(--vkui--color_text_negative--active, #FD717C);
 @color-text-link: var(--vkui--color_text_link, #2e90ff);
@@ -308,7 +311,7 @@
 @color-icon-warning: var(--vkui--color_icon_warning, #ff6900);
 @color-icon-warning--hover: var(--vkui--color_icon_warning--hover, #FF6F0A);
 @color-icon-warning--active: var(--vkui--color_icon_warning--active, #FF7514);
-@color-icon-negative: var(--vkui--color_icon_negative, #FD6571);
+@color-icon-negative: var(--vkui--color_icon_negative, #fd6571);
 @color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #FD6B77);
 @color-icon-negative--active: var(--vkui--color_icon_negative--active, #FD717C);
 @color-stroke-accent: var(--vkui--color_stroke_accent, #529ef4);
@@ -335,7 +338,7 @@
 @color-stroke-positive: var(--vkui--color_stroke_positive, #34c759);
 @color-stroke-positive--hover: var(--vkui--color_stroke_positive--hover, #3CC960);
 @color-stroke-positive--active: var(--vkui--color_stroke_positive--active, #44CB66);
-@color-stroke-negative: var(--vkui--color_stroke_negative, #FD6571);
+@color-stroke-negative: var(--vkui--color_stroke_negative, #fd6571);
 @color-stroke-negative--hover: var(--vkui--color_stroke_negative--hover, #FD6B77);
 @color-stroke-negative--active: var(--vkui--color_stroke_negative--active, #FD717C);
 @color-stroke-contrast: var(--vkui--color_stroke_contrast, #FFFFFF);
@@ -461,15 +464,18 @@
 @color-tabbar-text-inactive: var(--vkui--color_tabbar_text_inactive, #76787a);
 @color-tabbar-text-inactive--hover: var(--vkui--color_tabbar_text_inactive--hover, #7B7D7F);
 @color-tabbar-text-inactive--active: var(--vkui--color_tabbar_text_inactive--active, #818385);
-@color-transparent: var(--vkui--color_transparent, #00000000);
-@color-transparent--hover: var(--vkui--color_transparent--hover, rgba(0, 0, 0, 0.04));
-@color-transparent--active: var(--vkui--color_transparent--active, rgba(0, 0, 0, 0.08));
+@color-transparent: var(--vkui--color_transparent, transparent);
+@color-transparent--hover: var(--vkui--color_transparent--hover, rgba(255, 255, 255, 0.04));
+@color-transparent--active: var(--vkui--color_transparent--active, rgba(255, 255, 255, 0.08));
 @color-background-inverse: var(--vkui--color_background_inverse, #FFFFFF);
 @color-background-inverse--hover: var(--vkui--color_background_inverse--hover, #EBEDF0);
 @color-background-inverse--active: var(--vkui--color_background_inverse--active, #D7D8DB);
-@color-stroke-contrast-secondary-alpha: var(--vkui--color_stroke_contrast_secondary_alpha, #ffffff1f);
+@color-stroke-contrast-secondary-alpha: var(--vkui--color_stroke_contrast_secondary_alpha, #ffffff1e);
 @color-stroke-contrast-secondary-alpha--hover: var(--vkui--color_stroke_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.16));
 @color-stroke-contrast-secondary-alpha--active: var(--vkui--color_stroke_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.2));
+@color-text-tertiary-alpha: var(--vkui--color_text_tertiary_alpha, #ffffff7f);
+@color-text-tertiary-alpha--hover: var(--vkui--color_text_tertiary_alpha--hover, rgba(255, 255, 255, 0.54));
+@color-text-tertiary-alpha--active: var(--vkui--color_text_tertiary_alpha--active, rgba(255, 255, 255, 0.58));
 .font-display-title1--regular {
@@ -643,6 +649,16 @@
 	line-height: var(--vkui--font_body--line_height--regular, 21px);
 	font-weight: var(--vkui--font_body--font_weight--regular, 520);
 }
+.font-text-bold--regular {
+	font-size: var(--vkui--font_text_bold--font_size--regular, 16px);
+	line-height: var(--vkui--font_text_bold--line_height--regular, 18.5px);
+	font-weight: var(--vkui--font_text_bold--font_weight--regular, 700);
+}
+.font-footnote-bold--regular {
+	font-size: var(--vkui--font_footnote_bold--font_size--regular, 13.5px);
+	line-height: var(--vkui--font_footnote_bold--line_height--regular, 15px);
+	font-weight: var(--vkui--font_footnote_bold--font_weight--regular, 700);
+}
 .font-headline--regular {
 	font-size: var(--vkui--font_headline--font_size--regular, 17px);
 	line-height: var(--vkui--font_headline--line_height--regular, 20px);

package/themes/legoIOSDark/cssVars/theme/fallbacks/index.pcss CHANGED Viewed

@@ -10,7 +10,10 @@
 	--elevation2: var(--vkui--elevation2, 0px 4px 8px 0px rgba(0, 0, 0, 0.15), 0px 0px 4px 0px rgba(0, 0, 0, 0.20));
 	--elevation3: var(--vkui--elevation3, 0px 0px 2px 0px rgba(0, 0, 0, 0.30), 0px 4px 16px 0px rgba(0, 0, 0, 0.30));
 	--elevation4: var(--vkui--elevation4, 0px 0px 8px 0px rgba(0, 0, 0, 0.10), 0px 16px 16px 0px rgba(0, 0, 0, 0.20));
+	--blur-s: var(--vkui--blur_s, 8px);
 	--blur-m: var(--vkui--blur_m, 16px);
+	--blur-l: var(--vkui--blur_l, 48px);
+	--blur-x-l: var(--vkui--blur_x_l, 96px);
 	--font-family-fallbacks: var(--vkui--font_family_fallbacks, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
 	--font-family-accent: var(--vkui--font_family_accent, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
 	--font-family-base: var(--vkui--font_family_base, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
@@ -168,15 +171,15 @@
 	--color-background-contrast: var(--vkui--color_background_contrast, #FFFFFF);
 	--color-background-contrast--hover: var(--vkui--color_background_contrast--hover, #EBEDF0);
 	--color-background-contrast--active: var(--vkui--color_background_contrast--active, #D7D8DB);
-	--color-background-contrast-secondary-alpha: var(--vkui--color_background_contrast_secondary_alpha, rgba(255, 255, 255, 0.2));
+	--color-background-contrast-secondary-alpha: var(--vkui--color_background_contrast_secondary_alpha, #ffffff33);
 	--color-background-contrast-secondary-alpha--hover: var(--vkui--color_background_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.24));
 	--color-background-contrast-secondary-alpha--active: var(--vkui--color_background_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.28));
 	--color-background-contrast-inverse: var(--vkui--color_background_contrast_inverse, #000000);
 	--color-background-contrast-inverse--hover: var(--vkui--color_background_contrast_inverse--hover, #0A0A0A);
 	--color-background-contrast-inverse--active: var(--vkui--color_background_contrast_inverse--active, #141414);
-	--color-background-contrast-themed: var(--vkui--color_background_contrast_themed, #000000);
-	--color-background-contrast-themed--hover: var(--vkui--color_background_contrast_themed--hover, #0A0A0A);
-	--color-background-contrast-themed--active: var(--vkui--color_background_contrast_themed--active, #141414);
+	--color-background-contrast-themed: var(--vkui--color_background_contrast_themed, #1e1e1c);
+	--color-background-contrast-themed--hover: var(--vkui--color_background_contrast_themed--hover, #272725);
+	--color-background-contrast-themed--active: var(--vkui--color_background_contrast_themed--active, #30302E);
 	--color-background-modal: var(--vkui--color_background_modal, #000000);
 	--color-background-modal--hover: var(--vkui--color_background_modal--hover, #0A0A0A);
 	--color-background-modal--active: var(--vkui--color_background_modal--active, #141414);
@@ -192,7 +195,7 @@
 	--color-background-warning: var(--vkui--color_background_warning, #483416);
 	--color-background-warning--hover: var(--vkui--color_background_warning--hover, #4F3C1F);
 	--color-background-warning--active: var(--vkui--color_background_warning--active, #574429);
-	--color-background-negative: var(--vkui--color_background_negative, #FD6571);
+	--color-background-negative: var(--vkui--color_background_negative, #fd6571);
 	--color-background-negative--hover: var(--vkui--color_background_negative--hover, #FD6B77);
 	--color-background-negative--active: var(--vkui--color_background_negative--active, #FD717C);
 	--color-background-negative-tint: var(--vkui--color_background_negative_tint, #4b2727);
@@ -243,7 +246,7 @@
 	--color-text-positive: var(--vkui--color_text_positive, #34c759);
 	--color-text-positive--hover: var(--vkui--color_text_positive--hover, #3CC960);
 	--color-text-positive--active: var(--vkui--color_text_positive--active, #44CB66);
-	--color-text-negative: var(--vkui--color_text_negative, #FD6571);
+	--color-text-negative: var(--vkui--color_text_negative, #fd6571);
 	--color-text-negative--hover: var(--vkui--color_text_negative--hover, #FD6B77);
 	--color-text-negative--active: var(--vkui--color_text_negative--active, #FD717C);
 	--color-text-link: var(--vkui--color_text_link, #2e90ff);
@@ -309,7 +312,7 @@
 	--color-icon-warning: var(--vkui--color_icon_warning, #ff6900);
 	--color-icon-warning--hover: var(--vkui--color_icon_warning--hover, #FF6F0A);
 	--color-icon-warning--active: var(--vkui--color_icon_warning--active, #FF7514);
-	--color-icon-negative: var(--vkui--color_icon_negative, #FD6571);
+	--color-icon-negative: var(--vkui--color_icon_negative, #fd6571);
 	--color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #FD6B77);
 	--color-icon-negative--active: var(--vkui--color_icon_negative--active, #FD717C);
 	--color-stroke-accent: var(--vkui--color_stroke_accent, #529ef4);
@@ -336,7 +339,7 @@
 	--color-stroke-positive: var(--vkui--color_stroke_positive, #34c759);
 	--color-stroke-positive--hover: var(--vkui--color_stroke_positive--hover, #3CC960);
 	--color-stroke-positive--active: var(--vkui--color_stroke_positive--active, #44CB66);
-	--color-stroke-negative: var(--vkui--color_stroke_negative, #FD6571);
+	--color-stroke-negative: var(--vkui--color_stroke_negative, #fd6571);
 	--color-stroke-negative--hover: var(--vkui--color_stroke_negative--hover, #FD6B77);
 	--color-stroke-negative--active: var(--vkui--color_stroke_negative--active, #FD717C);
 	--color-stroke-contrast: var(--vkui--color_stroke_contrast, #FFFFFF);
@@ -462,15 +465,18 @@
 	--color-tabbar-text-inactive: var(--vkui--color_tabbar_text_inactive, #76787a);
 	--color-tabbar-text-inactive--hover: var(--vkui--color_tabbar_text_inactive--hover, #7B7D7F);
 	--color-tabbar-text-inactive--active: var(--vkui--color_tabbar_text_inactive--active, #818385);
-	--color-transparent: var(--vkui--color_transparent, #00000000);
-	--color-transparent--hover: var(--vkui--color_transparent--hover, rgba(0, 0, 0, 0.04));
-	--color-transparent--active: var(--vkui--color_transparent--active, rgba(0, 0, 0, 0.08));
+	--color-transparent: var(--vkui--color_transparent, transparent);
+	--color-transparent--hover: var(--vkui--color_transparent--hover, rgba(255, 255, 255, 0.04));
+	--color-transparent--active: var(--vkui--color_transparent--active, rgba(255, 255, 255, 0.08));
 	--color-background-inverse: var(--vkui--color_background_inverse, #FFFFFF);
 	--color-background-inverse--hover: var(--vkui--color_background_inverse--hover, #EBEDF0);
 	--color-background-inverse--active: var(--vkui--color_background_inverse--active, #D7D8DB);
-	--color-stroke-contrast-secondary-alpha: var(--vkui--color_stroke_contrast_secondary_alpha, #ffffff1f);
+	--color-stroke-contrast-secondary-alpha: var(--vkui--color_stroke_contrast_secondary_alpha, #ffffff1e);
 	--color-stroke-contrast-secondary-alpha--hover: var(--vkui--color_stroke_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.16));
 	--color-stroke-contrast-secondary-alpha--active: var(--vkui--color_stroke_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.2));
+	--color-text-tertiary-alpha: var(--vkui--color_text_tertiary_alpha, #ffffff7f);
+	--color-text-tertiary-alpha--hover: var(--vkui--color_text_tertiary_alpha--hover, rgba(255, 255, 255, 0.54));
+	--color-text-tertiary-alpha--active: var(--vkui--color_text_tertiary_alpha--active, rgba(255, 255, 255, 0.58));
 }
 %font-display-title1--regular {
@@ -644,6 +650,16 @@
 	line-height: var(--vkui--font_body--line_height--regular, 21px);
 	font-weight: var(--vkui--font_body--font_weight--regular, 520);
 }
+%font-text-bold--regular {
+	font-size: var(--vkui--font_text_bold--font_size--regular, 16px);
+	line-height: var(--vkui--font_text_bold--line_height--regular, 18.5px);
+	font-weight: var(--vkui--font_text_bold--font_weight--regular, 700);
+}
+%font-footnote-bold--regular {
+	font-size: var(--vkui--font_footnote_bold--font_size--regular, 13.5px);
+	line-height: var(--vkui--font_footnote_bold--line_height--regular, 15px);
+	font-weight: var(--vkui--font_footnote_bold--font_weight--regular, 700);
+}
 %font-headline--regular {
 	font-size: var(--vkui--font_headline--font_size--regular, 17px);
 	line-height: var(--vkui--font_headline--line_height--regular, 20px);

package/themes/legoIOSDark/cssVars/theme/fallbacks/index.scss CHANGED Viewed

@@ -9,7 +9,10 @@ $elevation1-invert-y: var(--vkui--elevation1_invert_y, 0px 0px 2px 0px rgba(0, 0
 $elevation2: var(--vkui--elevation2, 0px 4px 8px 0px rgba(0, 0, 0, 0.15), 0px 0px 4px 0px rgba(0, 0, 0, 0.20));
 $elevation3: var(--vkui--elevation3, 0px 0px 2px 0px rgba(0, 0, 0, 0.30), 0px 4px 16px 0px rgba(0, 0, 0, 0.30));
 $elevation4: var(--vkui--elevation4, 0px 0px 8px 0px rgba(0, 0, 0, 0.10), 0px 16px 16px 0px rgba(0, 0, 0, 0.20));
+$blur-s: var(--vkui--blur_s, 8px);
 $blur-m: var(--vkui--blur_m, 16px);
+$blur-l: var(--vkui--blur_l, 48px);
+$blur-x-l: var(--vkui--blur_x_l, 96px);
 $font-family-fallbacks: var(--vkui--font_family_fallbacks, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
 $font-family-accent: var(--vkui--font_family_accent, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
 $font-family-base: var(--vkui--font_family_base, -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif);
@@ -167,15 +170,15 @@ $color-background-tertiary-alpha--active: var(--vkui--color_background_tertiary_
 $color-background-contrast: var(--vkui--color_background_contrast, #FFFFFF);
 $color-background-contrast--hover: var(--vkui--color_background_contrast--hover, #EBEDF0);
 $color-background-contrast--active: var(--vkui--color_background_contrast--active, #D7D8DB);
-$color-background-contrast-secondary-alpha: var(--vkui--color_background_contrast_secondary_alpha, rgba(255, 255, 255, 0.2));
+$color-background-contrast-secondary-alpha: var(--vkui--color_background_contrast_secondary_alpha, #ffffff33);
 $color-background-contrast-secondary-alpha--hover: var(--vkui--color_background_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.24));
 $color-background-contrast-secondary-alpha--active: var(--vkui--color_background_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.28));
 $color-background-contrast-inverse: var(--vkui--color_background_contrast_inverse, #000000);
 $color-background-contrast-inverse--hover: var(--vkui--color_background_contrast_inverse--hover, #0A0A0A);
 $color-background-contrast-inverse--active: var(--vkui--color_background_contrast_inverse--active, #141414);
-$color-background-contrast-themed: var(--vkui--color_background_contrast_themed, #000000);
-$color-background-contrast-themed--hover: var(--vkui--color_background_contrast_themed--hover, #0A0A0A);
-$color-background-contrast-themed--active: var(--vkui--color_background_contrast_themed--active, #141414);
+$color-background-contrast-themed: var(--vkui--color_background_contrast_themed, #1e1e1c);
+$color-background-contrast-themed--hover: var(--vkui--color_background_contrast_themed--hover, #272725);
+$color-background-contrast-themed--active: var(--vkui--color_background_contrast_themed--active, #30302E);
 $color-background-modal: var(--vkui--color_background_modal, #000000);
 $color-background-modal--hover: var(--vkui--color_background_modal--hover, #0A0A0A);
 $color-background-modal--active: var(--vkui--color_background_modal--active, #141414);
@@ -191,7 +194,7 @@ $color-background-positive-tint--active: var(--vkui--color_background_positive_t
 $color-background-warning: var(--vkui--color_background_warning, #483416);
 $color-background-warning--hover: var(--vkui--color_background_warning--hover, #4F3C1F);
 $color-background-warning--active: var(--vkui--color_background_warning--active, #574429);
-$color-background-negative: var(--vkui--color_background_negative, #FD6571);
+$color-background-negative: var(--vkui--color_background_negative, #fd6571);
 $color-background-negative--hover: var(--vkui--color_background_negative--hover, #FD6B77);
 $color-background-negative--active: var(--vkui--color_background_negative--active, #FD717C);
 $color-background-negative-tint: var(--vkui--color_background_negative_tint, #4b2727);
@@ -242,7 +245,7 @@ $color-text-contrast-themed--active: var(--vkui--color_text_contrast_themed--act
 $color-text-positive: var(--vkui--color_text_positive, #34c759);
 $color-text-positive--hover: var(--vkui--color_text_positive--hover, #3CC960);
 $color-text-positive--active: var(--vkui--color_text_positive--active, #44CB66);
-$color-text-negative: var(--vkui--color_text_negative, #FD6571);
+$color-text-negative: var(--vkui--color_text_negative, #fd6571);
 $color-text-negative--hover: var(--vkui--color_text_negative--hover, #FD6B77);
 $color-text-negative--active: var(--vkui--color_text_negative--active, #FD717C);
 $color-text-link: var(--vkui--color_text_link, #2e90ff);
@@ -308,7 +311,7 @@ $color-icon-positive--active: var(--vkui--color_icon_positive--active, #44CB66);
 $color-icon-warning: var(--vkui--color_icon_warning, #ff6900);
 $color-icon-warning--hover: var(--vkui--color_icon_warning--hover, #FF6F0A);
 $color-icon-warning--active: var(--vkui--color_icon_warning--active, #FF7514);
-$color-icon-negative: var(--vkui--color_icon_negative, #FD6571);
+$color-icon-negative: var(--vkui--color_icon_negative, #fd6571);
 $color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #FD6B77);
 $color-icon-negative--active: var(--vkui--color_icon_negative--active, #FD717C);
 $color-stroke-accent: var(--vkui--color_stroke_accent, #529ef4);
@@ -335,7 +338,7 @@ $color-separator-secondary--active: var(--vkui--color_separator_secondary--activ
 $color-stroke-positive: var(--vkui--color_stroke_positive, #34c759);
 $color-stroke-positive--hover: var(--vkui--color_stroke_positive--hover, #3CC960);
 $color-stroke-positive--active: var(--vkui--color_stroke_positive--active, #44CB66);
-$color-stroke-negative: var(--vkui--color_stroke_negative, #FD6571);
+$color-stroke-negative: var(--vkui--color_stroke_negative, #fd6571);
 $color-stroke-negative--hover: var(--vkui--color_stroke_negative--hover, #FD6B77);
 $color-stroke-negative--active: var(--vkui--color_stroke_negative--active, #FD717C);
 $color-stroke-contrast: var(--vkui--color_stroke_contrast, #FFFFFF);
@@ -461,15 +464,18 @@ $color-segmented-control--active: var(--vkui--color_segmented_control--active, #
 $color-tabbar-text-inactive: var(--vkui--color_tabbar_text_inactive, #76787a);
 $color-tabbar-text-inactive--hover: var(--vkui--color_tabbar_text_inactive--hover, #7B7D7F);
 $color-tabbar-text-inactive--active: var(--vkui--color_tabbar_text_inactive--active, #818385);
-$color-transparent: var(--vkui--color_transparent, #00000000);
-$color-transparent--hover: var(--vkui--color_transparent--hover, rgba(0, 0, 0, 0.04));
-$color-transparent--active: var(--vkui--color_transparent--active, rgba(0, 0, 0, 0.08));
+$color-transparent: var(--vkui--color_transparent, transparent);
+$color-transparent--hover: var(--vkui--color_transparent--hover, rgba(255, 255, 255, 0.04));
+$color-transparent--active: var(--vkui--color_transparent--active, rgba(255, 255, 255, 0.08));
 $color-background-inverse: var(--vkui--color_background_inverse, #FFFFFF);
 $color-background-inverse--hover: var(--vkui--color_background_inverse--hover, #EBEDF0);
 $color-background-inverse--active: var(--vkui--color_background_inverse--active, #D7D8DB);
-$color-stroke-contrast-secondary-alpha: var(--vkui--color_stroke_contrast_secondary_alpha, #ffffff1f);
+$color-stroke-contrast-secondary-alpha: var(--vkui--color_stroke_contrast_secondary_alpha, #ffffff1e);
 $color-stroke-contrast-secondary-alpha--hover: var(--vkui--color_stroke_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.16));
 $color-stroke-contrast-secondary-alpha--active: var(--vkui--color_stroke_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.2));
+$color-text-tertiary-alpha: var(--vkui--color_text_tertiary_alpha, #ffffff7f);
+$color-text-tertiary-alpha--hover: var(--vkui--color_text_tertiary_alpha--hover, rgba(255, 255, 255, 0.54));
+$color-text-tertiary-alpha--active: var(--vkui--color_text_tertiary_alpha--active, rgba(255, 255, 255, 0.58));
 @mixin font-display-title1--regular() {
@@ -857,6 +863,28 @@ $font-body--regular--map: (
 	'fontWeight': "var(--vkui--font_body--font_weight--regular, 520)",
 	'fontVariationSettings.opticalSize': "var(--vkui--font_body--font_variation_settings--optical_size--regular, 21.5)",
 );
+@mixin font-text-bold--regular() {
+	font-size: var(--vkui--font_text_bold--font_size--regular, 16px);
+	line-height: var(--vkui--font_text_bold--line_height--regular, 18.5px);
+	font-weight: var(--vkui--font_text_bold--font_weight--regular, 700);
+}
+$font-text-bold--regular--map: (
+	'fontSize': "var(--vkui--font_text_bold--font_size--regular, 16px)",
+	'lineHeight': "var(--vkui--font_text_bold--line_height--regular, 18.5px)",
+	'fontWeight': "var(--vkui--font_text_bold--font_weight--regular, 700)",
+	'fontVariationSettings.opticalSize': "var(--vkui--font_text_bold--font_variation_settings--optical_size--regular, 21.8)",
+);
+@mixin font-footnote-bold--regular() {
+	font-size: var(--vkui--font_footnote_bold--font_size--regular, 13.5px);
+	line-height: var(--vkui--font_footnote_bold--line_height--regular, 15px);
+	font-weight: var(--vkui--font_footnote_bold--font_weight--regular, 700);
+}
+$font-footnote-bold--regular--map: (
+	'fontSize': "var(--vkui--font_footnote_bold--font_size--regular, 13.5px)",
+	'lineHeight': "var(--vkui--font_footnote_bold--line_height--regular, 15px)",
+	'fontWeight': "var(--vkui--font_footnote_bold--font_weight--regular, 700)",
+	'fontVariationSettings.opticalSize': "var(--vkui--font_footnote_bold--font_variation_settings--optical_size--regular, 22.2)",
+);
 @mixin font-headline--regular() {
 	font-size: var(--vkui--font_headline--font_size--regular, 17px);
 	line-height: var(--vkui--font_headline--line_height--regular, 20px);