From 6fd98169bb57e588cc1ff539962c62877dd7e5bb Mon Sep 17 00:00:00 2001 From: Daniil Suvorov Date: Mon, 18 Dec 2023 16:39:00 +0300 Subject: [PATCH] feat: add colorBackgroundAccentThemedAlpha --- .../__snapshots__/snapthots.test.ts.snap | 1189 +++++++++++++++++ src/interfaces/general/colors/index.ts | 6 + src/themeDescriptions/base/figma/vk.json | 4 +- src/themeDescriptions/base/paradigm.ts | 2 + src/themeDescriptions/base/vk.ts | 1 + src/themeDescriptions/themes/vkCom/index.ts | 2 + 6 files changed, 1203 insertions(+), 1 deletion(-) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index e2424e81..027144ff 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -2034,6 +2034,20 @@ exports[`shapshots calendar theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -7137,6 +7151,11 @@ exports[`shapshots calendar theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -9163,6 +9182,11 @@ exports[`shapshots calendar theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -11189,6 +11213,11 @@ exports[`shapshots calendar theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -14532,6 +14561,20 @@ exports[`shapshots calendarDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -19635,6 +19678,11 @@ exports[`shapshots calendarDark theme should match pixelify theme snapshot 1`] = "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -21661,6 +21709,11 @@ exports[`shapshots calendarDark theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -23687,6 +23740,11 @@ exports[`shapshots calendarDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -25280,6 +25338,20 @@ exports[`shapshots calls theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -29457,6 +29529,11 @@ exports[`shapshots calls theme should match pixelify theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -30770,6 +30847,11 @@ exports[`shapshots calls theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -32083,6 +32165,11 @@ exports[`shapshots calls theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -33573,6 +33660,20 @@ exports[`shapshots cloud theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -37854,6 +37955,11 @@ exports[`shapshots cloud theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -39202,6 +39308,11 @@ exports[`shapshots cloud theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -40550,6 +40661,11 @@ exports[`shapshots cloud theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -42075,6 +42191,20 @@ exports[`shapshots cloudDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -46284,6 +46414,11 @@ exports[`shapshots cloudDark theme should match pixelify theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -47611,6 +47746,11 @@ exports[`shapshots cloudDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -48938,6 +49078,11 @@ exports[`shapshots cloudDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -50442,6 +50587,20 @@ exports[`shapshots home theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -54733,6 +54892,11 @@ exports[`shapshots home theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -56088,6 +56252,11 @@ exports[`shapshots home theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -57443,6 +57612,11 @@ exports[`shapshots home theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -58975,6 +59149,20 @@ exports[`shapshots homeDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -63262,6 +63450,11 @@ exports[`shapshots homeDark theme should match pixelify theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -64616,6 +64809,11 @@ exports[`shapshots homeDark theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -65970,6 +66168,11 @@ exports[`shapshots homeDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -67509,6 +67712,20 @@ exports[`shapshots media theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -73036,6 +73253,11 @@ exports[`shapshots media theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -74736,6 +74958,11 @@ exports[`shapshots media theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -76436,6 +76663,11 @@ exports[`shapshots media theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -78313,6 +78545,20 @@ exports[`shapshots mediaDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -83840,6 +84086,11 @@ exports[`shapshots mediaDark theme should match pixelify theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -85540,6 +85791,11 @@ exports[`shapshots mediaDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -87240,6 +87496,11 @@ exports[`shapshots mediaDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -89117,6 +89378,20 @@ exports[`shapshots mycom theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -94650,6 +94925,11 @@ exports[`shapshots mycom theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -96353,6 +96633,11 @@ exports[`shapshots mycom theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -98056,6 +98341,11 @@ exports[`shapshots mycom theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -99942,6 +100232,20 @@ exports[`shapshots octavius theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -106370,6 +106674,11 @@ exports[`shapshots octavius theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -108482,6 +108791,11 @@ exports[`shapshots octavius theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -110594,6 +110908,11 @@ exports[`shapshots octavius theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -112892,6 +113211,20 @@ exports[`shapshots octaviusCompact theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -119324,6 +119657,11 @@ exports[`shapshots octaviusCompact theme should match pixelify theme snapshot 1` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -121437,6 +121775,11 @@ exports[`shapshots octaviusCompact theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -123550,6 +123893,11 @@ exports[`shapshots octaviusCompact theme should match root theme snapshot 1`] = "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -125849,6 +126197,20 @@ exports[`shapshots octaviusCompactDark theme should match cssVars snapshot 1`] = "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -132281,6 +132643,11 @@ exports[`shapshots octaviusCompactDark theme should match pixelify theme snapsho "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -134394,6 +134761,11 @@ exports[`shapshots octaviusCompactDark theme should match pseudo theme from CssV "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -136507,6 +136879,11 @@ exports[`shapshots octaviusCompactDark theme should match root theme snapshot 1` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -138806,6 +139183,20 @@ exports[`shapshots octaviusDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -145234,6 +145625,11 @@ exports[`shapshots octaviusDark theme should match pixelify theme snapshot 1`] = "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -147346,6 +147742,11 @@ exports[`shapshots octaviusDark theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -149458,6 +149859,11 @@ exports[`shapshots octaviusDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -151756,6 +152162,20 @@ exports[`shapshots octaviusVK theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #2688eb)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -158136,6 +158556,11 @@ exports[`shapshots octaviusVK theme should match pixelify theme snapshot 1`] = ` "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -160231,6 +160656,11 @@ exports[`shapshots octaviusVK theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_accent_themed--hover, #2483E4)", "normal": "var(--vkui--color_background_accent_themed, #2688eb)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -162326,6 +162756,11 @@ exports[`shapshots octaviusVK theme should match root theme snapshot 1`] = ` "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -164607,6 +165042,20 @@ exports[`shapshots octaviusVKDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -170987,6 +171436,11 @@ exports[`shapshots octaviusVKDark theme should match pixelify theme snapshot 1`] "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -173082,6 +173536,11 @@ exports[`shapshots octaviusVKDark theme should match pseudo theme from CssVars 1 "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -175177,6 +175636,11 @@ exports[`shapshots octaviusVKDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -177458,6 +177922,20 @@ exports[`shapshots octaviusWhite theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -183886,6 +184364,11 @@ exports[`shapshots octaviusWhite theme should match pixelify theme snapshot 1`] "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -185998,6 +186481,11 @@ exports[`shapshots octaviusWhite theme should match pseudo theme from CssVars 1` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -188110,6 +188598,11 @@ exports[`shapshots octaviusWhite theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -190390,6 +190883,20 @@ exports[`shapshots otvet theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -194441,6 +194948,11 @@ exports[`shapshots otvet theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -195707,6 +196219,11 @@ exports[`shapshots otvet theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -196973,6 +197490,11 @@ exports[`shapshots otvet theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -198416,6 +198938,20 @@ exports[`shapshots otvetDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -202467,6 +203003,11 @@ exports[`shapshots otvetDark theme should match pixelify theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -203733,6 +204274,11 @@ exports[`shapshots otvetDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -204999,6 +205545,11 @@ exports[`shapshots otvetDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -206446,6 +206997,20 @@ exports[`shapshots paradigmBase theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -210651,6 +211216,11 @@ exports[`shapshots paradigmBase theme should match pixelify theme snapshot 1`] = "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -211977,6 +212547,11 @@ exports[`shapshots paradigmBase theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -213303,6 +213878,11 @@ exports[`shapshots paradigmBase theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -214806,6 +215386,20 @@ exports[`shapshots paradigmBaseDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -219015,6 +219609,11 @@ exports[`shapshots paradigmBaseDark theme should match pixelify theme snapshot 1 "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -220342,6 +220941,11 @@ exports[`shapshots paradigmBaseDark theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -221669,6 +222273,11 @@ exports[`shapshots paradigmBaseDark theme should match root theme snapshot 1`] = "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -223181,6 +223790,20 @@ exports[`shapshots pharma theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -228722,6 +229345,11 @@ exports[`shapshots pharma theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -230427,6 +231055,11 @@ exports[`shapshots pharma theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -232132,6 +232765,11 @@ exports[`shapshots pharma theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -234006,6 +234644,20 @@ exports[`shapshots portalUI theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -238531,6 +239183,11 @@ exports[`shapshots portalUI theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -239964,6 +240621,11 @@ exports[`shapshots portalUI theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -241397,6 +242059,11 @@ exports[`shapshots portalUI theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -243007,6 +243674,20 @@ exports[`shapshots portalUIDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -247528,6 +248209,11 @@ exports[`shapshots portalUIDark theme should match pixelify theme snapshot 1`] = "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -248960,6 +249646,11 @@ exports[`shapshots portalUIDark theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -250392,6 +251083,11 @@ exports[`shapshots portalUIDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -252017,6 +252713,20 @@ exports[`shapshots promo theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -257022,6 +257732,11 @@ exports[`shapshots promo theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -258588,6 +259303,11 @@ exports[`shapshots promo theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -260154,6 +260874,11 @@ exports[`shapshots promo theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -271919,6 +272644,20 @@ exports[`shapshots search theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -277130,6 +277869,11 @@ exports[`shapshots search theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -278712,6 +279456,11 @@ exports[`shapshots search theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -280294,6 +281043,11 @@ exports[`shapshots search theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -282053,6 +282807,20 @@ exports[`shapshots todo theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -286262,6 +287030,11 @@ exports[`shapshots todo theme should match pixelify theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -287589,6 +288362,11 @@ exports[`shapshots todo theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -288916,6 +289694,11 @@ exports[`shapshots todo theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -290410,6 +291193,20 @@ exports[`shapshots vkBase theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #2688eb)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -293419,6 +294216,11 @@ exports[`shapshots vkBase theme should match pixelify theme snapshot 1`] = ` "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -294379,6 +295181,11 @@ exports[`shapshots vkBase theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #2483E4)", "normal": "var(--vkui--color_background_accent_themed, #2688eb)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -295339,6 +296146,11 @@ exports[`shapshots vkBase theme should match root theme snapshot 1`] = ` "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -296476,6 +297288,20 @@ exports[`shapshots vkBaseDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -299489,6 +300315,11 @@ exports[`shapshots vkBaseDark theme should match pixelify theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -300450,6 +301281,11 @@ exports[`shapshots vkBaseDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -301411,6 +302247,11 @@ exports[`shapshots vkBaseDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -302549,6 +303390,20 @@ exports[`shapshots vkCom theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #447BBA)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(68, 123, 186, 0.2))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(68, 123, 186, 0.16))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(68, 123, 186, 0.12))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -305562,6 +306417,11 @@ exports[`shapshots vkCom theme should match pixelify theme snapshot 1`] = ` "hover": "#4177B5", "normal": "#447BBA", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(68, 123, 186, 0.2)", + "hover": "rgba(68, 123, 186, 0.16)", + "normal": "rgba(68, 123, 186, 0.12)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -306523,6 +307383,11 @@ exports[`shapshots vkCom theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #4177B5)", "normal": "var(--vkui--color_background_accent_themed, #447BBA)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(68, 123, 186, 0.2))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(68, 123, 186, 0.16))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(68, 123, 186, 0.12))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -307484,6 +308349,11 @@ exports[`shapshots vkCom theme should match root theme snapshot 1`] = ` "hover": "#4177B5", "normal": "#447BBA", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(68, 123, 186, 0.2)", + "hover": "rgba(68, 123, 186, 0.16)", + "normal": "rgba(68, 123, 186, 0.12)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -308622,6 +309492,20 @@ exports[`shapshots vkComDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #E1E3E6)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -311635,6 +312519,11 @@ exports[`shapshots vkComDark theme should match pixelify theme snapshot 1`] = ` "hover": "#D8DBDF", "normal": "#E1E3E6", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -312596,6 +313485,11 @@ exports[`shapshots vkComDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_accent_themed--hover, #D8DBDF)", "normal": "var(--vkui--color_background_accent_themed, #E1E3E6)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -313557,6 +314451,11 @@ exports[`shapshots vkComDark theme should match root theme snapshot 1`] = ` "hover": "#D8DBDF", "normal": "#E1E3E6", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -314695,6 +315594,20 @@ exports[`shapshots vkIOS theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #2688eb)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -317708,6 +318621,11 @@ exports[`shapshots vkIOS theme should match pixelify theme snapshot 1`] = ` "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -318669,6 +319587,11 @@ exports[`shapshots vkIOS theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_accent_themed--hover, #2483E4)", "normal": "var(--vkui--color_background_accent_themed, #2688eb)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -319630,6 +320553,11 @@ exports[`shapshots vkIOS theme should match root theme snapshot 1`] = ` "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -320768,6 +321696,20 @@ exports[`shapshots vkIOSDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -323781,6 +324723,11 @@ exports[`shapshots vkIOSDark theme should match pixelify theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -324742,6 +325689,11 @@ exports[`shapshots vkIOSDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -325703,6 +326655,11 @@ exports[`shapshots vkIOSDark theme should match root theme snapshot 1`] = ` "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -326841,6 +327798,20 @@ exports[`shapshots vkontakteAndroid theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #2688eb)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -331110,6 +332081,11 @@ exports[`shapshots vkontakteAndroid theme should match pixelify theme snapshot 1 "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -332481,6 +333457,11 @@ exports[`shapshots vkontakteAndroid theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_accent_themed--hover, #2483E4)", "normal": "var(--vkui--color_background_accent_themed, #2688eb)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -333852,6 +334833,11 @@ exports[`shapshots vkontakteAndroid theme should match root theme snapshot 1`] = "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -335400,6 +336386,20 @@ exports[`shapshots vkontakteAndroidDark theme should match cssVars snapshot 1`] "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -339669,6 +340669,11 @@ exports[`shapshots vkontakteAndroidDark theme should match pixelify theme snapsh "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -341040,6 +342045,11 @@ exports[`shapshots vkontakteAndroidDark theme should match pseudo theme from Css "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -342411,6 +343421,11 @@ exports[`shapshots vkontakteAndroidDark theme should match root theme snapshot 1 "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -343959,6 +344974,20 @@ exports[`shapshots vkontakteCom theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #447BBA)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(68, 123, 186, 0.2))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(68, 123, 186, 0.16))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(68, 123, 186, 0.12))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -348116,6 +349145,11 @@ exports[`shapshots vkontakteCom theme should match pixelify theme snapshot 1`] = "hover": "#4177B5", "normal": "#447BBA", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(68, 123, 186, 0.2)", + "hover": "rgba(68, 123, 186, 0.16)", + "normal": "rgba(68, 123, 186, 0.12)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -349471,6 +350505,11 @@ exports[`shapshots vkontakteCom theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_accent_themed--hover, #4177B5)", "normal": "var(--vkui--color_background_accent_themed, #447BBA)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(68, 123, 186, 0.2))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(68, 123, 186, 0.16))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(68, 123, 186, 0.12))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -350826,6 +351865,11 @@ exports[`shapshots vkontakteCom theme should match root theme snapshot 1`] = ` "hover": "#4177B5", "normal": "#447BBA", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(68, 123, 186, 0.2)", + "hover": "rgba(68, 123, 186, 0.16)", + "normal": "rgba(68, 123, 186, 0.12)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -352358,6 +353402,20 @@ exports[`shapshots vkontakteComDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #E1E3E6)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -356515,6 +357573,11 @@ exports[`shapshots vkontakteComDark theme should match pixelify theme snapshot 1 "hover": "#D8DBDF", "normal": "#E1E3E6", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -357870,6 +358933,11 @@ exports[`shapshots vkontakteComDark theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_accent_themed--hover, #D8DBDF)", "normal": "var(--vkui--color_background_accent_themed, #E1E3E6)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -359225,6 +360293,11 @@ exports[`shapshots vkontakteComDark theme should match root theme snapshot 1`] = "hover": "#D8DBDF", "normal": "#E1E3E6", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -360757,6 +361830,20 @@ exports[`shapshots vkontakteIOS theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #2688eb)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -364914,6 +366001,11 @@ exports[`shapshots vkontakteIOS theme should match pixelify theme snapshot 1`] = "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -366269,6 +367361,11 @@ exports[`shapshots vkontakteIOS theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_accent_themed--hover, #2483E4)", "normal": "var(--vkui--color_background_accent_themed, #2688eb)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(38, 136, 235, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(38, 136, 235, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(38, 136, 235, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -367624,6 +368721,11 @@ exports[`shapshots vkontakteIOS theme should match root theme snapshot 1`] = ` "hover": "#2483E4", "normal": "#2688eb", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(38, 136, 235, 0.28)", + "hover": "rgba(38, 136, 235, 0.24)", + "normal": "rgba(38, 136, 235, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -369156,6 +370258,20 @@ exports[`shapshots vkontakteIOSDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -373313,6 +374429,11 @@ exports[`shapshots vkontakteIOSDark theme should match pixelify theme snapshot 1 "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -374668,6 +375789,11 @@ exports[`shapshots vkontakteIOSDark theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -376023,6 +377149,11 @@ exports[`shapshots vkontakteIOSDark theme should match root theme snapshot 1`] = "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -377565,6 +378696,20 @@ exports[`shapshots workspaceAdmin theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #005FF9)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -381774,6 +382919,11 @@ exports[`shapshots workspaceAdmin theme should match pixelify theme snapshot 1`] "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -383101,6 +384251,11 @@ exports[`shapshots workspaceAdmin theme should match pseudo theme from CssVars 1 "hover": "var(--vkui--color_background_accent_themed--hover, #005CF1)", "normal": "var(--vkui--color_background_accent_themed, #005FF9)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(0, 95, 249, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(0, 95, 249, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(0, 95, 249, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #5393EF)", "hover": "var(--vkui--color_background_accent_tint--hover, #5698F7)", @@ -384428,6 +385583,11 @@ exports[`shapshots workspaceAdmin theme should match root theme snapshot 1`] = ` "hover": "#005CF1", "normal": "#005FF9", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(0, 95, 249, 0.28)", + "hover": "rgba(0, 95, 249, 0.24)", + "normal": "rgba(0, 95, 249, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#5393EF", "hover": "#5698F7", @@ -385932,6 +387092,20 @@ exports[`shapshots workspaceLandings theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, }, + "colorBackgroundAccentThemedAlpha": { + "active": { + "name": "--vkui--color_background_accent_themed_alpha--active", + "value": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + }, + "hover": { + "name": "--vkui--color_background_accent_themed_alpha--hover", + "value": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + }, + "normal": { + "name": "--vkui--color_background_accent_themed_alpha", + "value": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, + }, "colorBackgroundAccentTint": { "active": { "name": "--vkui--color_background_accent_tint--active", @@ -390211,6 +391385,11 @@ exports[`shapshots workspaceLandings theme should match pixelify theme snapshot "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", @@ -391563,6 +392742,11 @@ exports[`shapshots workspaceLandings theme should match pseudo theme from CssVar "hover": "var(--vkui--color_background_accent_themed--hover, #EBEDF0)", "normal": "var(--vkui--color_background_accent_themed, #FFFFFF)", }, + "colorBackgroundAccentThemedAlpha": { + "active": "var(--vkui--color_background_accent_themed_alpha--active, rgba(255, 255, 255, 0.28))", + "hover": "var(--vkui--color_background_accent_themed_alpha--hover, rgba(255, 255, 255, 0.24))", + "normal": "var(--vkui--color_background_accent_themed_alpha, rgba(255, 255, 255, 0.2))", + }, "colorBackgroundAccentTint": { "active": "var(--vkui--color_background_accent_tint--active, #67A6FF)", "hover": "var(--vkui--color_background_accent_tint--hover, #61A2FF)", @@ -392915,6 +394099,11 @@ exports[`shapshots workspaceLandings theme should match root theme snapshot 1`] "hover": "#EBEDF0", "normal": "#FFFFFF", }, + "colorBackgroundAccentThemedAlpha": { + "active": "rgba(255, 255, 255, 0.28)", + "hover": "rgba(255, 255, 255, 0.24)", + "normal": "rgba(255, 255, 255, 0.2)", + }, "colorBackgroundAccentTint": { "active": "#67A6FF", "hover": "#61A2FF", diff --git a/src/interfaces/general/colors/index.ts b/src/interfaces/general/colors/index.ts index 7bf347f3..0d197b1a 100644 --- a/src/interfaces/general/colors/index.ts +++ b/src/interfaces/general/colors/index.ts @@ -45,6 +45,12 @@ export interface ColorsDescriptionStruct { */ colorBackgroundAccentThemed: ColorDescription; + /** + * @desc Акцентный фон с прозрачностью, который меняется на белый в темной теме + * @tags color, background, themed + */ + colorBackgroundAccentThemedAlpha: ColorDescription; + /** * @desc Тонированный акцентный фон * @tags color, background diff --git a/src/themeDescriptions/base/figma/vk.json b/src/themeDescriptions/base/figma/vk.json index cdccf834..cd42ce68 100644 --- a/src/themeDescriptions/base/figma/vk.json +++ b/src/themeDescriptions/base/figma/vk.json @@ -4,6 +4,7 @@ "background": "#0a0a0a", "background_accent": "#529ef4", "background_accent_themed": "#ffffff", + "background_accent_themed_alpha": "rgba(255, 255, 255, 0.2)", "background_accent_tint": "#5a9eff", "background_content": "#19191a", "background_contrast": "#ffffff", @@ -114,6 +115,7 @@ "background": "#ebedf0", "background_accent": "#2688eb", "background_accent_themed": "#2688eb", + "background_accent_themed_alpha": "rgba(38, 136, 235, 0.2)", "background_accent_tint": "#5a9eff", "background_content": "#ffffff", "background_contrast": "#ffffff", @@ -275,4 +277,4 @@ "text_tertiary": "#99a2ad" } } -} \ No newline at end of file +} diff --git a/src/themeDescriptions/base/paradigm.ts b/src/themeDescriptions/base/paradigm.ts index 77171cb4..8cfb30b2 100644 --- a/src/themeDescriptions/base/paradigm.ts +++ b/src/themeDescriptions/base/paradigm.ts @@ -28,6 +28,7 @@ export const lightColors: ColorsDescription = { // Background colorBackgroundAccent: '#005FF9', colorBackgroundAccentThemed: '#005FF9', + colorBackgroundAccentThemedAlpha: 'rgba(0, 95, 249, 0.2)', colorBackgroundAccentAlternative: '#FF9E00', colorBackgroundContent: '#FFFFFF', colorBackgroundSecondary: '#F0F1F3', @@ -158,6 +159,7 @@ export const darkColors: ColorsDescription = { // Background colorBackgroundAccent: '#2775FC', colorBackgroundAccentThemed: '#FFFFFF', + colorBackgroundAccentThemedAlpha: 'rgba(255, 255, 255, 0.2)', colorBackgroundAccentAlternative: '#FF9E00', colorBackgroundContent: colorBackgroundContentDark, colorBackgroundSecondary: '#2A2A2B', diff --git a/src/themeDescriptions/base/vk.ts b/src/themeDescriptions/base/vk.ts index 943f5241..d5067602 100644 --- a/src/themeDescriptions/base/vk.ts +++ b/src/themeDescriptions/base/vk.ts @@ -29,6 +29,7 @@ export const colorFromFigma = (colorsScheme: 'light' | 'dark'): ColorsDescriptio // Background colorBackgroundAccent: background.background_accent, colorBackgroundAccentThemed: background.background_accent_themed, + colorBackgroundAccentThemedAlpha: background.background_accent_themed_alpha, colorBackgroundAccentTint: background.background_accent_tint, colorBackgroundAccentAlternative: { light: '#2688EB', diff --git a/src/themeDescriptions/themes/vkCom/index.ts b/src/themeDescriptions/themes/vkCom/index.ts index 8236bde6..001011b2 100644 --- a/src/themeDescriptions/themes/vkCom/index.ts +++ b/src/themeDescriptions/themes/vkCom/index.ts @@ -24,6 +24,7 @@ const vkComColors = (theme: typeof vkcom_light) => ({ // Background colorBackgroundAccent: resolveColor(theme.colors.accent), colorBackgroundAccentThemed: resolveColor(theme.colors.button_primary_background), + colorBackgroundAccentThemedAlpha: 'rgba(68, 123, 186, 0.12)', // colorBackgroundAccentTint: '#5a9eff', colorBackgroundAccentAlternative: resolveColor(theme.colors.accent), colorBackground: resolveColor(theme.colors.background_page), @@ -254,6 +255,7 @@ const vkComDarkColor: ColorsDescription = { hover: '#D8DBDF', active: '#CFD2D8', }, + colorBackgroundAccentThemedAlpha: 'rgba(255, 255, 255, 0.2)', colorBackgroundSecondaryAlpha: { normal: 'rgba(255, 255, 255, 0.10)', hover: 'rgba(255, 255, 255, 0.12)',