npm - @vkontakte/vkui-tokens - Versions diffs - 4.3.2-dev-db778e.0 → 4.4.0 - Mend

@vkontakte/vkui-tokens 4.3.2-dev-db778e.0 → 4.4.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 (587) hide show

package/themes/calendar/cssVars/theme/fallbacks/index.styl CHANGED Viewed

@@ -13,7 +13,7 @@ $size-popup-base-padding--regular = var(--vkui--size_popup_base_padding--regular
 $size-popup-base-padding--compact = var(--vkui--size_popup_base_padding--compact, 32px);
 $size-popup-header-padding--regular = var(--vkui--size_popup_header_padding--regular, 16px);
 $size-popup-header-padding--compact = var(--vkui--size_popup_header_padding--compact, 24px);
-$size-border-radius--compact = var(--vkui--size_border_radius--compact, 8px);
+$size-border-radius--compact = var(--vkui--size_border_radius--compact, 12px);
 $size-border-radius--regular = var(--vkui--size_border_radius--regular, 8px);
 $size-check-border-radius--regular = var(--vkui--size_check_border_radius--regular, 4px);
 $size-border-radius-paper--regular = var(--vkui--size_border_radius_paper--regular, 12px);
@@ -33,8 +33,8 @@ $size-popup-small--regular = var(--vkui--size_popup_small--regular, 420px);
 $size-popup-medium--regular = var(--vkui--size_popup_medium--regular, 680px);
 $size-popup-large--regular = var(--vkui--size_popup_large--regular, 880px);
 $size-field-horizontal-padding--regular = var(--vkui--size_field_horizontal_padding--regular, 8px);
-$size-button-padding-horizontal--compact = var(--vkui--size_button_padding_horizontal--compact, 16px);
-$size-button-padding-horizontal--regular = var(--vkui--size_button_padding_horizontal--regular, 20px);
+$size-button-padding-horizontal--compact = var(--vkui--size_button_padding_horizontal--compact, 12px);
+$size-button-padding-horizontal--regular = var(--vkui--size_button_padding_horizontal--regular, 16px);
 $size-label-horizontal-margin--regular = var(--vkui--size_label_horizontal_margin--regular, 16px);
 $size-arrow-padding--regular = var(--vkui--size_arrow_padding--regular, 12px);
 $size-tooltip-margin--regular = var(--vkui--size_tooltip_margin--regular, 8px);
@@ -54,10 +54,13 @@ $size-cardgrid-padding--regular = var(--vkui--size_cardgrid_padding--regular, 12
 $size-card-border-radius--regular = var(--vkui--size_card_border_radius--regular, 16px);
 $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);
-$elevation1 = var(--vkui--elevation1, 0 2px 0 0 rgba(0, 16, 61, 0.04));
-$elevation2 = var(--vkui--elevation2, 0 4px 32px 0 rgba(0, 16, 61, 0.32));
-$elevation3 = var(--vkui--elevation3, 0 16px 48px 0 rgba(0, 0, 0, 0.48));
-$elevation4 = var(--vkui--elevation4, 0 16px 48px 0 rgba(0, 0, 0, 0.48));
+$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);
+$size-button-group-gap-medium--regular = var(--vkui--size_button_group_gap_medium--regular, 12px);
+$elevation1 = var(--vkui--elevation1, none);
+$elevation2 = var(--vkui--elevation2, none);
+$elevation3 = var(--vkui--elevation3, 0px 4px 32px rgba(0, 16, 61, 0.32));
+$elevation4 = var(--vkui--elevation4, 0px 16px 48px rgba(0, 16, 61, 0.48));
 $animation-duration-l = var(--vkui--animation_duration_l, 0.4s);
 $animation-duration-m = var(--vkui--animation_duration_m, 0.2s);
 $animation-duration-s = var(--vkui--animation_duration_s, 0.1s);
