@vkontakte/vkui-tokens 4.3.2-dev-db778e.0 → 4.4.0

package/themes/calendarDark/index.less

@@ -13,7 +13,7 @@
 @size-popup-base-padding--compact: 32px;
 @size-popup-header-padding--regular: 16px;
 @size-popup-header-padding--compact: 24px;
-@size-border-radius--compact: 8px;
+@size-border-radius--compact: 12px;
 @size-border-radius--regular: 8px;
 @size-check-border-radius--regular: 4px;
 @size-border-radius-paper--regular: 12px;
@@ -33,8 +33,8 @@
 @size-popup-medium--regular: 680px;
 @size-popup-large--regular: 880px;
 @size-field-horizontal-padding--regular: 8px;
-@size-button-padding-horizontal--compact: 16px;
-@size-button-padding-horizontal--regular: 20px;
+@size-button-padding-horizontal--compact: 12px;
+@size-button-padding-horizontal--regular: 16px;
 @size-label-horizontal-margin--regular: 16px;
 @size-arrow-padding--regular: 12px;
 @size-tooltip-margin--regular: 8px;
@@ -54,10 +54,13 @@
 @size-card-border-radius--regular: 16px;
 @size-cardgrid-padding-vertical--regular: 8px;
 @size-base-padding-horizontal--regular: 16px;
-@elevation1: 0 2px 0 0 rgba(0, 16, 61, 0.04);
-@elevation2: 0 4px 32px 0 rgba(0, 16, 61, 0.32);
-@elevation3: 0 16px 48px 0 rgba(0, 0, 0, 0.48);
-@elevation4: 0 16px 48px 0 rgba(0, 0, 0, 0.48);
+@size-button-group-gap-space--regular: 1px;
+@size-button-group-gap-small--regular: 8px;
+@size-button-group-gap-medium--regular: 12px;
+@elevation1: none;
+@elevation2: none;
+@elevation3: 0px 4px 32px rgba(0, 16, 61, 0.32);
+@elevation4: 0px 16px 48px rgba(0, 16, 61, 0.48);
 @animation-duration-l: 0.4s;
 @animation-duration-m: 0.2s;
 @animation-duration-s: 0.1s;
@@ -295,9 +298,9 @@
 @color-image-border-alpha: rgba(255, 255, 255, 0.08);
 @color-image-border-alpha--hover: rgba(255, 255, 255, 0.12);
 @color-image-border-alpha--active: rgba(255, 255, 255, 0.16);
-@color-field-border-alpha: rgba(255, 255, 255, 0.16);
-@color-field-border-alpha--hover: rgba(255, 255, 255, 0.2);
-@color-field-border-alpha--active: rgba(255, 255, 255, 0.24);
+@color-field-border-alpha: transparent;
+@color-field-border-alpha--hover: transparent;
+@color-field-border-alpha--active: transparent;
 @color-separator-primary-alpha: rgba(0, 0, 0, 0.4);
 @color-separator-primary-alpha--hover: rgba(0, 0, 0, 0.44);
 @color-separator-primary-alpha--active: rgba(0, 0, 0, 0.48);
@@ -394,54 +397,27 @@
 @color-thumb-error-background-alpha: rgba(237, 10, 52, 0.12);
 @color-thumb-error-background-alpha--hover: rgba(237, 10, 52, 0.16);
 @color-thumb-error-background-alpha--active: rgba(237, 10, 52, 0.2);
