@vkontakte/vkui-tokens 4.35.2-dev-cfbf64.0 → 4.37.0

package/themes/vkCom/cssVars/theme/index.json

@@ -817,6 +817,16 @@
 			"value": "var(--vkui--size_border_radius--regular, 8px)"
 		}
 	},
+	"sizeBorderRadiusRounded": {
+		"auto": {
+			"name": "--vkui--size_border_radius_rounded",
+			"value": "var(--vkui--size_border_radius_rounded)"
+		},
+		"regular": {
+			"name": "--vkui--size_border_radius_rounded--regular",
+			"value": "var(--vkui--size_border_radius_rounded--regular, 48px)"
+		}
+	},
 	"sizeCheckBorderRadius": {
 		"auto": {
 			"name": "--vkui--size_check_border_radius",
@@ -1652,15 +1662,15 @@
 	"colorBackgroundSecondaryAlpha": {
 		"normal": {
 			"name": "--vkui--color_background_secondary_alpha",
-			"value": "var(--vkui--color_background_secondary_alpha, rgba(0, 0, 0, 0.04))"
+			"value": "var(--vkui--color_background_secondary_alpha, rgba(229, 235, 241, 0.99))"
 		},
 		"hover": {
 			"name": "--vkui--color_background_secondary_alpha--hover",
-			"value": "var(--vkui--color_background_secondary_alpha--hover, rgba(0, 0, 0, 0.08))"
+			"value": "var(--vkui--color_background_secondary_alpha--hover, rgba(213, 224, 234, 0.99))"
 		},
 		"active": {
 			"name": "--vkui--color_background_secondary_alpha--active",
-			"value": "var(--vkui--color_background_secondary_alpha--active, rgba(0, 0, 0, 0.12))"
+			"value": "var(--vkui--color_background_secondary_alpha--active, rgba(200, 212, 224, 0.99))"
 		}
 	},
 	"colorBackgroundTertiary": {
@@ -1708,7 +1718,7 @@
 	"colorBackgroundContrastSecondaryAlpha": {
 		"normal": {
 			"name": "--vkui--color_background_contrast_secondary_alpha",
-			"value": "var(--vkui--color_background_contrast_secondary_alpha, rgba(255, 255, 255, 0.2))"
+			"value": "var(--vkui--color_background_contrast_secondary_alpha, rgba(255, 255, 255, 0.20))"
 		},
 		"hover": {
 			"name": "--vkui--color_background_contrast_secondary_alpha--hover",
@@ -1764,7 +1774,7 @@
 	"colorBackgroundWarning": {
 		"normal": {
 			"name": "--vkui--color_background_warning",
-			"value": "var(--vkui--color_background_warning, #FFF2D6)"
+			"value": "var(--vkui--color_background_warning, #fff2d6)"
 		},
 		"hover": {
 			"name": "--vkui--color_background_warning--hover",
@@ -1806,7 +1816,7 @@
 	"colorBackgroundNegativeTint": {
 		"normal": {
 			"name": "--vkui--color_background_negative_tint",
-			"value": "var(--vkui--color_background_negative_tint, #FAEBEB)"
+			"value": "var(--vkui--color_background_negative_tint, #faebeb)"
 		},
 		"hover": {
 			"name": "--vkui--color_background_negative_tint--hover",
@@ -1820,7 +1830,7 @@
 	"colorBackgroundPositiveTint": {
 		"normal": {
 			"name": "--vkui--color_background_positive_tint",
-			"value": "var(--vkui--color_background_positive_tint, #E8f9e8)"
+			"value": "var(--vkui--color_background_positive_tint, #e8f9e8)"
 		},
 		"hover": {
 			"name": "--vkui--color_background_positive_tint--hover",
@@ -2044,7 +2054,7 @@
 	"colorTextLinkTint": {
 		"normal": {
 			"name": "--vkui--color_text_link_tint",
-			"value": "var(--vkui--color_text_link_tint, #71AAEB)"
+			"value": "var(--vkui--color_text_link_tint, #71aaeb)"
 		},
 		"hover": {
 			"name": "--vkui--color_text_link_tint--hover",
@@ -2058,7 +2068,7 @@
 	"colorTextLinkVisited": {
 		"normal": {
 			"name": "--vkui--color_text_link_visited",
-			"value": "var(--vkui--color_text_link_visited, #4986CC)"
+			"value": "var(--vkui--color_text_link_visited, #4986cc)"
 		},
 		"hover": {
 			"name": "--vkui--color_text_link_visited--hover",
@@ -2142,7 +2152,7 @@
 	"colorIconPrimary": {
 		"normal": {
 			"name": "--vkui--color_icon_primary",
-			"value": "var(--vkui--color_icon_primary, #2C2D2E)"
+			"value": "var(--vkui--color_icon_primary, #2c2d2e)"
 		},
 		"hover": {
 			"name": "--vkui--color_icon_primary--hover",
@@ -2282,7 +2292,7 @@
 	"colorIconContrastSecondary": {
 		"normal": {
 			"name": "--vkui--color_icon_contrast_secondary",
-			"value": "var(--vkui--color_icon_contrast_secondary, #F2F3F5)"
+			"value": "var(--vkui--color_icon_contrast_secondary, #f2f3f5)"
 		},
 		"hover": {
 			"name": "--vkui--color_icon_contrast_secondary--hover",
@@ -2366,7 +2376,7 @@
 	"colorSeparatorPrimary": {
 		"normal": {
 			"name": "--vkui--color_separator_primary",
-			"value": "var(--vkui--color_separator_primary, #D7D8D9)"
+			"value": "var(--vkui--color_separator_primary, #d7d8d9)"
 		},
 		"hover": {
 			"name": "--vkui--color_separator_primary--hover",
@@ -2464,7 +2474,7 @@
 	"colorStrokeContrast": {
 		"normal": {
 			"name": "--vkui--color_stroke_contrast",
-			"value": "var(--vkui--color_stroke_contrast, #FFFFFF)"
+			"value": "var(--vkui--color_stroke_contrast, #ffffff)"
 		},
 		"hover": {
 			"name": "--vkui--color_stroke_contrast--hover",
@@ -2590,7 +2600,7 @@
 	"colorAccentOrangeFire": {
 		"normal": {
 			"name": "--vkui--color_accent_orange_fire",
-			"value": "var(--vkui--color_accent_orange_fire, #F05C44)"
+			"value": "var(--vkui--color_accent_orange_fire, #f05c44)"
 		},
 		"hover": {
 			"name": "--vkui--color_accent_orange_fire--hover",
@@ -2632,7 +2642,7 @@
 	"colorAccentRaspberryPink": {
 		"normal": {
 			"name": "--vkui--color_accent_raspberry_pink",
-			"value": "var(--vkui--color_accent_raspberry_pink, #E03FAB)"
+			"value": "var(--vkui--color_accent_raspberry_pink, #e03fab)"
 		},
 		"hover": {
 			"name": "--vkui--color_accent_raspberry_pink--hover",
@@ -2646,7 +2656,7 @@
 	"colorAccentSecondary": {
 		"normal": {
 			"name": "--vkui--color_accent_secondary",
-			"value": "var(--vkui--color_accent_secondary, #3F8AE0)"
+			"value": "var(--vkui--color_accent_secondary, #3f8ae0)"
 		},
 		"hover": {
 			"name": "--vkui--color_accent_secondary--hover",
@@ -2660,7 +2670,7 @@
 	"colorOverlayPrimary": {
 		"normal": {
 			"name": "--vkui--color_overlay_primary",
-			"value": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.4))"
+			"value": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))"
 		},
 		"hover": {
 			"name": "--vkui--color_overlay_primary--hover",
@@ -2671,10 +2681,24 @@
 			"value": "var(--vkui--color_overlay_primary--active, rgba(0, 0, 0, 0.48))"
 		}
 	},
+	"colorOverlaySecondary": {
+		"normal": {
+			"name": "--vkui--color_overlay_secondary",
+			"value": "var(--vkui--color_overlay_secondary, rgb(44, 45, 46, 0.5))"
+		},
+		"hover": {
+			"name": "--vkui--color_overlay_secondary--hover",
+			"value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))"
+		},
+		"active": {
+			"name": "--vkui--color_overlay_secondary--active",
+			"value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))"
+		}
+	},
 	"colorAvatarOverlay": {
 		"normal": {
 			"name": "--vkui--color_avatar_overlay",
-			"value": "var(--vkui--color_avatar_overlay, rgba(0, 0, 0, 0.6))"
+			"value": "var(--vkui--color_avatar_overlay, rgba(0, 0, 0, 0.60))"
 		},
 		"hover": {
 			"name": "--vkui--color_avatar_overlay--hover",
@@ -2702,7 +2726,7 @@
 	"colorActionSheetText": {
 		"normal": {
 			"name": "--vkui--color_action_sheet_text",
-			"value": "var(--vkui--color_action_sheet_text, #3F8AE0)"
+			"value": "var(--vkui--color_action_sheet_text, #3f8ae0)"
 		},
 		"hover": {
 			"name": "--vkui--color_action_sheet_text--hover",
@@ -2716,7 +2740,7 @@
 	"colorImagePlaceholder": {
 		"normal": {
 			"name": "--vkui--color_image_placeholder",
-			"value": "var(--vkui--color_image_placeholder, #F2F3F5)"
+			"value": "var(--vkui--color_image_placeholder, #f2f3f5)"
 		},
 		"hover": {
 			"name": "--vkui--color_image_placeholder--hover",
@@ -2884,7 +2908,7 @@
 	"colorSegmentedControl": {
 		"normal": {
 			"name": "--vkui--color_segmented_control",
-			"value": "var(--vkui--color_segmented_control, #FFFFFF)"
+			"value": "var(--vkui--color_segmented_control, #ffffff)"
 		},
 		"hover": {
 			"name": "--vkui--color_segmented_control--hover",
@@ -2895,6 +2919,20 @@
 			"value": "var(--vkui--color_segmented_control--active, #EBECEF)"
 		}
 	},
+	"colorTabbarTextInactive": {
+		"normal": {
+			"name": "--vkui--color_tabbar_text_inactive",
+			"value": "var(--vkui--color_tabbar_text_inactive, #99a2ad)"
+		},
+		"hover": {
+			"name": "--vkui--color_tabbar_text_inactive--hover",
+			"value": "var(--vkui--color_tabbar_text_inactive--hover, #939CA9)"
+		},
+		"active": {
+			"name": "--vkui--color_tabbar_text_inactive--active",
+			"value": "var(--vkui--color_tabbar_text_inactive--active, #8D96A4)"
+		}
+	},
 	"colorTransparent": {
 		"normal": {
 			"name": "--vkui--color_transparent",

package/themes/vkCom/docs.json

@@ -753,6 +753,18 @@
       }
     ]
   },
+  "colorOverlaySecondary": {
+    "tags": [
+      "color",
+      "overlay"
+    ],
+    "desc": [
+      {
+        "type": "text",
+        "text": "Вторичный цвет для подложек оверлеев"
+      }
+    ]
+  },
   "colorPanelHeaderIcon": {
     "tags": [
       "color",
@@ -961,6 +973,19 @@
       }
     ]
   },
+  "colorTabbarTextInactive": {
+    "tags": [
+      "color",
+      "component",
+      "background"
+    ],
+    "desc": [
+      {
+        "type": "text",
+        "text": "Цвет текста для неактивного таба в таббаре"
+      }
+    ]
+  },
   "colorTextAccent": {
     "tags": [
       "color",
@@ -1878,6 +1903,18 @@
       }
     ]
   },
+  "sizeBorderRadiusRounded": {
+    "tags": [
+      "size",
+      "stroke"
+    ],
+    "desc": [
+      {
+        "type": "text",
+        "text": "Значение радиуса закругления для круглых кнопок"
+      }
+    ]
+  },
   "sizeButtonBaseLargePaddingHorizontal": {
     "tags": [
       "size",

package/themes/vkCom/index.css

@@ -102,6 +102,7 @@
 	--vkui--size_popup_header_padding--compact: 16px;
 	--vkui--size_label_horizontal_margin--regular: 16px;
 	--vkui--size_border_radius--regular: 8px;
+	--vkui--size_border_radius_rounded--regular: 48px;
 	--vkui--size_check_border_radius--regular: 4px;
 	--vkui--size_border_radius_paper--regular: 12px;
 	--vkui--size_border_radius_promo--regular: 20px;
@@ -212,9 +213,9 @@
 	--vkui--color_background_secondary: #F0F2F5;
 	--vkui--color_background_secondary--hover: #E6E9EE;
 	--vkui--color_background_secondary--active: #DDE0E6;
-	--vkui--color_background_secondary_alpha: rgba(0, 0, 0, 0.04);
-	--vkui--color_background_secondary_alpha--hover: rgba(0, 0, 0, 0.08);
-	--vkui--color_background_secondary_alpha--active: rgba(0, 0, 0, 0.12);
+	--vkui--color_background_secondary_alpha: rgba(229, 235, 241, 0.99);
+	--vkui--color_background_secondary_alpha--hover: rgba(213, 224, 234, 0.99);
+	--vkui--color_background_secondary_alpha--active: rgba(200, 212, 224, 0.99);
 	--vkui--color_background_tertiary: #FAFBFC;
 	--vkui--color_background_tertiary--hover: #F0F2F4;
 	--vkui--color_background_tertiary--active: #E6E8ED;
@@ -224,7 +225,7 @@
 	--vkui--color_background_contrast: #FFFFFF;
 	--vkui--color_background_contrast--hover: #F5F5F7;
 	--vkui--color_background_contrast--active: #EBECEF;
-	--vkui--color_background_contrast_secondary_alpha: rgba(255, 255, 255, 0.2);
+	--vkui--color_background_contrast_secondary_alpha: rgba(255, 255, 255, 0.20);
 	--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: #333333;
@@ -236,7 +237,7 @@
 	--vkui--color_background_modal_inverse: #000000;
 	--vkui--color_background_modal_inverse--hover: #000102;
 	--vkui--color_background_modal_inverse--active: #000105;
-	--vkui--color_background_warning: #FFF2D6;
+	--vkui--color_background_warning: #fff2d6;
 	--vkui--color_background_warning--hover: #F5E9D0;
 	--vkui--color_background_warning--active: #EBE0CA;
 	--vkui--color_background_positive: #4BB34B;
@@ -245,10 +246,10 @@
 	--vkui--color_background_negative: #E64646;
 	--vkui--color_background_negative--hover: #DD4446;
 	--vkui--color_background_negative--active: #D44245;
-	--vkui--color_background_negative_tint: #FAEBEB;
+	--vkui--color_background_negative_tint: #faebeb;
 	--vkui--color_background_negative_tint--hover: #F0E2E4;
 	--vkui--color_background_negative_tint--active: #E6D9DD;
-	--vkui--color_background_positive_tint: #E8f9e8;
+	--vkui--color_background_positive_tint: #e8f9e8;
 	--vkui--color_background_positive_tint--hover: #DFF0E1;
 	--vkui--color_background_positive_tint--active: #D5E6DA;
 	--vkui--color_field_background: #F7F8FA;
@@ -296,10 +297,10 @@
 	--vkui--color_text_link_themed: #2A5885;
 	--vkui--color_text_link_themed--hover: #285582;
 	--vkui--color_text_link_themed--active: #27527F;
-	--vkui--color_text_link_tint: #71AAEB;
+	--vkui--color_text_link_tint: #71aaeb;
 	--vkui--color_text_link_tint--hover: #6CA4E4;
 	--vkui--color_text_link_tint--active: #689EDD;
-	--vkui--color_text_link_visited: #4986CC;
+	--vkui--color_text_link_visited: #4986cc;
 	--vkui--color_text_link_visited--hover: #4681C6;
 	--vkui--color_text_link_visited--active: #437DC1;
 	--vkui--color_text_muted: #333333;
@@ -317,7 +318,7 @@
 	--vkui--color_icon_accent_themed: #447BBA;
 	--vkui--color_icon_accent_themed--hover: #4177B5;
 	--vkui--color_icon_accent_themed--active: #3F72B0;
-	--vkui--color_icon_primary: #2C2D2E;
+	--vkui--color_icon_primary: #2c2d2e;
 	--vkui--color_icon_primary--hover: #2A2C2F;
 	--vkui--color_icon_primary--active: #282B2F;
 	--vkui--color_icon_primary_invariably: #333333;
@@ -347,7 +348,7 @@
 	--vkui--color_icon_contrast_themed: #FFFFFF;
 	--vkui--color_icon_contrast_themed--hover: #F5F5F7;
 	--vkui--color_icon_contrast_themed--active: #EBECEF;
-	--vkui--color_icon_contrast_secondary: #F2F3F5;
+	--vkui--color_icon_contrast_secondary: #f2f3f5;
 	--vkui--color_icon_contrast_secondary--hover: #E8EAEE;
 	--vkui--color_icon_contrast_secondary--active: #DFE1E6;
 	--vkui--color_icon_positive: #4BB34B;
@@ -365,7 +366,7 @@
 	--vkui--color_stroke_accent_themed: #447BBA;
 	--vkui--color_stroke_accent_themed--hover: #4177B5;
 	--vkui--color_stroke_accent_themed--active: #3F72B0;
-	--vkui--color_separator_primary: #D7D8D9;
+	--vkui--color_separator_primary: #d7d8d9;
 	--vkui--color_separator_primary--hover: #CED0D3;
 	--vkui--color_separator_primary--active: #C6C8CD;
 	--vkui--color_separator_primary2x: #cbcccd;
@@ -386,7 +387,7 @@
 	--vkui--color_stroke_negative: #E64646;
 	--vkui--color_stroke_negative--hover: #DD4446;
 	--vkui--color_stroke_negative--active: #D44245;
-	--vkui--color_stroke_contrast: #FFFFFF;
+	--vkui--color_stroke_contrast: #ffffff;
 	--vkui--color_stroke_contrast--hover: #F5F5F7;
 	--vkui--color_stroke_contrast--active: #EBECEF;
 	--vkui--color_image_border_alpha: rgba(0, 0, 0, 0.08);
@@ -413,7 +414,7 @@
 	--vkui--color_accent_orange: #FFA000;
 	--vkui--color_accent_orange--hover: #F59A02;
 	--vkui--color_accent_orange--active: #EB9405;
-	--vkui--color_accent_orange_fire: #F05C44;
+	--vkui--color_accent_orange_fire: #f05c44;
 	--vkui--color_accent_orange_fire--hover: #E65944;
 	--vkui--color_accent_orange_fire--active: #DD5643;
 	--vkui--color_accent_purple: #735CE6;
@@ -422,25 +423,28 @@
 	--vkui--color_accent_violet: #792EC0;
 	--vkui--color_accent_violet--hover: #742DBB;
 	--vkui--color_accent_violet--active: #6F2CB6;
-	--vkui--color_accent_raspberry_pink: #E03FAB;
+	--vkui--color_accent_raspberry_pink: #e03fab;
 	--vkui--color_accent_raspberry_pink--hover: #D73DA7;
 	--vkui--color_accent_raspberry_pink--active: #CE3BA2;
-	--vkui--color_accent_secondary: #3F8AE0;
+	--vkui--color_accent_secondary: #3f8ae0;
 	--vkui--color_accent_secondary--hover: #3C85D9;
 	--vkui--color_accent_secondary--active: #3A80D3;
-	--vkui--color_overlay_primary: rgba(0, 0, 0, 0.4);
+	--vkui--color_overlay_primary: rgba(0, 0, 0, 0.40);
 	--vkui--color_overlay_primary--hover: rgba(0, 0, 0, 0.44);
 	--vkui--color_overlay_primary--active: rgba(0, 0, 0, 0.48);
-	--vkui--color_avatar_overlay: rgba(0, 0, 0, 0.6);
+	--vkui--color_overlay_secondary: rgb(44, 45, 46, 0.5);
+	--vkui--color_overlay_secondary--hover: rgba(44, 45, 46, 0.54);
+	--vkui--color_overlay_secondary--active: rgba(44, 45, 46, 0.58);
+	--vkui--color_avatar_overlay: rgba(0, 0, 0, 0.60);
 	--vkui--color_avatar_overlay--hover: rgba(0, 0, 0, 0.64);
 	--vkui--color_avatar_overlay--active: rgba(0, 0, 0, 0.68);
 	--vkui--color_avatar_overlay_inverse_alpha: rgba(255, 255, 255, 0.85);
 	--vkui--color_avatar_overlay_inverse_alpha--hover: rgba(255, 255, 255, 0.89);
 	--vkui--color_avatar_overlay_inverse_alpha--active: rgba(255, 255, 255, 0.93);
-	--vkui--color_action_sheet_text: #3F8AE0;
+	--vkui--color_action_sheet_text: #3f8ae0;
 	--vkui--color_action_sheet_text--hover: #3C85D9;
 	--vkui--color_action_sheet_text--active: #3A80D3;
-	--vkui--color_image_placeholder: #F2F3F5;
+	--vkui--color_image_placeholder: #f2f3f5;
 	--vkui--color_image_placeholder--hover: #E8EAEE;
 	--vkui--color_image_placeholder--active: #DFE1E6;
 	--vkui--color_image_placeholder_alpha: rgba(0, 28, 61, 0.08);
@@ -476,9 +480,12 @@
 	--vkui--color_panel_header_icon: #447BBA;
 	--vkui--color_panel_header_icon--hover: #4177B5;
 	--vkui--color_panel_header_icon--active: #3F72B0;
-	--vkui--color_segmented_control: #FFFFFF;
+	--vkui--color_segmented_control: #ffffff;
 	--vkui--color_segmented_control--hover: #F5F5F7;
 	--vkui--color_segmented_control--active: #EBECEF;
+	--vkui--color_tabbar_text_inactive: #99a2ad;
+	--vkui--color_tabbar_text_inactive--hover: #939CA9;
+	--vkui--color_tabbar_text_inactive--active: #8D96A4;
 	--vkui--color_transparent: transparent;
 	--vkui--color_transparent--hover: rgba(0, 16, 61, 0.04);
 	--vkui--color_transparent--active: rgba(0, 16, 61, 0.08);

package/themes/vkCom/index.js

@@ -186,6 +186,9 @@ var theme = {
     "sizeBorderRadius": {
         "regular": 8
     },
+    "sizeBorderRadiusRounded": {
+        "regular": 48
+    },
     "sizeCheckBorderRadius": {
         "regular": 4
     },
@@ -435,9 +438,9 @@ var theme = {
         "active": "#DDE0E6"
     },
     "colorBackgroundSecondaryAlpha": {
-        "normal": "rgba(0, 0, 0, 0.04)",
-        "hover": "rgba(0, 0, 0, 0.08)",
-        "active": "rgba(0, 0, 0, 0.12)"
+        "normal": "rgba(229, 235, 241, 0.99)",
+        "hover": "rgba(213, 224, 234, 0.99)",
+        "active": "rgba(200, 212, 224, 0.99)"
     },
     "colorBackgroundTertiary": {
         "normal": "#FAFBFC",
@@ -455,7 +458,7 @@ var theme = {
         "active": "#EBECEF"
     },
     "colorBackgroundContrastSecondaryAlpha": {
-        "normal": "rgba(255, 255, 255, 0.2)",
+        "normal": "rgba(255, 255, 255, 0.20)",
         "hover": "rgba(255, 255, 255, 0.24)",
         "active": "rgba(255, 255, 255, 0.28)"
     },
@@ -475,7 +478,7 @@ var theme = {
         "active": "#000105"
     },
     "colorBackgroundWarning": {
-        "normal": "#FFF2D6",
+        "normal": "#fff2d6",
         "hover": "#F5E9D0",
         "active": "#EBE0CA"
     },
@@ -490,12 +493,12 @@ var theme = {
         "active": "#D44245"
     },
     "colorBackgroundNegativeTint": {
-        "normal": "#FAEBEB",
+        "normal": "#faebeb",
         "hover": "#F0E2E4",
         "active": "#E6D9DD"
     },
     "colorBackgroundPositiveTint": {
-        "normal": "#E8f9e8",
+        "normal": "#e8f9e8",
         "hover": "#DFF0E1",
         "active": "#D5E6DA"
     },
@@ -575,12 +578,12 @@ var theme = {
         "active": "#27527F"
     },
     "colorTextLinkTint": {
-        "normal": "#71AAEB",
+        "normal": "#71aaeb",
         "hover": "#6CA4E4",
         "active": "#689EDD"
     },
     "colorTextLinkVisited": {
-        "normal": "#4986CC",
+        "normal": "#4986cc",
         "hover": "#4681C6",
         "active": "#437DC1"
     },
@@ -610,7 +613,7 @@ var theme = {
         "active": "#3F72B0"
     },
     "colorIconPrimary": {
-        "normal": "#2C2D2E",
+        "normal": "#2c2d2e",
         "hover": "#2A2C2F",
         "active": "#282B2F"
     },
@@ -660,7 +663,7 @@ var theme = {
         "active": "#EBECEF"
     },
     "colorIconContrastSecondary": {
-        "normal": "#F2F3F5",
+        "normal": "#f2f3f5",
         "hover": "#E8EAEE",
         "active": "#DFE1E6"
     },
@@ -690,7 +693,7 @@ var theme = {
         "active": "#3F72B0"
     },
     "colorSeparatorPrimary": {
-        "normal": "#D7D8D9",
+        "normal": "#d7d8d9",
         "hover": "#CED0D3",
         "active": "#C6C8CD"
     },
@@ -725,7 +728,7 @@ var theme = {
         "active": "#D44245"
     },
     "colorStrokeContrast": {
-        "normal": "#FFFFFF",
+        "normal": "#ffffff",
         "hover": "#F5F5F7",
         "active": "#EBECEF"
     },
@@ -770,7 +773,7 @@ var theme = {
         "active": "#EB9405"
     },
     "colorAccentOrangeFire": {
-        "normal": "#F05C44",
+        "normal": "#f05c44",
         "hover": "#E65944",
         "active": "#DD5643"
     },
@@ -785,22 +788,27 @@ var theme = {
         "active": "#6F2CB6"
     },
     "colorAccentRaspberryPink": {
-        "normal": "#E03FAB",
+        "normal": "#e03fab",
         "hover": "#D73DA7",
         "active": "#CE3BA2"
     },
     "colorAccentSecondary": {
-        "normal": "#3F8AE0",
+        "normal": "#3f8ae0",
         "hover": "#3C85D9",
         "active": "#3A80D3"
     },
     "colorOverlayPrimary": {
-        "normal": "rgba(0, 0, 0, 0.4)",
+        "normal": "rgba(0, 0, 0, 0.40)",
         "hover": "rgba(0, 0, 0, 0.44)",
         "active": "rgba(0, 0, 0, 0.48)"
     },
+    "colorOverlaySecondary": {
+        "normal": "rgb(44, 45, 46, 0.5)",
+        "hover": "rgba(44, 45, 46, 0.54)",
+        "active": "rgba(44, 45, 46, 0.58)"
+    },
     "colorAvatarOverlay": {
-        "normal": "rgba(0, 0, 0, 0.6)",
+        "normal": "rgba(0, 0, 0, 0.60)",
         "hover": "rgba(0, 0, 0, 0.64)",
         "active": "rgba(0, 0, 0, 0.68)"
     },
@@ -810,12 +818,12 @@ var theme = {
         "active": "rgba(255, 255, 255, 0.93)"
     },
     "colorActionSheetText": {
-        "normal": "#3F8AE0",
+        "normal": "#3f8ae0",
         "hover": "#3C85D9",
         "active": "#3A80D3"
     },
     "colorImagePlaceholder": {
-        "normal": "#F2F3F5",
+        "normal": "#f2f3f5",
         "hover": "#E8EAEE",
         "active": "#DFE1E6"
     },
@@ -875,10 +883,15 @@ var theme = {
         "active": "#3F72B0"
     },
     "colorSegmentedControl": {
-        "normal": "#FFFFFF",
+        "normal": "#ffffff",
         "hover": "#F5F5F7",
         "active": "#EBECEF"
     },
+    "colorTabbarTextInactive": {
+        "normal": "#99a2ad",
+        "hover": "#939CA9",
+        "active": "#8D96A4"
+    },
     "colorTransparent": {
         "normal": "transparent",
         "hover": "rgba(0, 16, 61, 0.04)",