npm - @vkontakte/vkui-tokens - Versions diffs - 4.87.0 → 4.89.0 - Mend

@vkontakte/vkui-tokens 4.87.0 → 4.89.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 (318) hide show

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

@@ -7,8 +7,8 @@
 @elevation4: var(--vkui--elevation4, 0px 0px 8px rgba(0, 0, 0, 0.12), 0px 16px 16px rgba(0, 0, 0, 0.16));
 @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);
+@blur-l: var(--vkui--blur_l, 32px);
+@blur-x-l: var(--vkui--blur_x_l, 64px);
 @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);
@@ -31,19 +31,14 @@
 @size-border-radius-paper--regular: var(--vkui--size_border_radius_paper--regular, 12px);
 @size-border-radius-promo--regular: var(--vkui--size_border_radius_promo--regular, 20px);
 @size-cell-height--regular: var(--vkui--size_cell_height--regular, 52px);
-@size-cell-height--compact: var(--vkui--size_cell_height--compact, 48px);
 @size-field-height--regular: var(--vkui--size_field_height--regular, 44px);
 @size-field-height--compact: var(--vkui--size_field_height--compact, 36px);
 @size-search-height--regular: var(--vkui--size_search_height--regular, 36px);
 @size-search-height--compact: var(--vkui--size_search_height--compact, 32px);
 @size-button-extra-small-height--regular: var(--vkui--size_button_extra_small_height--regular, 28px);
-@size-button-extra-small-height--compact: var(--vkui--size_button_extra_small_height--compact, 24px);
-@size-button-small-height--regular: var(--vkui--size_button_small_height--regular, 36px);
-@size-button-small-height--compact: var(--vkui--size_button_small_height--compact, 32px);
-@size-button-medium-height--regular: var(--vkui--size_button_medium_height--regular, 44px);
-@size-button-medium-height--compact: var(--vkui--size_button_medium_height--compact, 36px);
+@size-button-small-height--regular: var(--vkui--size_button_small_height--regular, 28px);
+@size-button-medium-height--regular: var(--vkui--size_button_medium_height--regular, 38px);
 @size-button-large-height--regular: var(--vkui--size_button_large_height--regular, 52px);
-@size-button-large-height--compact: var(--vkui--size_button_large_height--compact, 44px);
 @size-checkbox--regular: var(--vkui--size_checkbox--regular, 16px);
 @size-arrow--regular: var(--vkui--size_arrow--regular, 8px);
 @size-arrow-promo--regular: var(--vkui--size_arrow_promo--regular, 40px);
@@ -69,7 +64,6 @@
 @size-card-border-radius--regular: var(--vkui--size_card_border_radius--regular, 8px);
 @size-cardgrid-padding-vertical--regular: var(--vkui--size_cardgrid_padding_vertical--regular, 8px);
 @size-base-padding-horizontal--regular: var(--vkui--size_base_padding_horizontal--regular, 16px);
-@size-base-padding-horizontal--compact: var(--vkui--size_base_padding_horizontal--compact, 16px);
 @size-base-padding-vertical--regular: var(--vkui--size_base_padding_vertical--regular, 12px);
 @size-button-group-gap-space--regular: var(--vkui--size_button_group_gap_space--regular, 1px);
 @size-button-group-gap-small--regular: var(--vkui--size_button_group_gap_small--regular, 8px);
@@ -134,6 +128,12 @@
 @radius-x-l: var(--vkui--radius_x_l, 20px);
 @radius-2x-l: var(--vkui--radius_2x_l, 24px);
 @radius-3x-l: var(--vkui--radius_3x_l, 32px);
+@animation-easing-linear: var(--vkui--animation_easing_linear, cubic-bezier(0, 0, 1, 1));
+@animation-easing-in-smooth: var(--vkui--animation_easing_in_smooth, cubic-bezier(1, 0, 0.7, 1));
+@animation-easing-out-smooth: var(--vkui--animation_easing_out_smooth, cubic-bezier(0.3, 0, 0, 1));
+@animation-easing-in-out-smooth: var(--vkui--animation_easing_in_out_smooth, cubic-bezier(0.3, 0, 0.7, 1));
+@animation-easing-out-sharp: var(--vkui--animation_easing_out_sharp, cubic-bezier(0.2, 0, 0, 1));
+@animation-easing-in-out-sharp: var(--vkui--animation_easing_in_out_sharp, cubic-bezier(0.7, 0, 0.3, 1));
 @gradient-black: var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%);
 @gradient-white: var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%);
 @gradient-tint: var(--vkui--gradient_tint, rgba(247, 247, 247, 0) 0%, rgba(247, 247, 247, 0.05) 15%, rgba(247, 247, 247, 0.2) 30%, rgba(247, 247, 247, 0.8) 70%, rgba(247, 247, 247, 0.95) 85%, var(--vkui--color_background_tertiary, rgba(247, 247, 247, 1)) 100%);