@@ -295,9 +298,9 @@ $color-stroke-negative--active = var(--vkui--color_stroke_negative--active, #DA0
 $color-image-border-alpha = var(--vkui--color_image_border_alpha, rgba(0, 16, 61, 0.08));
 $color-image-border-alpha--hover = var(--vkui--color_image_border_alpha--hover, rgba(0, 16, 61, 0.12));
 $color-image-border-alpha--active = var(--vkui--color_image_border_alpha--active, rgba(0, 16, 61, 0.16));
-$color-field-border-alpha = var(--vkui--color_field_border_alpha, rgba(0, 16, 61, 0.12));
-$color-field-border-alpha--hover = var(--vkui--color_field_border_alpha--hover, rgba(0, 16, 61, 0.16));
-$color-field-border-alpha--active = var(--vkui--color_field_border_alpha--active, rgba(0, 16, 61, 0.2));
+$color-field-border-alpha = var(--vkui--color_field_border_alpha, transparent);
+$color-field-border-alpha--hover = var(--vkui--color_field_border_alpha--hover, transparent);
+$color-field-border-alpha--active = var(--vkui--color_field_border_alpha--active, transparent);
 $color-separator-primary-alpha = var(--vkui--color_separator_primary_alpha, rgba(0, 16, 61, 0.12));
 $color-separator-primary-alpha--hover = var(--vkui--color_separator_primary_alpha--hover, rgba(0, 16, 61, 0.16));
 $color-separator-primary-alpha--active = var(--vkui--color_separator_primary_alpha--active, rgba(0, 16, 61, 0.2));
@@ -394,59 +397,32 @@ $color-button-contrast--active = var(--vkui--color_button_contrast--active, #FFF
 $color-thumb-error-background-alpha = var(--vkui--color_thumb_error_background_alpha, rgba(237, 10, 52, 0.12));
 $color-thumb-error-background-alpha--hover = var(--vkui--color_thumb_error_background_alpha--hover, rgba(237, 10, 52, 0.16));
 $color-thumb-error-background-alpha--active = var(--vkui--color_thumb_error_background_alpha--active, rgba(237, 10, 52, 0.2));
-$calendar-color-background-accent-tint-themed = var(--vkui--calendar_color_background_accent_tint_themed, #E3F0FD);
-$calendar-color-background-accent-tint-themed--hover = var(--vkui--calendar_color_background_accent_tint_themed--hover, #DAE4F3);
-$calendar-color-background-accent-tint-themed--active = var(--vkui--calendar_color_background_accent_tint_themed--active, #E3F0FD);
 font-title1--regular() {
-	font-size: var(--vkui--font_title1--font_size--regular, 24px);
-	line-height: var(--vkui--font_title1--line_height--regular, 32px);
+	font-size: var(--vkui--font_title1--font_size--regular, 17px);
+	line-height: var(--vkui--font_title1--line_height--regular, 24px);
 	font-weight: var(--vkui--font_title1--font_weight--regular, 500);
 	font-family: var(--vkui--font_title1--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
-font-title1--compact() {
-	font-size: var(--vkui--font_title1--font_size--compact, 24px);
-	line-height: var(--vkui--font_title1--line_height--compact, 28px);
-	font-weight: var(--vkui--font_title1--font_weight--compact, 500);
-	font-family: var(--vkui--font_title1--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
 font-title2--regular() {
-	font-size: var(--vkui--font_title2--font_size--regular, 20px);
-	line-height: var(--vkui--font_title2--line_height--regular, 24px);
+	font-size: var(--vkui--font_title2--font_size--regular, 15px);
+	line-height: var(--vkui--font_title2--line_height--regular, 20px);
 	font-weight: var(--vkui--font_title2--font_weight--regular, 500);
 	font-family: var(--vkui--font_title2--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
-font-title2--compact() {
-	font-size: var(--vkui--font_title2--font_size--compact, 20px);
-	line-height: var(--vkui--font_title2--line_height--compact, 24px);
-	font-weight: var(--vkui--font_title2--font_weight--compact, 500);
-	font-family: var(--vkui--font_title2--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
 font-title3--regular() {
-	font-size: var(--vkui--font_title3--font_size--regular, 17px);
-	line-height: var(--vkui--font_title3--line_height--regular, 24px);
+	font-size: var(--vkui--font_title3--font_size--regular, 15px);
+	line-height: var(--vkui--font_title3--line_height--regular, 20px);
 	font-weight: var(--vkui--font_title3--font_weight--regular, 500);
 	font-family: var(--vkui--font_title3--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
-font-title3--compact() {
-	font-size: var(--vkui--font_title3--font_size--compact, 17px);
-	line-height: var(--vkui--font_title3--line_height--compact, 24px);
-	font-weight: var(--vkui--font_title3--font_weight--compact, 500);
-	font-family: var(--vkui--font_title3--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
 font-headline1--regular() {
-	font-size: var(--vkui--font_headline1--font_size--regular, 16px);
+	font-size: var(--vkui--font_headline1--font_size--regular, 15px);
 	line-height: var(--vkui--font_headline1--line_height--regular, 20px);
 	font-weight: var(--vkui--font_headline1--font_weight--regular, 500);
 	font-family: var(--vkui--font_headline1--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
-font-headline1--compact() {
-	font-size: var(--vkui--font_headline1--font_size--compact, 15px);
-	line-height: var(--vkui--font_headline1--line_height--compact, 20px);
-	font-weight: var(--vkui--font_headline1--font_weight--compact, 500);
-	font-family: var(--vkui--font_headline1--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
 font-headline2--regular() {
 	font-size: var(--vkui--font_headline2--font_size--regular, 15px);
 	line-height: var(--vkui--font_headline2--line_height--regular, 20px);
@@ -459,226 +435,178 @@ font-headline2--compact() {
 	font-family: var(--vkui--font_headline2--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_headline2--font_weight--regular, 500);
 }
+font-text--compact() {
+	font-size: var(--vkui--font_text--font_size--compact, 17px);
+	line-height: var(--vkui--font_text--line_height--compact, 24px);
+	font-weight: var(--vkui--font_text--font_weight--compact, 400);
+	font-family: var(--vkui--font_text--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
+}
 font-text--regular() {
-	font-size: var(--vkui--font_text--font_size--regular, 16px);
+	font-size: var(--vkui--font_text--font_size--regular, 15px);
 	line-height: var(--vkui--font_text--line_height--regular, 20px);
 	font-weight: var(--vkui--font_text--font_weight--regular, 400);
 	font-family: var(--vkui--font_text--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
-font-text--compact() {
-	font-size: var(--vkui--font_text--font_size--compact, 15px);
-	line-height: var(--vkui--font_text--line_height--compact, 20px);
-	font-weight: var(--vkui--font_text--font_weight--compact, 400);
-	font-family: var(--vkui--font_text--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
 font-paragraph--regular() {
 	font-size: var(--vkui--font_paragraph--font_size--regular, 15px);
 	line-height: var(--vkui--font_paragraph--line_height--regular, 20px);
+	font-family: var(--vkui--font_paragraph--font_family--regular, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_paragraph--font_weight--regular, 400);
-	font-family: var(--vkui--font_paragraph--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-}
-font-paragraph--compact() {
-	font-size: var(--vkui--font_paragraph--font_size--compact, 15px);
-	line-height: var(--vkui--font_paragraph--line_height--compact, 20px);
-	font-weight: var(--vkui--font_paragraph--font_weight--compact, 400);
-	font-family: var(--vkui--font_paragraph--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
 }
 font-subhead--regular() {
 	font-size: var(--vkui--font_subhead--font_size--regular, 14px);
 	line-height: var(--vkui--font_subhead--line_height--regular, 18px);
+	font-family: var(--vkui--font_subhead--font_family--regular, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_subhead--font_weight--regular, 400);
-	font-family: var(--vkui--font_subhead--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
 font-subhead--compact() {
 	font-size: var(--vkui--font_subhead--font_size--compact, 13px);
 	line-height: var(--vkui--font_subhead--line_height--compact, 18px);
-	font-weight: var(--vkui--font_subhead--font_weight--compact, 500);
-	font-family: var(--vkui--font_subhead--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
+	font-family: var(--vkui--font_subhead--font_family--regular, Helvetica, Arial, sans-serif);
+	font-weight: var(--vkui--font_subhead--font_weight--regular, 400);
 }
 font-footnote--regular() {
 	font-size: var(--vkui--font_footnote--font_size--regular, 13px);
-	line-height: var(--vkui--font_footnote--line_height--regular, 18px);
+	line-height: var(--vkui--font_footnote--line_height--regular, 20px);
 	font-weight: var(--vkui--font_footnote--font_weight--regular, 400);
 	font-family: var(--vkui--font_footnote--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
-font-footnote--compact() {
-	font-size: var(--vkui--font_footnote--font_size--compact, 13px);
-	line-height: var(--vkui--font_footnote--line_height--compact, 18px);
-	font-weight: var(--vkui--font_footnote--font_weight--compact, 400);
-	font-family: var(--vkui--font_footnote--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
 font-footnote-caps--regular() {
 	font-size: var(--vkui--font_footnote_caps--font_size--regular, 13px);
 	line-height: var(--vkui--font_footnote_caps--line_height--regular, 18px);
+	font-family: var(--vkui--font_footnote_caps--font_family--regular, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_footnote_caps--font_weight--regular, 400);
-	font-family: var(--vkui--font_footnote_caps--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-	letter-spacing: var(--vkui--font_footnote_caps--letter_spacing--regular, 0.3px);
 	text-transform: var(--vkui--font_footnote_caps--text_transform--regular, uppercase);
-}
-font-footnote-caps--compact() {
-	font-size: var(--vkui--font_footnote_caps--font_size--compact, 13px);
-	line-height: var(--vkui--font_footnote_caps--line_height--compact, 18px);
-	font-weight: var(--vkui--font_footnote_caps--font_weight--compact, 400);
-	font-family: var(--vkui--font_footnote_caps--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-	letter-spacing: var(--vkui--font_footnote_caps--letter_spacing--compact, 0.3px);
-	text-transform: var(--vkui--font_footnote_caps--text_transform--compact, uppercase);
+	letter-spacing: var(--vkui--font_footnote_caps--letter_spacing--regular, 0.3px);
 }
 font-caption1--regular() {
 	font-size: var(--vkui--font_caption1--font_size--regular, 12px);
 	line-height: var(--vkui--font_caption1--line_height--regular, 16px);
+	font-family: var(--vkui--font_caption1--font_family--regular, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_caption1--font_weight--regular, 400);
-	font-family: var(--vkui--font_caption1--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-}
-font-caption1--compact() {
-	font-size: var(--vkui--font_caption1--font_size--compact, 12px);
-	line-height: var(--vkui--font_caption1--line_height--compact, 14px);
-	font-weight: var(--vkui--font_caption1--font_weight--compact, 400);
-	font-family: var(--vkui--font_caption1--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
 }
 font-caption1-caps--regular() {
 	font-size: var(--vkui--font_caption1_caps--font_size--regular, 12px);
 	line-height: var(--vkui--font_caption1_caps--line_height--regular, 16px);
+	font-family: var(--vkui--font_caption1_caps--font_family--regular, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_caption1_caps--font_weight--regular, 400);
-	font-family: var(--vkui--font_caption1_caps--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-	letter-spacing: var(--vkui--font_caption1_caps--letter_spacing--regular, 0.26px);
 	text-transform: var(--vkui--font_caption1_caps--text_transform--regular, uppercase);
-}
-font-caption1-caps--compact() {
-	font-size: var(--vkui--font_caption1_caps--font_size--compact, 12px);
-	line-height: var(--vkui--font_caption1_caps--line_height--compact, 14px);
-	font-weight: var(--vkui--font_caption1_caps--font_weight--compact, 500);
-	font-family: var(--vkui--font_caption1_caps--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-	letter-spacing: var(--vkui--font_caption1_caps--letter_spacing--compact, 0.26px);
-	text-transform: var(--vkui--font_caption1_caps--text_transform--compact, uppercase);
+	letter-spacing: var(--vkui--font_caption1_caps--letter_spacing--regular, 0.26px);
 }
 font-caption2--regular() {
 	font-size: var(--vkui--font_caption2--font_size--regular, 11px);
-	line-height: var(--vkui--font_caption2--line_height--regular, 14px);
+	line-height: var(--vkui--font_caption2--line_height--regular, 12px);
 	font-weight: var(--vkui--font_caption2--font_weight--regular, 400);
 	font-family: var(--vkui--font_caption2--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
-font-caption2--compact() {
-	font-size: var(--vkui--font_caption2--font_size--compact, 11px);
-	line-height: var(--vkui--font_caption2--line_height--compact, 14px);
-	font-weight: var(--vkui--font_caption2--font_weight--compact, 400);
-	font-family: var(--vkui--font_caption2--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
 font-caption2-caps--regular() {
 	font-size: var(--vkui--font_caption2_caps--font_size--regular, 11px);
 	line-height: var(--vkui--font_caption2_caps--line_height--regular, 14px);
+	font-family: var(--vkui--font_caption2_caps--font_family--regular, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_caption2_caps--font_weight--regular, 400);
-	font-family: var(--vkui--font_caption2_caps--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-	letter-spacing: var(--vkui--font_caption2_caps--letter_spacing--regular, 0.22px);
 	text-transform: var(--vkui--font_caption2_caps--text_transform--regular, uppercase);
-}
-font-caption2-caps--compact() {
-	font-size: var(--vkui--font_caption2_caps--font_size--compact, 11px);
-	line-height: var(--vkui--font_caption2_caps--line_height--compact, 14px);
-	font-weight: var(--vkui--font_caption2_caps--font_weight--compact, 400);
-	font-family: var(--vkui--font_caption2_caps--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-	letter-spacing: var(--vkui--font_caption2_caps--letter_spacing--compact, 0.22px);
-	text-transform: var(--vkui--font_caption2_caps--text_transform--compact, uppercase);
+	letter-spacing: var(--vkui--font_caption2_caps--letter_spacing--regular, 0.22px);
 }
 font-caption3--regular() {
 	font-size: var(--vkui--font_caption3--font_size--regular, 9px);
 	line-height: var(--vkui--font_caption3--line_height--regular, 12px);
+	font-family: var(--vkui--font_caption3--font_family--regular, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_caption3--font_weight--regular, 400);
-	font-family: var(--vkui--font_caption3--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-}
-font-caption3--compact() {
-	font-size: var(--vkui--font_caption3--font_size--compact, 9px);
-	line-height: var(--vkui--font_caption3--line_height--compact, 12px);
-	font-weight: var(--vkui--font_caption3--font_weight--compact, 400);
-	font-family: var(--vkui--font_caption3--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
 }
 font-caption3-caps--regular() {
 	font-size: var(--vkui--font_caption3_caps--font_size--regular, 9px);
 	line-height: var(--vkui--font_caption3_caps--line_height--regular, 12px);
+	font-family: var(--vkui--font_caption3_caps--font_family--regular, Helvetica, Arial, sans-serif);
 	font-weight: var(--vkui--font_caption3_caps--font_weight--regular, 400);
-	font-family: var(--vkui--font_caption3_caps--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-	letter-spacing: var(--vkui--font_caption3_caps--letter_spacing--regular, 0.16px);
 	text-transform: var(--vkui--font_caption3_caps--text_transform--regular, uppercase);
-}
-font-caption3-caps--compact() {
-	font-size: var(--vkui--font_caption3_caps--font_size--compact, 9px);
-	line-height: var(--vkui--font_caption3_caps--line_height--compact, 12px);
-	font-weight: var(--vkui--font_caption3_caps--font_weight--compact, 400);
-	font-family: var(--vkui--font_caption3_caps--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-	letter-spacing: var(--vkui--font_caption3_caps--letter_spacing--compact, 0.16px);
-	text-transform: var(--vkui--font_caption3_caps--text_transform--compact, uppercase);
+	letter-spacing: var(--vkui--font_caption3_caps--letter_spacing--regular, 0.16px);
 }
 font-h0--regular() {
-	font-size: var(--vkui--font_h0--font_size--regular, 28px);
-	line-height: var(--vkui--font_h0--line_height--regular, 32px);
-	font-family: var(--vkui--font_h0--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
+	font-size: var(--vkui--font_h0--font_size--regular, 32px);
+	line-height: var(--vkui--font_h0--line_height--regular, 40px);
 	font-weight: var(--vkui--font_h0--font_weight--regular, 500);
-}
-font-h0--compact() {
-	font-size: var(--vkui--font_h0--font_size--compact, 44px);
-	line-height: var(--vkui--font_h0--line_height--compact, 52px);
 	font-family: var(--vkui--font_h0--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-	font-weight: var(--vkui--font_h0--font_weight--regular, 500);
+}
+font-h1--compact() {
+	font-size: var(--vkui--font_h1--font_size--compact, 24px);
+	line-height: var(--vkui--font_h1--line_height--compact, 32px);
+	font-weight: var(--vkui--font_h1--font_weight--compact, 500);
+	font-family: var(--vkui--font_h1--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
+	margin-bottom: var(--vkui--font_h1--margin_bottom--compact, 16px);
 }
 font-h1--regular() {
-	font-size: var(--vkui--font_h1--font_size--regular, 24px);
-	line-height: var(--vkui--font_h1--line_height--regular, 28px);
-	font-family: var(--vkui--font_h1--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
+	font-size: var(--vkui--font_h1--font_size--regular, 32px);
+	line-height: var(--vkui--font_h1--line_height--regular, 40px);
 	font-weight: var(--vkui--font_h1--font_weight--regular, 500);
-}
-font-h1--compact() {
-	font-size: var(--vkui--font_h1--font_size--compact, 32px);
-	line-height: var(--vkui--font_h1--line_height--compact, 36px);
 	font-family: var(--vkui--font_h1--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-	font-weight: var(--vkui--font_h1--font_weight--regular, 500);
+	margin-bottom: var(--vkui--font_h1--margin_bottom--regular, 16px);
+}
+font-h2--compact() {
+	font-size: var(--vkui--font_h2--font_size--compact, 20px);
+	line-height: var(--vkui--font_h2--line_height--compact, 24px);
+	font-weight: var(--vkui--font_h2--font_weight--compact, 500);
+	font-family: var(--vkui--font_h2--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
 }
 font-h2--regular() {
-	font-size: var(--vkui--font_h2--font_size--regular, 20px);
-	line-height: var(--vkui--font_h2--line_height--regular, 26px);
-	font-family: var(--vkui--font_h2--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
+	font-size: var(--vkui--font_h2--font_size--regular, 24px);
+	line-height: var(--vkui--font_h2--line_height--regular, 28px);
 	font-weight: var(--vkui--font_h2--font_weight--regular, 500);
-}
-font-h2--compact() {
-	font-size: var(--vkui--font_h2--font_size--compact, 28px);
-	line-height: var(--vkui--font_h2--line_height--compact, 32px);
 	font-family: var(--vkui--font_h2--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-	font-weight: var(--vkui--font_h2--font_weight--regular, 500);
 }
-calendar-font-text-event--regular() {
-	font-size: var(--vkui--calendar_font_text_event--font_size--regular, 17px);
-	line-height: var(--vkui--calendar_font_text_event--line_height--regular, 24px);
-	font-weight: var(--vkui--calendar_font_text_event--font_weight--regular, 400);
-	font-family: var(--vkui--calendar_font_text_event--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-}
-calendar-font-text-event--compact() {
-	font-size: var(--vkui--calendar_font_text_event--font_size--compact, 13px);
-	line-height: var(--vkui--calendar_font_text_event--line_height--compact, 18px);
-	font-weight: var(--vkui--calendar_font_text_event--font_weight--compact, 500);
-	font-family: var(--vkui--calendar_font_text_event--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
-calendar-font-text-event-small--regular() {
-	font-size: var(--vkui--calendar_font_text_event_small--font_size--regular, 15px);
-	line-height: var(--vkui--calendar_font_text_event_small--line_height--regular, 20px);
-	font-weight: var(--vkui--calendar_font_text_event_small--font_weight--regular, 400);
-	font-family: var(--vkui--calendar_font_text_event_small--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
-}
-calendar-font-text-event-small--compact() {
-	font-size: var(--vkui--calendar_font_text_event_small--font_size--compact, 12px);
-	line-height: var(--vkui--calendar_font_text_event_small--line_height--compact, 12px);
-	font-weight: var(--vkui--calendar_font_text_event_small--font_weight--compact, 400);
-	font-family: var(--vkui--calendar_font_text_event_small--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
+font-event-m--compact() {
+	font-size: var(--vkui--font_event_m--font_size--compact, 17px);
+	line-height: var(--vkui--font_event_m--line_height--compact, 24px);
+	font-weight: var(--vkui--font_event_m--font_weight--compact, 500);
+	font-family: var(--vkui--font_event_m--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
+}
+font-event-m--regular() {
+	font-size: var(--vkui--font_event_m--font_size--regular, 15px);
+	line-height: var(--vkui--font_event_m--line_height--regular, 20px);
+	font-weight: var(--vkui--font_event_m--font_weight--regular, 500);
+	font-family: var(--vkui--font_event_m--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
+}
+font-event-s--compact() {
+	font-size: var(--vkui--font_event_s--font_size--compact, 15px);
+	line-height: var(--vkui--font_event_s--line_height--compact, 18px);
+	font-weight: var(--vkui--font_event_s--font_weight--compact, 500);
+	font-family: var(--vkui--font_event_s--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
+}
+font-event-s--regular() {
+	font-size: var(--vkui--font_event_s--font_size--regular, 13px);
+	line-height: var(--vkui--font_event_s--line_height--regular, 18px);
+	font-weight: var(--vkui--font_event_s--font_weight--regular, 500);
+	font-family: var(--vkui--font_event_s--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
+}
+font-event-x-s--regular() {
+	font-size: var(--vkui--font_event_x_s--font_size--regular, 12px);
+	line-height: var(--vkui--font_event_x_s--line_height--regular, 16px);
+	font-weight: var(--vkui--font_event_x_s--font_weight--regular, 500);
+	font-family: var(--vkui--font_event_x_s--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
+}
+font-time--regular() {
+	font-size: var(--vkui--font_time--font_size--regular, 13px);
+	line-height: var(--vkui--font_time--line_height--regular, 18px);
+	font-weight: var(--vkui--font_time--font_weight--regular, 500);
+	font-family: var(--vkui--font_time--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
+}
+font-body-i-o-s--regular() {
+	font-size: var(--vkui--font_body_i_o_s--font_size--regular, 17px);
+	line-height: var(--vkui--font_body_i_o_s--line_height--regular, 24px);
+	font-weight: var(--vkui--font_body_i_o_s--font_weight--regular, 500);
+	font-family: var(--vkui--font_body_i_o_s--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
+}
+font-body-android--regular() {
+	font-size: var(--vkui--font_body_android--font_size--regular, 16px);
+	line-height: var(--vkui--font_body_android--line_height--regular, 24px);
+	font-weight: var(--vkui--font_body_android--font_weight--regular, 500);
+	font-family: var(--vkui--font_body_android--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
 font-headline--regular() {
-	font-size: var(--vkui--font_headline--font_size--regular, 16px);
+	font-size: var(--vkui--font_headline--font_size--regular, 15px);
 	line-height: var(--vkui--font_headline--line_height--regular, 20px);
 	font-weight: var(--vkui--font_headline--font_weight--regular, 500);
 	font-family: var(--vkui--font_headline--font_family--regular, MailSans, Helvetica, Arial, sans-serif);
 }
-font-headline--compact() {
-	font-size: var(--vkui--font_headline--font_size--compact, 15px);
-	line-height: var(--vkui--font_headline--line_height--compact, 20px);
-	font-weight: var(--vkui--font_headline--font_weight--compact, 500);
-	font-family: var(--vkui--font_headline--font_family--compact, MailSans, Helvetica, Arial, sans-serif);
-}
 media-width-touch(content) {
 	@media (max-width: 767px) { content }
 }