-@calendar-color-background-accent-tint-themed: #3E3E3F;
-@calendar-color-background-accent-tint-themed--hover: #2C2C2D;
-@calendar-color-background-accent-tint-themed--active: #3E3E3F;
 
 
 .font-title1--regular {
-	font-size: 24px;
-	line-height: 32px;
-	font-weight: 500;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
-.font-title1--compact {
-	font-size: 24px;
-	line-height: 28px;
-	font-weight: 500;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
-.font-title2--regular {
-	font-size: 20px;
-	line-height: 24px;
-	font-weight: 500;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
-.font-title2--compact {
-	font-size: 20px;
-	line-height: 24px;
-	font-weight: 500;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
-.font-title3--regular {
 	font-size: 17px;
 	line-height: 24px;
 	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.font-title3--compact {
-	font-size: 17px;
-	line-height: 24px;
+.font-title2--regular {
+	font-size: 15px;
+	line-height: 20px;
 	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.font-headline1--regular {
-	font-size: 16px;
+.font-title3--regular {
+	font-size: 15px;
 	line-height: 20px;
 	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.font-headline1--compact {
+.font-headline1--regular {
 	font-size: 15px;
 	line-height: 20px;
 	font-weight: 500;
@@ -459,221 +435,173 @@
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 	font-weight: 500;
 }
-.font-text--regular {
-	font-size: 16px;
-	line-height: 20px;
-	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
 .font-text--compact {
-	font-size: 15px;
-	line-height: 20px;
+	font-size: 17px;
+	line-height: 24px;
 	font-weight: 400;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.font-paragraph--regular {
+.font-text--regular {
 	font-size: 15px;
 	line-height: 20px;
 	font-weight: 400;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.font-paragraph--compact {
+.font-paragraph--regular {
 	font-size: 15px;
 	line-height: 20px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
 .font-subhead--regular {
 	font-size: 14px;
 	line-height: 18px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
 .font-subhead--compact {
 	font-size: 13px;
 	line-height: 18px;
-	font-weight: 500;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
-.font-footnote--regular {
-	font-size: 13px;
-	line-height: 18px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.font-footnote--compact {
+.font-footnote--regular {
 	font-size: 13px;
-	line-height: 18px;
+	line-height: 20px;
 	font-weight: 400;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
 .font-footnote-caps--regular {
 	font-size: 13px;
 	line-height: 18px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-	letter-spacing: 0.3px;
 	text-transform: uppercase;
-}
-.font-footnote-caps--compact {
-	font-size: 13px;
-	line-height: 18px;
-	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 	letter-spacing: 0.3px;
-	text-transform: uppercase;
 }
 .font-caption1--regular {
 	font-size: 12px;
 	line-height: 16px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
-.font-caption1--compact {
-	font-size: 12px;
-	line-height: 14px;
-	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
 .font-caption1-caps--regular {
 	font-size: 12px;
 	line-height: 16px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-	letter-spacing: 0.26px;
 	text-transform: uppercase;
-}
-.font-caption1-caps--compact {
-	font-size: 12px;
-	line-height: 14px;
-	font-weight: 500;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 	letter-spacing: 0.26px;
-	text-transform: uppercase;
 }
 .font-caption2--regular {
 	font-size: 11px;
-	line-height: 14px;
-	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
-.font-caption2--compact {
-	font-size: 11px;
-	line-height: 14px;
+	line-height: 12px;
 	font-weight: 400;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
 .font-caption2-caps--regular {
 	font-size: 11px;
 	line-height: 14px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-	letter-spacing: 0.22px;
 	text-transform: uppercase;
-}
-.font-caption2-caps--compact {
-	font-size: 11px;
-	line-height: 14px;
-	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 	letter-spacing: 0.22px;
-	text-transform: uppercase;
 }
 .font-caption3--regular {
 	font-size: 9px;
 	line-height: 12px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-}
-.font-caption3--compact {
-	font-size: 9px;
-	line-height: 12px;
-	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
 .font-caption3-caps--regular {
 	font-size: 9px;
 	line-height: 12px;
+	font-family: Helvetica, Arial, sans-serif;
 	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
-	letter-spacing: 0.16px;
 	text-transform: uppercase;
-}
-.font-caption3-caps--compact {
-	font-size: 9px;
-	line-height: 12px;
-	font-weight: 400;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
 	letter-spacing: 0.16px;
-	text-transform: uppercase;
 }
 .font-h0--regular {
-	font-size: 28px;
-	line-height: 32px;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
+	font-size: 32px;
+	line-height: 40px;
 	font-weight: 500;
-}
-.font-h0--compact {
-	font-size: 44px;
-	line-height: 52px;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
-	font-weight: 500;
 }
-.font-h1--regular {
+.font-h1--compact {
 	font-size: 24px;
-	line-height: 28px;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
+	line-height: 32px;
 	font-weight: 500;
+	font-family: MailSans, Helvetica, Arial, sans-serif;
+	margin-bottom: 16px;
 }
-.font-h1--compact {
+.font-h1--regular {
 	font-size: 32px;
-	line-height: 36px;
-	font-family: MailSans, Helvetica, Arial, sans-serif;
+	line-height: 40px;
 	font-weight: 500;
-}
-.font-h2--regular {
-	font-size: 20px;
-	line-height: 26px;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
-	font-weight: 500;
+	margin-bottom: 16px;
 }
 .font-h2--compact {
-	font-size: 28px;
-	line-height: 32px;
+	font-size: 20px;
+	line-height: 24px;
+	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
+}
+.font-h2--regular {
+	font-size: 24px;
+	line-height: 28px;
 	font-weight: 500;
+	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.calendar-font-text-event--regular {
+.font-event-m--compact {
 	font-size: 17px;
 	line-height: 24px;
-	font-weight: 400;
+	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.calendar-font-text-event--compact {
-	font-size: 13px;
-	line-height: 18px;
+.font-event-m--regular {
+	font-size: 15px;
+	line-height: 20px;
 	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.calendar-font-text-event-small--regular {
+.font-event-s--compact {
 	font-size: 15px;
-	line-height: 20px;
-	font-weight: 400;
+	line-height: 18px;
+	font-weight: 500;
+	font-family: MailSans, Helvetica, Arial, sans-serif;
+}
+.font-event-s--regular {
+	font-size: 13px;
+	line-height: 18px;
+	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.calendar-font-text-event-small--compact {
+.font-event-x-s--regular {
 	font-size: 12px;
-	line-height: 12px;
-	font-weight: 400;
+	line-height: 16px;
+	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.font-headline--regular {
+.font-time--regular {
+	font-size: 13px;
+	line-height: 18px;
+	font-weight: 500;
+	font-family: MailSans, Helvetica, Arial, sans-serif;
+}
+.font-body-i-o-s--regular {
+	font-size: 17px;
+	line-height: 24px;
+	font-weight: 500;
+	font-family: MailSans, Helvetica, Arial, sans-serif;
+}
+.font-body-android--regular {
 	font-size: 16px;
-	line-height: 20px;
+	line-height: 24px;
 	font-weight: 500;
 	font-family: MailSans, Helvetica, Arial, sans-serif;
 }
-.font-headline--compact {
+.font-headline--regular {
 	font-size: 15px;
 	line-height: 20px;
 	font-weight: 500;