@@ -200,9 +200,9 @@
 @color-background-content-inverse: var(--vkui--color_background_content_inverse, #19191A);
 @color-background-content-inverse--hover: var(--vkui--color_background_content_inverse--hover, #18191B);
 @color-background-content-inverse--active: var(--vkui--color_background_content_inverse--active, #17181D);
-@color-background-secondary: var(--vkui--color_background_secondary, #f7f7f7);
-@color-background-secondary--hover: var(--vkui--color_background_secondary--hover, #EDEEF0);
-@color-background-secondary--active: var(--vkui--color_background_secondary--active, #E3E5E8);
+@color-background-secondary: var(--vkui--color_background_secondary, #f2f2f2);
+@color-background-secondary--hover: var(--vkui--color_background_secondary--hover, #E8E9EB);
+@color-background-secondary--active: var(--vkui--color_background_secondary--active, #DFE0E4);
 @color-background-secondary-alpha: var(--vkui--color_background_secondary_alpha, rgba(0, 0, 0, 0.04));
 @color-background-secondary-alpha--hover: var(--vkui--color_background_secondary_alpha--hover, rgba(0, 0, 0, 0.08));
 @color-background-secondary-alpha--active: var(--vkui--color_background_secondary_alpha--active, rgba(0, 0, 0, 0.12));
@@ -293,12 +293,12 @@
 @color-text-negative: var(--vkui--color_text_negative, #f65460);
 @color-text-negative--hover: var(--vkui--color_text_negative--hover, #EC515F);
 @color-text-negative--active: var(--vkui--color_text_negative--active, #E24F5D);
-@color-text-link: var(--vkui--color_text_link, #2e90ff);
-@color-text-link--hover: var(--vkui--color_text_link--hover, #2C8BF7);
-@color-text-link--active: var(--vkui--color_text_link--active, #2A86EF);
-@color-text-link-themed: var(--vkui--color_text_link_themed, #2e90ff);
-@color-text-link-themed--hover: var(--vkui--color_text_link_themed--hover, #2C8BF7);
-@color-text-link-themed--active: var(--vkui--color_text_link_themed--active, #2A86EF);
+@color-text-link: var(--vkui--color_text_link, #2d81e0);
+@color-text-link--hover: var(--vkui--color_text_link--hover, #2B7CD9);
+@color-text-link--active: var(--vkui--color_text_link--active, #2978D3);
+@color-text-link-themed: var(--vkui--color_text_link_themed, #2d81e0);
+@color-text-link-themed--hover: var(--vkui--color_text_link_themed--hover, #2B7CD9);
+@color-text-link-themed--active: var(--vkui--color_text_link_themed--active, #2978D3);
 @color-text-link-tint: var(--vkui--color_text_link_tint, #71aaeb);
 @color-text-link-tint--hover: var(--vkui--color_text_link_tint--hover, #6CA4E4);
 @color-text-link-tint--active: var(--vkui--color_text_link_tint--active, #689EDD);
@@ -404,24 +404,24 @@
 @color-accent-gray: var(--vkui--color_accent_gray, #a3adb8);
 @color-accent-gray--hover: var(--vkui--color_accent_gray--hover, #9CA7B3);
 @color-accent-gray--active: var(--vkui--color_accent_gray--active, #96A0AE);
-@color-accent-red: var(--vkui--color_accent_red, #ff3347);
-@color-accent-red--hover: var(--vkui--color_accent_red--hover, #F53247);
-@color-accent-red--active: var(--vkui--color_accent_red--active, #EB3046);
+@color-accent-red: var(--vkui--color_accent_red, #ff5773);
+@color-accent-red--hover: var(--vkui--color_accent_red--hover, #F55471);
+@color-accent-red--active: var(--vkui--color_accent_red--active, #EB516F);
 @color-accent-orange-fire: var(--vkui--color_accent_orange_fire, #f05c44);
 @color-accent-orange-fire--hover: var(--vkui--color_accent_orange_fire--hover, #E65944);
 @color-accent-orange-fire--active: var(--vkui--color_accent_orange_fire--active, #DD5643);
-@color-accent-orange: var(--vkui--color_accent_orange, #ffa000);
-@color-accent-orange--hover: var(--vkui--color_accent_orange--hover, #F59A02);
-@color-accent-orange--active: var(--vkui--color_accent_orange--active, #EB9405);
+@color-accent-orange: var(--vkui--color_accent_orange, #ff913d);
+@color-accent-orange--hover: var(--vkui--color_accent_orange--hover, #F58C3D);
+@color-accent-orange--active: var(--vkui--color_accent_orange--active, #EB873D);
 @color-accent-orange-peach: var(--vkui--color_accent_orange_peach, #f9b54f);
 @color-accent-orange-peach--hover: var(--vkui--color_accent_orange_peach--hover, #EFAE4E);
 @color-accent-orange-peach--active: var(--vkui--color_accent_orange_peach--active, #E5A84E);
 @color-accent-lime: var(--vkui--color_accent_lime, #aff70d);
 @color-accent-lime--hover: var(--vkui--color_accent_lime--hover, #A8EE0F);
 @color-accent-lime--active: var(--vkui--color_accent_lime--active, #A1E511);
-@color-accent-green: var(--vkui--color_accent_green, #34c759);
-@color-accent-green--hover: var(--vkui--color_accent_green--hover, #32C058);
-@color-accent-green--active: var(--vkui--color_accent_green--active, #30B857);
+@color-accent-green: var(--vkui--color_accent_green, #42d347);
+@color-accent-green--hover: var(--vkui--color_accent_green--hover, #3FCB47);
+@color-accent-green--active: var(--vkui--color_accent_green--active, #3DC346);
 @color-accent-cyan: var(--vkui--color_accent_cyan, #13ffd0);
 @color-accent-cyan--hover: var(--vkui--color_accent_cyan--hover, #12F5CA);
 @color-accent-cyan--active: var(--vkui--color_accent_cyan--active, #11ECC4);
@@ -434,12 +434,12 @@
 @color-accent-violet: var(--vkui--color_accent_violet, #792ec0);
 @color-accent-violet--hover: var(--vkui--color_accent_violet--hover, #742DBB);
 @color-accent-violet--active: var(--vkui--color_accent_violet--active, #6F2CB6);
-@color-accent-raspberry-pink: var(--vkui--color_accent_raspberry_pink, #e03fab);
-@color-accent-raspberry-pink--hover: var(--vkui--color_accent_raspberry_pink--hover, #D73DA7);
-@color-accent-raspberry-pink--active: var(--vkui--color_accent_raspberry_pink--active, #CE3BA2);
-@color-accent-pink: var(--vkui--color_accent_pink, #f45fff);
-@color-accent-pink--hover: var(--vkui--color_accent_pink--hover, #EA5CF7);
-@color-accent-pink--active: var(--vkui--color_accent_pink--active, #E059EF);
+@color-accent-raspberry-pink: var(--vkui--color_accent_raspberry_pink, #fa7fbb);
+@color-accent-raspberry-pink--hover: var(--vkui--color_accent_raspberry_pink--hover, #F07BB6);
+@color-accent-raspberry-pink--active: var(--vkui--color_accent_raspberry_pink--active, #E676B1);
+@color-accent-pink: var(--vkui--color_accent_pink, #e866ff);
+@color-accent-pink--hover: var(--vkui--color_accent_pink--hover, #DF63F7);
+@color-accent-pink--active: var(--vkui--color_accent_pink--active, #D55FEF);
 @color-accent-secondary: var(--vkui--color_accent_secondary, #3f8ae0);
 @color-accent-secondary--hover: var(--vkui--color_accent_secondary--hover, #3C85D9);
 @color-accent-secondary--active: var(--vkui--color_accent_secondary--active, #3A80D3);
@@ -515,12 +515,33 @@
 @color-background-inverse: var(--vkui--color_background_inverse, #262626);
 @color-background-inverse--hover: var(--vkui--color_background_inverse--hover, #242527);
 @color-background-inverse--active: var(--vkui--color_background_inverse--active, #232428);
-@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, #3b3b3b66);
 @color-text-tertiary-alpha--hover: var(--vkui--color_text_tertiary_alpha--hover, rgba(59, 59, 59, 0.44));
 @color-text-tertiary-alpha--active: var(--vkui--color_text_tertiary_alpha--active, rgba(59, 59, 59, 0.48));
+@color-text-contrast-secondary-alpha: var(--vkui--color_text_contrast_secondary_alpha, #ffffff7f);
+@color-text-contrast-secondary-alpha--hover: var(--vkui--color_text_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.54));
+@color-text-contrast-secondary-alpha--active: var(--vkui--color_text_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.58));
+@color-icon-contrast-secondary-alpha: var(--vkui--color_icon_contrast_secondary_alpha, #ffffff7f);
+@color-icon-contrast-secondary-alpha--hover: var(--vkui--color_icon_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.54));
+@color-icon-contrast-secondary-alpha--active: var(--vkui--color_icon_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.58));
+@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-accent-mint: var(--vkui--color_accent_mint, #a3fd79);
+@color-accent-mint--hover: var(--vkui--color_accent_mint--hover, #9CF477);
+@color-accent-mint--active: var(--vkui--color_accent_mint--active, #96EA74);
+@color-text-link-in-primary: var(--vkui--color_text_link_in_primary, #999999);
+@color-text-link-in-primary--hover: var(--vkui--color_text_link_in_primary--hover, #939495);
+@color-text-link-in-primary--active: var(--vkui--color_text_link_in_primary--active, #8D8E92);
+@color-text-link-in-secondary: var(--vkui--color_text_link_in_secondary, #3b3b3b);
+@color-text-link-in-secondary--hover: var(--vkui--color_text_link_in_secondary--hover, #39393B);
+@color-text-link-in-secondary--active: var(--vkui--color_text_link_in_secondary--active, #36383B);
+@color-text-link-in-contrast: var(--vkui--color_text_link_in_contrast, #ffffff7f);
+@color-text-link-in-contrast--hover: var(--vkui--color_text_link_in_contrast--hover, rgba(255, 255, 255, 0.54));
+@color-text-link-in-contrast--active: var(--vkui--color_text_link_in_contrast--active, rgba(255, 255, 255, 0.58));
+@color-text-link-in-contrast-secondary-alpha: var(--vkui--color_text_link_in_contrast_secondary_alpha, #ffffff);
+@color-text-link-in-contrast-secondary-alpha--hover: var(--vkui--color_text_link_in_contrast_secondary_alpha--hover, #F5F5F7);
+@color-text-link-in-contrast-secondary-alpha--active: var(--vkui--color_text_link_in_contrast_secondary_alpha--active, #EBECEF);
 @vkontakte-color-snippet-border-alpha: var(--vkui--vkontakte_color_snippet_border_alpha, rgba(0, 0, 0, 0.15));
 @vkontakte-color-snippet-border-alpha--hover: var(--vkui--vkontakte_color_snippet_border_alpha--hover, rgba(0, 0, 0, 0.19));
 @vkontakte-color-snippet-border-alpha--active: var(--vkui--vkontakte_color_snippet_border_alpha--active, rgba(0, 0, 0, 0.23));

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

@@ -8,8 +8,8 @@
 	--elevation4: var(--vkui--elevation4, 0px 0px 8px rgba(0, 0, 0, 0.12), 0px 16px 16px rgba(0, 0, 0, 0.16));
 	--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);
+	--blur-l: var(--vkui--blur_l, 32px);
+	--blur-x-l: var(--vkui--blur_x_l, 64px);
 	--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);
@@ -32,19 +32,14 @@
 	--size-border-radius-paper--regular: var(--vkui--size_border_radius_paper--regular, 12px);
 	--size-border-radius-promo--regular: var(--vkui--size_border_radius_promo--regular, 20px);
 	--size-cell-height--regular: var(--vkui--size_cell_height--regular, 52px);
-	--size-cell-height--compact: var(--vkui--size_cell_height--compact, 48px);
 	--size-field-height--regular: var(--vkui--size_field_height--regular, 44px);
 	--size-field-height--compact: var(--vkui--size_field_height--compact, 36px);
 	--size-search-height--regular: var(--vkui--size_search_height--regular, 36px);
 	--size-search-height--compact: var(--vkui--size_search_height--compact, 32px);
 	--size-button-extra-small-height--regular: var(--vkui--size_button_extra_small_height--regular, 28px);
-	--size-button-extra-small-height--compact: var(--vkui--size_button_extra_small_height--compact, 24px);
-	--size-button-small-height--regular: var(--vkui--size_button_small_height--regular, 36px);
-	--size-button-small-height--compact: var(--vkui--size_button_small_height--compact, 32px);
-	--size-button-medium-height--regular: var(--vkui--size_button_medium_height--regular, 44px);
-	--size-button-medium-height--compact: var(--vkui--size_button_medium_height--compact, 36px);
+	--size-button-small-height--regular: var(--vkui--size_button_small_height--regular, 28px);
+	--size-button-medium-height--regular: var(--vkui--size_button_medium_height--regular, 38px);
 	--size-button-large-height--regular: var(--vkui--size_button_large_height--regular, 52px);
-	--size-button-large-height--compact: var(--vkui--size_button_large_height--compact, 44px);
 	--size-checkbox--regular: var(--vkui--size_checkbox--regular, 16px);
 	--size-arrow--regular: var(--vkui--size_arrow--regular, 8px);
 	--size-arrow-promo--regular: var(--vkui--size_arrow_promo--regular, 40px);
@@ -70,7 +65,6 @@
 	--size-card-border-radius--regular: var(--vkui--size_card_border_radius--regular, 8px);
 	--size-cardgrid-padding-vertical--regular: var(--vkui--size_cardgrid_padding_vertical--regular, 8px);
 	--size-base-padding-horizontal--regular: var(--vkui--size_base_padding_horizontal--regular, 16px);
-	--size-base-padding-horizontal--compact: var(--vkui--size_base_padding_horizontal--compact, 16px);
 	--size-base-padding-vertical--regular: var(--vkui--size_base_padding_vertical--regular, 12px);
 	--size-button-group-gap-space--regular: var(--vkui--size_button_group_gap_space--regular, 1px);
 	--size-button-group-gap-small--regular: var(--vkui--size_button_group_gap_small--regular, 8px);
@@ -135,6 +129,12 @@
 	--radius-x-l: var(--vkui--radius_x_l, 20px);
 	--radius-2x-l: var(--vkui--radius_2x_l, 24px);
 	--radius-3x-l: var(--vkui--radius_3x_l, 32px);
+	--animation-easing-linear: var(--vkui--animation_easing_linear, cubic-bezier(0, 0, 1, 1));
+	--animation-easing-in-smooth: var(--vkui--animation_easing_in_smooth, cubic-bezier(1, 0, 0.7, 1));
+	--animation-easing-out-smooth: var(--vkui--animation_easing_out_smooth, cubic-bezier(0.3, 0, 0, 1));
+	--animation-easing-in-out-smooth: var(--vkui--animation_easing_in_out_smooth, cubic-bezier(0.3, 0, 0.7, 1));
+	--animation-easing-out-sharp: var(--vkui--animation_easing_out_sharp, cubic-bezier(0.2, 0, 0, 1));
+	--animation-easing-in-out-sharp: var(--vkui--animation_easing_in_out_sharp, cubic-bezier(0.7, 0, 0.3, 1));
 	--gradient-black: var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%);
 	--gradient-white: var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%);
 	--gradient-tint: var(--vkui--gradient_tint, rgba(247, 247, 247, 0) 0%, rgba(247, 247, 247, 0.05) 15%, rgba(247, 247, 247, 0.2) 30%, rgba(247, 247, 247, 0.8) 70%, rgba(247, 247, 247, 0.95) 85%, var(--vkui--color_background_tertiary, rgba(247, 247, 247, 1)) 100%);
@@ -201,9 +201,9 @@
 	--color-background-content-inverse: var(--vkui--color_background_content_inverse, #19191A);
 	--color-background-content-inverse--hover: var(--vkui--color_background_content_inverse--hover, #18191B);
 	--color-background-content-inverse--active: var(--vkui--color_background_content_inverse--active, #17181D);
-	--color-background-secondary: var(--vkui--color_background_secondary, #f7f7f7);
-	--color-background-secondary--hover: var(--vkui--color_background_secondary--hover, #EDEEF0);
-	--color-background-secondary--active: var(--vkui--color_background_secondary--active, #E3E5E8);
+	--color-background-secondary: var(--vkui--color_background_secondary, #f2f2f2);
+	--color-background-secondary--hover: var(--vkui--color_background_secondary--hover, #E8E9EB);
+	--color-background-secondary--active: var(--vkui--color_background_secondary--active, #DFE0E4);
 	--color-background-secondary-alpha: var(--vkui--color_background_secondary_alpha, rgba(0, 0, 0, 0.04));
 	--color-background-secondary-alpha--hover: var(--vkui--color_background_secondary_alpha--hover, rgba(0, 0, 0, 0.08));
 	--color-background-secondary-alpha--active: var(--vkui--color_background_secondary_alpha--active, rgba(0, 0, 0, 0.12));
@@ -294,12 +294,12 @@
 	--color-text-negative: var(--vkui--color_text_negative, #f65460);
 	--color-text-negative--hover: var(--vkui--color_text_negative--hover, #EC515F);
 	--color-text-negative--active: var(--vkui--color_text_negative--active, #E24F5D);
-	--color-text-link: var(--vkui--color_text_link, #2e90ff);
-	--color-text-link--hover: var(--vkui--color_text_link--hover, #2C8BF7);
-	--color-text-link--active: var(--vkui--color_text_link--active, #2A86EF);
-	--color-text-link-themed: var(--vkui--color_text_link_themed, #2e90ff);
-	--color-text-link-themed--hover: var(--vkui--color_text_link_themed--hover, #2C8BF7);
-	--color-text-link-themed--active: var(--vkui--color_text_link_themed--active, #2A86EF);
+	--color-text-link: var(--vkui--color_text_link, #2d81e0);
+	--color-text-link--hover: var(--vkui--color_text_link--hover, #2B7CD9);
+	--color-text-link--active: var(--vkui--color_text_link--active, #2978D3);
+	--color-text-link-themed: var(--vkui--color_text_link_themed, #2d81e0);
+	--color-text-link-themed--hover: var(--vkui--color_text_link_themed--hover, #2B7CD9);
+	--color-text-link-themed--active: var(--vkui--color_text_link_themed--active, #2978D3);
 	--color-text-link-tint: var(--vkui--color_text_link_tint, #71aaeb);
 	--color-text-link-tint--hover: var(--vkui--color_text_link_tint--hover, #6CA4E4);
 	--color-text-link-tint--active: var(--vkui--color_text_link_tint--active, #689EDD);
@@ -405,24 +405,24 @@
 	--color-accent-gray: var(--vkui--color_accent_gray, #a3adb8);
 	--color-accent-gray--hover: var(--vkui--color_accent_gray--hover, #9CA7B3);
 	--color-accent-gray--active: var(--vkui--color_accent_gray--active, #96A0AE);
-	--color-accent-red: var(--vkui--color_accent_red, #ff3347);
-	--color-accent-red--hover: var(--vkui--color_accent_red--hover, #F53247);
-	--color-accent-red--active: var(--vkui--color_accent_red--active, #EB3046);
+	--color-accent-red: var(--vkui--color_accent_red, #ff5773);
+	--color-accent-red--hover: var(--vkui--color_accent_red--hover, #F55471);
+	--color-accent-red--active: var(--vkui--color_accent_red--active, #EB516F);
 	--color-accent-orange-fire: var(--vkui--color_accent_orange_fire, #f05c44);
 	--color-accent-orange-fire--hover: var(--vkui--color_accent_orange_fire--hover, #E65944);
 	--color-accent-orange-fire--active: var(--vkui--color_accent_orange_fire--active, #DD5643);
-	--color-accent-orange: var(--vkui--color_accent_orange, #ffa000);
-	--color-accent-orange--hover: var(--vkui--color_accent_orange--hover, #F59A02);
-	--color-accent-orange--active: var(--vkui--color_accent_orange--active, #EB9405);
+	--color-accent-orange: var(--vkui--color_accent_orange, #ff913d);
+	--color-accent-orange--hover: var(--vkui--color_accent_orange--hover, #F58C3D);
+	--color-accent-orange--active: var(--vkui--color_accent_orange--active, #EB873D);
 	--color-accent-orange-peach: var(--vkui--color_accent_orange_peach, #f9b54f);
 	--color-accent-orange-peach--hover: var(--vkui--color_accent_orange_peach--hover, #EFAE4E);
 	--color-accent-orange-peach--active: var(--vkui--color_accent_orange_peach--active, #E5A84E);
 	--color-accent-lime: var(--vkui--color_accent_lime, #aff70d);
 	--color-accent-lime--hover: var(--vkui--color_accent_lime--hover, #A8EE0F);
 	--color-accent-lime--active: var(--vkui--color_accent_lime--active, #A1E511);
-	--color-accent-green: var(--vkui--color_accent_green, #34c759);
-	--color-accent-green--hover: var(--vkui--color_accent_green--hover, #32C058);
-	--color-accent-green--active: var(--vkui--color_accent_green--active, #30B857);
+	--color-accent-green: var(--vkui--color_accent_green, #42d347);
+	--color-accent-green--hover: var(--vkui--color_accent_green--hover, #3FCB47);
+	--color-accent-green--active: var(--vkui--color_accent_green--active, #3DC346);
 	--color-accent-cyan: var(--vkui--color_accent_cyan, #13ffd0);
 	--color-accent-cyan--hover: var(--vkui--color_accent_cyan--hover, #12F5CA);
 	--color-accent-cyan--active: var(--vkui--color_accent_cyan--active, #11ECC4);
@@ -435,12 +435,12 @@
 	--color-accent-violet: var(--vkui--color_accent_violet, #792ec0);
 	--color-accent-violet--hover: var(--vkui--color_accent_violet--hover, #742DBB);
 	--color-accent-violet--active: var(--vkui--color_accent_violet--active, #6F2CB6);
-	--color-accent-raspberry-pink: var(--vkui--color_accent_raspberry_pink, #e03fab);
-	--color-accent-raspberry-pink--hover: var(--vkui--color_accent_raspberry_pink--hover, #D73DA7);
-	--color-accent-raspberry-pink--active: var(--vkui--color_accent_raspberry_pink--active, #CE3BA2);
-	--color-accent-pink: var(--vkui--color_accent_pink, #f45fff);
-	--color-accent-pink--hover: var(--vkui--color_accent_pink--hover, #EA5CF7);
-	--color-accent-pink--active: var(--vkui--color_accent_pink--active, #E059EF);
+	--color-accent-raspberry-pink: var(--vkui--color_accent_raspberry_pink, #fa7fbb);
+	--color-accent-raspberry-pink--hover: var(--vkui--color_accent_raspberry_pink--hover, #F07BB6);
+	--color-accent-raspberry-pink--active: var(--vkui--color_accent_raspberry_pink--active, #E676B1);
+	--color-accent-pink: var(--vkui--color_accent_pink, #e866ff);
+	--color-accent-pink--hover: var(--vkui--color_accent_pink--hover, #DF63F7);
+	--color-accent-pink--active: var(--vkui--color_accent_pink--active, #D55FEF);
 	--color-accent-secondary: var(--vkui--color_accent_secondary, #3f8ae0);
 	--color-accent-secondary--hover: var(--vkui--color_accent_secondary--hover, #3C85D9);
 	--color-accent-secondary--active: var(--vkui--color_accent_secondary--active, #3A80D3);
@@ -516,12 +516,33 @@
 	--color-background-inverse: var(--vkui--color_background_inverse, #262626);
 	--color-background-inverse--hover: var(--vkui--color_background_inverse--hover, #242527);
 	--color-background-inverse--active: var(--vkui--color_background_inverse--active, #232428);
-	--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, #3b3b3b66);
 	--color-text-tertiary-alpha--hover: var(--vkui--color_text_tertiary_alpha--hover, rgba(59, 59, 59, 0.44));
 	--color-text-tertiary-alpha--active: var(--vkui--color_text_tertiary_alpha--active, rgba(59, 59, 59, 0.48));
+	--color-text-contrast-secondary-alpha: var(--vkui--color_text_contrast_secondary_alpha, #ffffff7f);
+	--color-text-contrast-secondary-alpha--hover: var(--vkui--color_text_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.54));
+	--color-text-contrast-secondary-alpha--active: var(--vkui--color_text_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.58));
+	--color-icon-contrast-secondary-alpha: var(--vkui--color_icon_contrast_secondary_alpha, #ffffff7f);
+	--color-icon-contrast-secondary-alpha--hover: var(--vkui--color_icon_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.54));
+	--color-icon-contrast-secondary-alpha--active: var(--vkui--color_icon_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.58));
+	--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-accent-mint: var(--vkui--color_accent_mint, #a3fd79);
+	--color-accent-mint--hover: var(--vkui--color_accent_mint--hover, #9CF477);
+	--color-accent-mint--active: var(--vkui--color_accent_mint--active, #96EA74);
+	--color-text-link-in-primary: var(--vkui--color_text_link_in_primary, #999999);
+	--color-text-link-in-primary--hover: var(--vkui--color_text_link_in_primary--hover, #939495);
+	--color-text-link-in-primary--active: var(--vkui--color_text_link_in_primary--active, #8D8E92);
+	--color-text-link-in-secondary: var(--vkui--color_text_link_in_secondary, #3b3b3b);
+	--color-text-link-in-secondary--hover: var(--vkui--color_text_link_in_secondary--hover, #39393B);
+	--color-text-link-in-secondary--active: var(--vkui--color_text_link_in_secondary--active, #36383B);
+	--color-text-link-in-contrast: var(--vkui--color_text_link_in_contrast, #ffffff7f);
+	--color-text-link-in-contrast--hover: var(--vkui--color_text_link_in_contrast--hover, rgba(255, 255, 255, 0.54));
+	--color-text-link-in-contrast--active: var(--vkui--color_text_link_in_contrast--active, rgba(255, 255, 255, 0.58));
+	--color-text-link-in-contrast-secondary-alpha: var(--vkui--color_text_link_in_contrast_secondary_alpha, #ffffff);
+	--color-text-link-in-contrast-secondary-alpha--hover: var(--vkui--color_text_link_in_contrast_secondary_alpha--hover, #F5F5F7);
+	--color-text-link-in-contrast-secondary-alpha--active: var(--vkui--color_text_link_in_contrast_secondary_alpha--active, #EBECEF);
 	--vkontakte-color-snippet-border-alpha: var(--vkui--vkontakte_color_snippet_border_alpha, rgba(0, 0, 0, 0.15));
 	--vkontakte-color-snippet-border-alpha--hover: var(--vkui--vkontakte_color_snippet_border_alpha--hover, rgba(0, 0, 0, 0.19));
 	--vkontakte-color-snippet-border-alpha--active: var(--vkui--vkontakte_color_snippet_border_alpha--active, rgba(0, 0, 0, 0.23));

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

@@ -7,8 +7,8 @@ $elevation3: var(--vkui--elevation3, 0px 0px 2px rgba(0, 0, 0, 0.08), 0px 4px 16
 $elevation4: var(--vkui--elevation4, 0px 0px 8px rgba(0, 0, 0, 0.12), 0px 16px 16px rgba(0, 0, 0, 0.16));
 $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);
+$blur-l: var(--vkui--blur_l, 32px);
+$blur-x-l: var(--vkui--blur_x_l, 64px);
 $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);
@@ -31,19 +31,14 @@ $size-check-border-radius--regular: var(--vkui--size_check_border_radius--regula
 $size-border-radius-paper--regular: var(--vkui--size_border_radius_paper--regular, 12px);
 $size-border-radius-promo--regular: var(--vkui--size_border_radius_promo--regular, 20px);
 $size-cell-height--regular: var(--vkui--size_cell_height--regular, 52px);
-$size-cell-height--compact: var(--vkui--size_cell_height--compact, 48px);
 $size-field-height--regular: var(--vkui--size_field_height--regular, 44px);
 $size-field-height--compact: var(--vkui--size_field_height--compact, 36px);
 $size-search-height--regular: var(--vkui--size_search_height--regular, 36px);
 $size-search-height--compact: var(--vkui--size_search_height--compact, 32px);
 $size-button-extra-small-height--regular: var(--vkui--size_button_extra_small_height--regular, 28px);
-$size-button-extra-small-height--compact: var(--vkui--size_button_extra_small_height--compact, 24px);
-$size-button-small-height--regular: var(--vkui--size_button_small_height--regular, 36px);
-$size-button-small-height--compact: var(--vkui--size_button_small_height--compact, 32px);
-$size-button-medium-height--regular: var(--vkui--size_button_medium_height--regular, 44px);
-$size-button-medium-height--compact: var(--vkui--size_button_medium_height--compact, 36px);
+$size-button-small-height--regular: var(--vkui--size_button_small_height--regular, 28px);
+$size-button-medium-height--regular: var(--vkui--size_button_medium_height--regular, 38px);
 $size-button-large-height--regular: var(--vkui--size_button_large_height--regular, 52px);
-$size-button-large-height--compact: var(--vkui--size_button_large_height--compact, 44px);
 $size-checkbox--regular: var(--vkui--size_checkbox--regular, 16px);
 $size-arrow--regular: var(--vkui--size_arrow--regular, 8px);
 $size-arrow-promo--regular: var(--vkui--size_arrow_promo--regular, 40px);
@@ -69,7 +64,6 @@ $size-cardgrid-padding--regular: var(--vkui--size_cardgrid_padding--regular, 8px
 $size-card-border-radius--regular: var(--vkui--size_card_border_radius--regular, 8px);
 $size-cardgrid-padding-vertical--regular: var(--vkui--size_cardgrid_padding_vertical--regular, 8px);
 $size-base-padding-horizontal--regular: var(--vkui--size_base_padding_horizontal--regular, 16px);
-$size-base-padding-horizontal--compact: var(--vkui--size_base_padding_horizontal--compact, 16px);
 $size-base-padding-vertical--regular: var(--vkui--size_base_padding_vertical--regular, 12px);
 $size-button-group-gap-space--regular: var(--vkui--size_button_group_gap_space--regular, 1px);
 $size-button-group-gap-small--regular: var(--vkui--size_button_group_gap_small--regular, 8px);
@@ -134,6 +128,12 @@ $radius-l: var(--vkui--radius_l, 16px);
 $radius-x-l: var(--vkui--radius_x_l, 20px);
 $radius-2x-l: var(--vkui--radius_2x_l, 24px);
 $radius-3x-l: var(--vkui--radius_3x_l, 32px);
+$animation-easing-linear: var(--vkui--animation_easing_linear, cubic-bezier(0, 0, 1, 1));
+$animation-easing-in-smooth: var(--vkui--animation_easing_in_smooth, cubic-bezier(1, 0, 0.7, 1));
+$animation-easing-out-smooth: var(--vkui--animation_easing_out_smooth, cubic-bezier(0.3, 0, 0, 1));
+$animation-easing-in-out-smooth: var(--vkui--animation_easing_in_out_smooth, cubic-bezier(0.3, 0, 0.7, 1));
+$animation-easing-out-sharp: var(--vkui--animation_easing_out_sharp, cubic-bezier(0.2, 0, 0, 1));
+$animation-easing-in-out-sharp: var(--vkui--animation_easing_in_out_sharp, cubic-bezier(0.7, 0, 0.3, 1));
 $gradient-black: var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%);
 $gradient-white: var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%);
 $gradient-tint: var(--vkui--gradient_tint, rgba(247, 247, 247, 0) 0%, rgba(247, 247, 247, 0.05) 15%, rgba(247, 247, 247, 0.2) 30%, rgba(247, 247, 247, 0.8) 70%, rgba(247, 247, 247, 0.95) 85%, var(--vkui--color_background_tertiary, rgba(247, 247, 247, 1)) 100%);
@@ -200,9 +200,9 @@ $color-background-content-alpha--active: var(--vkui--color_background_content_al
 $color-background-content-inverse: var(--vkui--color_background_content_inverse, #19191A);
 $color-background-content-inverse--hover: var(--vkui--color_background_content_inverse--hover, #18191B);
 $color-background-content-inverse--active: var(--vkui--color_background_content_inverse--active, #17181D);
-$color-background-secondary: var(--vkui--color_background_secondary, #f7f7f7);
-$color-background-secondary--hover: var(--vkui--color_background_secondary--hover, #EDEEF0);
-$color-background-secondary--active: var(--vkui--color_background_secondary--active, #E3E5E8);
+$color-background-secondary: var(--vkui--color_background_secondary, #f2f2f2);
+$color-background-secondary--hover: var(--vkui--color_background_secondary--hover, #E8E9EB);
+$color-background-secondary--active: var(--vkui--color_background_secondary--active, #DFE0E4);
 $color-background-secondary-alpha: var(--vkui--color_background_secondary_alpha, rgba(0, 0, 0, 0.04));
 $color-background-secondary-alpha--hover: var(--vkui--color_background_secondary_alpha--hover, rgba(0, 0, 0, 0.08));
 $color-background-secondary-alpha--active: var(--vkui--color_background_secondary_alpha--active, rgba(0, 0, 0, 0.12));
@@ -293,12 +293,12 @@ $color-text-positive--active: var(--vkui--color_text_positive--active, #30B857);
 $color-text-negative: var(--vkui--color_text_negative, #f65460);
 $color-text-negative--hover: var(--vkui--color_text_negative--hover, #EC515F);
 $color-text-negative--active: var(--vkui--color_text_negative--active, #E24F5D);
-$color-text-link: var(--vkui--color_text_link, #2e90ff);
-$color-text-link--hover: var(--vkui--color_text_link--hover, #2C8BF7);
-$color-text-link--active: var(--vkui--color_text_link--active, #2A86EF);
-$color-text-link-themed: var(--vkui--color_text_link_themed, #2e90ff);
-$color-text-link-themed--hover: var(--vkui--color_text_link_themed--hover, #2C8BF7);
-$color-text-link-themed--active: var(--vkui--color_text_link_themed--active, #2A86EF);
+$color-text-link: var(--vkui--color_text_link, #2d81e0);
+$color-text-link--hover: var(--vkui--color_text_link--hover, #2B7CD9);
+$color-text-link--active: var(--vkui--color_text_link--active, #2978D3);
+$color-text-link-themed: var(--vkui--color_text_link_themed, #2d81e0);
+$color-text-link-themed--hover: var(--vkui--color_text_link_themed--hover, #2B7CD9);
+$color-text-link-themed--active: var(--vkui--color_text_link_themed--active, #2978D3);
 $color-text-link-tint: var(--vkui--color_text_link_tint, #71aaeb);
 $color-text-link-tint--hover: var(--vkui--color_text_link_tint--hover, #6CA4E4);
 $color-text-link-tint--active: var(--vkui--color_text_link_tint--active, #689EDD);
@@ -404,24 +404,24 @@ $color-accent-blue--active: var(--vkui--color_accent_blue--active, #2A86EF);
 $color-accent-gray: var(--vkui--color_accent_gray, #a3adb8);
 $color-accent-gray--hover: var(--vkui--color_accent_gray--hover, #9CA7B3);
 $color-accent-gray--active: var(--vkui--color_accent_gray--active, #96A0AE);
-$color-accent-red: var(--vkui--color_accent_red, #ff3347);
-$color-accent-red--hover: var(--vkui--color_accent_red--hover, #F53247);
-$color-accent-red--active: var(--vkui--color_accent_red--active, #EB3046);
+$color-accent-red: var(--vkui--color_accent_red, #ff5773);
+$color-accent-red--hover: var(--vkui--color_accent_red--hover, #F55471);
+$color-accent-red--active: var(--vkui--color_accent_red--active, #EB516F);
 $color-accent-orange-fire: var(--vkui--color_accent_orange_fire, #f05c44);
 $color-accent-orange-fire--hover: var(--vkui--color_accent_orange_fire--hover, #E65944);
 $color-accent-orange-fire--active: var(--vkui--color_accent_orange_fire--active, #DD5643);
-$color-accent-orange: var(--vkui--color_accent_orange, #ffa000);
-$color-accent-orange--hover: var(--vkui--color_accent_orange--hover, #F59A02);
-$color-accent-orange--active: var(--vkui--color_accent_orange--active, #EB9405);
+$color-accent-orange: var(--vkui--color_accent_orange, #ff913d);
+$color-accent-orange--hover: var(--vkui--color_accent_orange--hover, #F58C3D);
+$color-accent-orange--active: var(--vkui--color_accent_orange--active, #EB873D);
 $color-accent-orange-peach: var(--vkui--color_accent_orange_peach, #f9b54f);
 $color-accent-orange-peach--hover: var(--vkui--color_accent_orange_peach--hover, #EFAE4E);
 $color-accent-orange-peach--active: var(--vkui--color_accent_orange_peach--active, #E5A84E);
 $color-accent-lime: var(--vkui--color_accent_lime, #aff70d);
 $color-accent-lime--hover: var(--vkui--color_accent_lime--hover, #A8EE0F);
 $color-accent-lime--active: var(--vkui--color_accent_lime--active, #A1E511);
-$color-accent-green: var(--vkui--color_accent_green, #34c759);
-$color-accent-green--hover: var(--vkui--color_accent_green--hover, #32C058);
-$color-accent-green--active: var(--vkui--color_accent_green--active, #30B857);
+$color-accent-green: var(--vkui--color_accent_green, #42d347);
+$color-accent-green--hover: var(--vkui--color_accent_green--hover, #3FCB47);
+$color-accent-green--active: var(--vkui--color_accent_green--active, #3DC346);
 $color-accent-cyan: var(--vkui--color_accent_cyan, #13ffd0);
 $color-accent-cyan--hover: var(--vkui--color_accent_cyan--hover, #12F5CA);
 $color-accent-cyan--active: var(--vkui--color_accent_cyan--active, #11ECC4);
@@ -434,12 +434,12 @@ $color-accent-purple--active: var(--vkui--color_accent_purple--active, #6A56D8);
 $color-accent-violet: var(--vkui--color_accent_violet, #792ec0);
 $color-accent-violet--hover: var(--vkui--color_accent_violet--hover, #742DBB);
 $color-accent-violet--active: var(--vkui--color_accent_violet--active, #6F2CB6);
-$color-accent-raspberry-pink: var(--vkui--color_accent_raspberry_pink, #e03fab);
-$color-accent-raspberry-pink--hover: var(--vkui--color_accent_raspberry_pink--hover, #D73DA7);
-$color-accent-raspberry-pink--active: var(--vkui--color_accent_raspberry_pink--active, #CE3BA2);
-$color-accent-pink: var(--vkui--color_accent_pink, #f45fff);
-$color-accent-pink--hover: var(--vkui--color_accent_pink--hover, #EA5CF7);
-$color-accent-pink--active: var(--vkui--color_accent_pink--active, #E059EF);
+$color-accent-raspberry-pink: var(--vkui--color_accent_raspberry_pink, #fa7fbb);
+$color-accent-raspberry-pink--hover: var(--vkui--color_accent_raspberry_pink--hover, #F07BB6);
+$color-accent-raspberry-pink--active: var(--vkui--color_accent_raspberry_pink--active, #E676B1);
+$color-accent-pink: var(--vkui--color_accent_pink, #e866ff);
+$color-accent-pink--hover: var(--vkui--color_accent_pink--hover, #DF63F7);
+$color-accent-pink--active: var(--vkui--color_accent_pink--active, #D55FEF);
 $color-accent-secondary: var(--vkui--color_accent_secondary, #3f8ae0);
 $color-accent-secondary--hover: var(--vkui--color_accent_secondary--hover, #3C85D9);
 $color-accent-secondary--active: var(--vkui--color_accent_secondary--active, #3A80D3);
@@ -515,12 +515,33 @@ $color-transparent--active: var(--vkui--color_transparent--active, rgba(0, 0, 0,
 $color-background-inverse: var(--vkui--color_background_inverse, #262626);
 $color-background-inverse--hover: var(--vkui--color_background_inverse--hover, #242527);
 $color-background-inverse--active: var(--vkui--color_background_inverse--active, #232428);
-$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, #3b3b3b66);
 $color-text-tertiary-alpha--hover: var(--vkui--color_text_tertiary_alpha--hover, rgba(59, 59, 59, 0.44));
 $color-text-tertiary-alpha--active: var(--vkui--color_text_tertiary_alpha--active, rgba(59, 59, 59, 0.48));
+$color-text-contrast-secondary-alpha: var(--vkui--color_text_contrast_secondary_alpha, #ffffff7f);
+$color-text-contrast-secondary-alpha--hover: var(--vkui--color_text_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.54));
+$color-text-contrast-secondary-alpha--active: var(--vkui--color_text_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.58));
+$color-icon-contrast-secondary-alpha: var(--vkui--color_icon_contrast_secondary_alpha, #ffffff7f);
+$color-icon-contrast-secondary-alpha--hover: var(--vkui--color_icon_contrast_secondary_alpha--hover, rgba(255, 255, 255, 0.54));
+$color-icon-contrast-secondary-alpha--active: var(--vkui--color_icon_contrast_secondary_alpha--active, rgba(255, 255, 255, 0.58));
+$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-accent-mint: var(--vkui--color_accent_mint, #a3fd79);
+$color-accent-mint--hover: var(--vkui--color_accent_mint--hover, #9CF477);
+$color-accent-mint--active: var(--vkui--color_accent_mint--active, #96EA74);
+$color-text-link-in-primary: var(--vkui--color_text_link_in_primary, #999999);
+$color-text-link-in-primary--hover: var(--vkui--color_text_link_in_primary--hover, #939495);
+$color-text-link-in-primary--active: var(--vkui--color_text_link_in_primary--active, #8D8E92);
+$color-text-link-in-secondary: var(--vkui--color_text_link_in_secondary, #3b3b3b);
+$color-text-link-in-secondary--hover: var(--vkui--color_text_link_in_secondary--hover, #39393B);
+$color-text-link-in-secondary--active: var(--vkui--color_text_link_in_secondary--active, #36383B);
+$color-text-link-in-contrast: var(--vkui--color_text_link_in_contrast, #ffffff7f);
+$color-text-link-in-contrast--hover: var(--vkui--color_text_link_in_contrast--hover, rgba(255, 255, 255, 0.54));
+$color-text-link-in-contrast--active: var(--vkui--color_text_link_in_contrast--active, rgba(255, 255, 255, 0.58));
+$color-text-link-in-contrast-secondary-alpha: var(--vkui--color_text_link_in_contrast_secondary_alpha, #ffffff);
+$color-text-link-in-contrast-secondary-alpha--hover: var(--vkui--color_text_link_in_contrast_secondary_alpha--hover, #F5F5F7);
+$color-text-link-in-contrast-secondary-alpha--active: var(--vkui--color_text_link_in_contrast_secondary_alpha--active, #EBECEF);
 $vkontakte-color-snippet-border-alpha: var(--vkui--vkontakte_color_snippet_border_alpha, rgba(0, 0, 0, 0.15));
 $vkontakte-color-snippet-border-alpha--hover: var(--vkui--vkontakte_color_snippet_border_alpha--hover, rgba(0, 0, 0, 0.19));
 $vkontakte-color-snippet-border-alpha--active: var(--vkui--vkontakte_color_snippet_border_alpha--active, rgba(0, 0, 0, 0.23));