From bbfc4356c8b84d9a589ba8b0e86e6e87bfcf8751 Mon Sep 17 00:00:00 2001 From: Mikhail Bodrov Date: Mon, 15 Jul 2024 10:33:37 +0300 Subject: [PATCH 01/36] fix: remove needless spread for array --- src/build/themeProcessors/customMedia/customMedia.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/build/themeProcessors/customMedia/customMedia.ts b/src/build/themeProcessors/customMedia/customMedia.ts index abee47bd8..09123046a 100644 --- a/src/build/themeProcessors/customMedia/customMedia.ts +++ b/src/build/themeProcessors/customMedia/customMedia.ts @@ -14,9 +14,7 @@ import { export const getUsingViewports = ( breakpoints: Breakpoints['breakpoints'], ): Vt => { - const usingViewports: Vt[number][] = [ - ...(Object.keys(breakpoints) as (keyof typeof breakpoints)[]), - ]; + const usingViewports: Vt[number][] = Object.keys(breakpoints) as (keyof typeof breakpoints)[]; return usingViewports.sort((a, b) => viewports.indexOf(a) > viewports.indexOf(b) ? 1 : -1, From e5cf7b5e0009629757ba2f7a8f5116155904df0a Mon Sep 17 00:00:00 2001 From: Andrey Evstafyev Date: Fri, 23 Aug 2024 14:02:08 +0500 Subject: [PATCH 02/36] update tokens --- .../__snapshots__/snapthots.test.ts.snap | 272 ++++++++++++------ src/themeDescriptions/themes/media/index.ts | 38 ++- 2 files changed, 225 insertions(+), 85 deletions(-) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index ee906c965..153f0cd83 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -90010,7 +90010,7 @@ exports[`shapshots media theme should match cssVars snapshot 1`] = ` }, "elevation3": { "name": "--vkui--elevation3", - "value": "var(--vkui--elevation3, 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08))", + "value": "var(--vkui--elevation3, 0px 16px 48px 0px rgba(0, 16, 61, 0.28))", }, "elevation4": { "name": "--vkui--elevation4", @@ -92985,9 +92985,13 @@ exports[`shapshots media theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_large_height", "value": "var(--vkui--size_button_large_height)", }, + "compact": { + "name": "--vkui--size_button_large_height--compact", + "value": "var(--vkui--size_button_large_height--compact, 36px)", + }, "regular": { "name": "--vkui--size_button_large_height--regular", - "value": "var(--vkui--size_button_large_height--regular, 48px)", + "value": "var(--vkui--size_button_large_height--regular, 44px)", }, }, "sizeButtonMediumHeight": { @@ -92995,9 +92999,13 @@ exports[`shapshots media theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_medium_height", "value": "var(--vkui--size_button_medium_height)", }, + "compact": { + "name": "--vkui--size_button_medium_height--compact", + "value": "var(--vkui--size_button_medium_height--compact, 32px)", + }, "regular": { "name": "--vkui--size_button_medium_height--regular", - "value": "var(--vkui--size_button_medium_height--regular, 40px)", + "value": "var(--vkui--size_button_medium_height--regular, 36px)", }, }, "sizeButtonMinimumWidth": { @@ -93065,9 +93073,13 @@ exports[`shapshots media theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_small_height", "value": "var(--vkui--size_button_small_height)", }, + "compact": { + "name": "--vkui--size_button_small_height--compact", + "value": "var(--vkui--size_button_small_height--compact, 28px)", + }, "regular": { "name": "--vkui--size_button_small_height--regular", - "value": "var(--vkui--size_button_small_height--regular, 36px)", + "value": "var(--vkui--size_button_small_height--regular, 30px)", }, }, "sizeButtonTertiaryLargePaddingHorizontal": { @@ -93253,9 +93265,13 @@ exports[`shapshots media theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_field_height", "value": "var(--vkui--size_field_height)", }, + "compact": { + "name": "--vkui--size_field_height--compact", + "value": "var(--vkui--size_field_height--compact, 36px)", + }, "regular": { "name": "--vkui--size_field_height--regular", - "value": "var(--vkui--size_field_height--regular, 48px)", + "value": "var(--vkui--size_field_height--regular, 44px)", }, }, "sizeFieldHorizontalMargin": { @@ -94859,7 +94875,7 @@ exports[`shapshots media theme should match pixelify theme snapshot 1`] = ` "elevation1": "0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation1InvertY": "0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation2": "0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06)", - "elevation3": "0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08)", + "elevation3": "0px 16px 48px 0px rgba(0, 16, 61, 0.28)", "elevation4": "0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16)", "fontCaption1": { "regular": { @@ -95578,10 +95594,12 @@ exports[`shapshots media theme should match pixelify theme snapshot 1`] = ` "regular": "20px", }, "sizeButtonLargeHeight": { - "regular": "48px", + "compact": "36px", + "regular": "44px", }, "sizeButtonMediumHeight": { - "regular": "40px", + "compact": "32px", + "regular": "36px", }, "sizeButtonMinimumWidth": { "regular": "80px", @@ -95602,7 +95620,8 @@ exports[`shapshots media theme should match pixelify theme snapshot 1`] = ` "regular": "16px", }, "sizeButtonSmallHeight": { - "regular": "36px", + "compact": "28px", + "regular": "30px", }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": "16px", @@ -95658,7 +95677,8 @@ exports[`shapshots media theme should match pixelify theme snapshot 1`] = ` "regular": "8px", }, "sizeFieldHeight": { - "regular": "48px", + "compact": "36px", + "regular": "44px", }, "sizeFieldHorizontalMargin": { "compact": "16px", @@ -96703,7 +96723,7 @@ exports[`shapshots media theme should match pseudo theme from CssVars 1`] = ` "elevation1": "var(--vkui--elevation1, 0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08))", "elevation1InvertY": "var(--vkui--elevation1_invert_y, 0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08))", "elevation2": "var(--vkui--elevation2, 0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06))", - "elevation3": "var(--vkui--elevation3, 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08))", + "elevation3": "var(--vkui--elevation3, 0px 16px 48px 0px rgba(0, 16, 61, 0.28))", "elevation4": "var(--vkui--elevation4, 0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16))", "fontCaption1": { "regular": { @@ -97422,10 +97442,12 @@ exports[`shapshots media theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_button_icon_padding--regular, 20px)", }, "sizeButtonLargeHeight": { - "regular": "var(--vkui--size_button_large_height--regular, 48px)", + "compact": "var(--vkui--size_button_large_height--compact, 36px)", + "regular": "var(--vkui--size_button_large_height--regular, 44px)", }, "sizeButtonMediumHeight": { - "regular": "var(--vkui--size_button_medium_height--regular, 40px)", + "compact": "var(--vkui--size_button_medium_height--compact, 32px)", + "regular": "var(--vkui--size_button_medium_height--regular, 36px)", }, "sizeButtonMinimumWidth": { "regular": "var(--vkui--size_button_minimum_width--regular, 80px)", @@ -97446,7 +97468,8 @@ exports[`shapshots media theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_button_slider_width_pointer--regular, 16px)", }, "sizeButtonSmallHeight": { - "regular": "var(--vkui--size_button_small_height--regular, 36px)", + "compact": "var(--vkui--size_button_small_height--compact, 28px)", + "regular": "var(--vkui--size_button_small_height--regular, 30px)", }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": "var(--vkui--size_button_tertiary_large_padding_horizontal--regular, 16px)", @@ -97502,7 +97525,8 @@ exports[`shapshots media theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_dot_indicate--regular, 8px)", }, "sizeFieldHeight": { - "regular": "var(--vkui--size_field_height--regular, 48px)", + "compact": "var(--vkui--size_field_height--compact, 36px)", + "regular": "var(--vkui--size_field_height--regular, 44px)", }, "sizeFieldHorizontalMargin": { "compact": "var(--vkui--size_field_horizontal_margin--compact, 16px)", @@ -98547,7 +98571,7 @@ exports[`shapshots media theme should match root theme snapshot 1`] = ` "elevation1": "0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation1InvertY": "0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation2": "0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06)", - "elevation3": "0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08)", + "elevation3": "0px 16px 48px 0px rgba(0, 16, 61, 0.28)", "elevation4": "0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16)", "fontCaption1": { "regular": { @@ -99266,10 +99290,12 @@ exports[`shapshots media theme should match root theme snapshot 1`] = ` "regular": 20, }, "sizeButtonLargeHeight": { - "regular": 48, + "compact": 36, + "regular": 44, }, "sizeButtonMediumHeight": { - "regular": 40, + "compact": 32, + "regular": 36, }, "sizeButtonMinimumWidth": { "regular": 80, @@ -99290,7 +99316,8 @@ exports[`shapshots media theme should match root theme snapshot 1`] = ` "regular": 16, }, "sizeButtonSmallHeight": { - "regular": 36, + "compact": 28, + "regular": 30, }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": 16, @@ -99346,7 +99373,8 @@ exports[`shapshots media theme should match root theme snapshot 1`] = ` "regular": 8, }, "sizeFieldHeight": { - "regular": 48, + "compact": 36, + "regular": 44, }, "sizeFieldHorizontalMargin": { "compact": 16, @@ -101842,7 +101870,7 @@ exports[`shapshots mediaDark theme should match cssVars snapshot 1`] = ` }, "elevation3": { "name": "--vkui--elevation3", - "value": "var(--vkui--elevation3, 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08))", + "value": "var(--vkui--elevation3, 0px 16px 48px 0px rgba(0, 0, 0, 0.40))", }, "elevation4": { "name": "--vkui--elevation4", @@ -104817,9 +104845,13 @@ exports[`shapshots mediaDark theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_large_height", "value": "var(--vkui--size_button_large_height)", }, + "compact": { + "name": "--vkui--size_button_large_height--compact", + "value": "var(--vkui--size_button_large_height--compact, 36px)", + }, "regular": { "name": "--vkui--size_button_large_height--regular", - "value": "var(--vkui--size_button_large_height--regular, 48px)", + "value": "var(--vkui--size_button_large_height--regular, 44px)", }, }, "sizeButtonMediumHeight": { @@ -104827,9 +104859,13 @@ exports[`shapshots mediaDark theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_medium_height", "value": "var(--vkui--size_button_medium_height)", }, + "compact": { + "name": "--vkui--size_button_medium_height--compact", + "value": "var(--vkui--size_button_medium_height--compact, 32px)", + }, "regular": { "name": "--vkui--size_button_medium_height--regular", - "value": "var(--vkui--size_button_medium_height--regular, 40px)", + "value": "var(--vkui--size_button_medium_height--regular, 36px)", }, }, "sizeButtonMinimumWidth": { @@ -104897,9 +104933,13 @@ exports[`shapshots mediaDark theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_small_height", "value": "var(--vkui--size_button_small_height)", }, + "compact": { + "name": "--vkui--size_button_small_height--compact", + "value": "var(--vkui--size_button_small_height--compact, 28px)", + }, "regular": { "name": "--vkui--size_button_small_height--regular", - "value": "var(--vkui--size_button_small_height--regular, 36px)", + "value": "var(--vkui--size_button_small_height--regular, 30px)", }, }, "sizeButtonTertiaryLargePaddingHorizontal": { @@ -105085,9 +105125,13 @@ exports[`shapshots mediaDark theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_field_height", "value": "var(--vkui--size_field_height)", }, + "compact": { + "name": "--vkui--size_field_height--compact", + "value": "var(--vkui--size_field_height--compact, 36px)", + }, "regular": { "name": "--vkui--size_field_height--regular", - "value": "var(--vkui--size_field_height--regular, 48px)", + "value": "var(--vkui--size_field_height--regular, 44px)", }, }, "sizeFieldHorizontalMargin": { @@ -106691,7 +106735,7 @@ exports[`shapshots mediaDark theme should match pixelify theme snapshot 1`] = ` "elevation1": "0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation1InvertY": "0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation2": "0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06)", - "elevation3": "0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08)", + "elevation3": "0px 16px 48px 0px rgba(0, 0, 0, 0.40)", "elevation4": "0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16)", "fontCaption1": { "regular": { @@ -107410,10 +107454,12 @@ exports[`shapshots mediaDark theme should match pixelify theme snapshot 1`] = ` "regular": "20px", }, "sizeButtonLargeHeight": { - "regular": "48px", + "compact": "36px", + "regular": "44px", }, "sizeButtonMediumHeight": { - "regular": "40px", + "compact": "32px", + "regular": "36px", }, "sizeButtonMinimumWidth": { "regular": "80px", @@ -107434,7 +107480,8 @@ exports[`shapshots mediaDark theme should match pixelify theme snapshot 1`] = ` "regular": "16px", }, "sizeButtonSmallHeight": { - "regular": "36px", + "compact": "28px", + "regular": "30px", }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": "16px", @@ -107490,7 +107537,8 @@ exports[`shapshots mediaDark theme should match pixelify theme snapshot 1`] = ` "regular": "8px", }, "sizeFieldHeight": { - "regular": "48px", + "compact": "36px", + "regular": "44px", }, "sizeFieldHorizontalMargin": { "compact": "16px", @@ -108535,7 +108583,7 @@ exports[`shapshots mediaDark theme should match pseudo theme from CssVars 1`] = "elevation1": "var(--vkui--elevation1, 0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08))", "elevation1InvertY": "var(--vkui--elevation1_invert_y, 0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08))", "elevation2": "var(--vkui--elevation2, 0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06))", - "elevation3": "var(--vkui--elevation3, 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08))", + "elevation3": "var(--vkui--elevation3, 0px 16px 48px 0px rgba(0, 0, 0, 0.40))", "elevation4": "var(--vkui--elevation4, 0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16))", "fontCaption1": { "regular": { @@ -109254,10 +109302,12 @@ exports[`shapshots mediaDark theme should match pseudo theme from CssVars 1`] = "regular": "var(--vkui--size_button_icon_padding--regular, 20px)", }, "sizeButtonLargeHeight": { - "regular": "var(--vkui--size_button_large_height--regular, 48px)", + "compact": "var(--vkui--size_button_large_height--compact, 36px)", + "regular": "var(--vkui--size_button_large_height--regular, 44px)", }, "sizeButtonMediumHeight": { - "regular": "var(--vkui--size_button_medium_height--regular, 40px)", + "compact": "var(--vkui--size_button_medium_height--compact, 32px)", + "regular": "var(--vkui--size_button_medium_height--regular, 36px)", }, "sizeButtonMinimumWidth": { "regular": "var(--vkui--size_button_minimum_width--regular, 80px)", @@ -109278,7 +109328,8 @@ exports[`shapshots mediaDark theme should match pseudo theme from CssVars 1`] = "regular": "var(--vkui--size_button_slider_width_pointer--regular, 16px)", }, "sizeButtonSmallHeight": { - "regular": "var(--vkui--size_button_small_height--regular, 36px)", + "compact": "var(--vkui--size_button_small_height--compact, 28px)", + "regular": "var(--vkui--size_button_small_height--regular, 30px)", }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": "var(--vkui--size_button_tertiary_large_padding_horizontal--regular, 16px)", @@ -109334,7 +109385,8 @@ exports[`shapshots mediaDark theme should match pseudo theme from CssVars 1`] = "regular": "var(--vkui--size_dot_indicate--regular, 8px)", }, "sizeFieldHeight": { - "regular": "var(--vkui--size_field_height--regular, 48px)", + "compact": "var(--vkui--size_field_height--compact, 36px)", + "regular": "var(--vkui--size_field_height--regular, 44px)", }, "sizeFieldHorizontalMargin": { "compact": "var(--vkui--size_field_horizontal_margin--compact, 16px)", @@ -110379,7 +110431,7 @@ exports[`shapshots mediaDark theme should match root theme snapshot 1`] = ` "elevation1": "0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation1InvertY": "0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation2": "0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06)", - "elevation3": "0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08)", + "elevation3": "0px 16px 48px 0px rgba(0, 0, 0, 0.40)", "elevation4": "0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16)", "fontCaption1": { "regular": { @@ -111098,10 +111150,12 @@ exports[`shapshots mediaDark theme should match root theme snapshot 1`] = ` "regular": 20, }, "sizeButtonLargeHeight": { - "regular": 48, + "compact": 36, + "regular": 44, }, "sizeButtonMediumHeight": { - "regular": 40, + "compact": 32, + "regular": 36, }, "sizeButtonMinimumWidth": { "regular": 80, @@ -111122,7 +111176,8 @@ exports[`shapshots mediaDark theme should match root theme snapshot 1`] = ` "regular": 16, }, "sizeButtonSmallHeight": { - "regular": 36, + "compact": 28, + "regular": 30, }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": 16, @@ -111178,7 +111233,8 @@ exports[`shapshots mediaDark theme should match root theme snapshot 1`] = ` "regular": 8, }, "sizeFieldHeight": { - "regular": 48, + "compact": 36, + "regular": 44, }, "sizeFieldHorizontalMargin": { "compact": 16, @@ -113688,7 +113744,7 @@ exports[`shapshots mycom theme should match cssVars snapshot 1`] = ` }, "elevation3": { "name": "--vkui--elevation3", - "value": "var(--vkui--elevation3, 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08))", + "value": "var(--vkui--elevation3, 0px 16px 48px 0px rgba(0, 16, 61, 0.28))", }, "elevation4": { "name": "--vkui--elevation4", @@ -116663,9 +116719,13 @@ exports[`shapshots mycom theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_large_height", "value": "var(--vkui--size_button_large_height)", }, + "compact": { + "name": "--vkui--size_button_large_height--compact", + "value": "var(--vkui--size_button_large_height--compact, 36px)", + }, "regular": { "name": "--vkui--size_button_large_height--regular", - "value": "var(--vkui--size_button_large_height--regular, 48px)", + "value": "var(--vkui--size_button_large_height--regular, 44px)", }, }, "sizeButtonMediumHeight": { @@ -116673,9 +116733,13 @@ exports[`shapshots mycom theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_medium_height", "value": "var(--vkui--size_button_medium_height)", }, + "compact": { + "name": "--vkui--size_button_medium_height--compact", + "value": "var(--vkui--size_button_medium_height--compact, 32px)", + }, "regular": { "name": "--vkui--size_button_medium_height--regular", - "value": "var(--vkui--size_button_medium_height--regular, 40px)", + "value": "var(--vkui--size_button_medium_height--regular, 36px)", }, }, "sizeButtonMinimumWidth": { @@ -116743,9 +116807,13 @@ exports[`shapshots mycom theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_small_height", "value": "var(--vkui--size_button_small_height)", }, + "compact": { + "name": "--vkui--size_button_small_height--compact", + "value": "var(--vkui--size_button_small_height--compact, 28px)", + }, "regular": { "name": "--vkui--size_button_small_height--regular", - "value": "var(--vkui--size_button_small_height--regular, 36px)", + "value": "var(--vkui--size_button_small_height--regular, 30px)", }, }, "sizeButtonTertiaryLargePaddingHorizontal": { @@ -116931,9 +116999,13 @@ exports[`shapshots mycom theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_field_height", "value": "var(--vkui--size_field_height)", }, + "compact": { + "name": "--vkui--size_field_height--compact", + "value": "var(--vkui--size_field_height--compact, 36px)", + }, "regular": { "name": "--vkui--size_field_height--regular", - "value": "var(--vkui--size_field_height--regular, 48px)", + "value": "var(--vkui--size_field_height--regular, 44px)", }, }, "sizeFieldHorizontalMargin": { @@ -118534,7 +118606,7 @@ exports[`shapshots mycom theme should match pixelify theme snapshot 1`] = ` "elevation1": "0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation1InvertY": "0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation2": "0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06)", - "elevation3": "0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08)", + "elevation3": "0px 16px 48px 0px rgba(0, 16, 61, 0.28)", "elevation4": "0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16)", "fontCaption1": { "regular": { @@ -119253,10 +119325,12 @@ exports[`shapshots mycom theme should match pixelify theme snapshot 1`] = ` "regular": "20px", }, "sizeButtonLargeHeight": { - "regular": "48px", + "compact": "36px", + "regular": "44px", }, "sizeButtonMediumHeight": { - "regular": "40px", + "compact": "32px", + "regular": "36px", }, "sizeButtonMinimumWidth": { "regular": "80px", @@ -119277,7 +119351,8 @@ exports[`shapshots mycom theme should match pixelify theme snapshot 1`] = ` "regular": "16px", }, "sizeButtonSmallHeight": { - "regular": "36px", + "compact": "28px", + "regular": "30px", }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": "16px", @@ -119333,7 +119408,8 @@ exports[`shapshots mycom theme should match pixelify theme snapshot 1`] = ` "regular": "8px", }, "sizeFieldHeight": { - "regular": "48px", + "compact": "36px", + "regular": "44px", }, "sizeFieldHorizontalMargin": { "compact": "16px", @@ -120381,7 +120457,7 @@ exports[`shapshots mycom theme should match pseudo theme from CssVars 1`] = ` "elevation1": "var(--vkui--elevation1, 0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08))", "elevation1InvertY": "var(--vkui--elevation1_invert_y, 0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08))", "elevation2": "var(--vkui--elevation2, 0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06))", - "elevation3": "var(--vkui--elevation3, 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08))", + "elevation3": "var(--vkui--elevation3, 0px 16px 48px 0px rgba(0, 16, 61, 0.28))", "elevation4": "var(--vkui--elevation4, 0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16))", "fontCaption1": { "regular": { @@ -121100,10 +121176,12 @@ exports[`shapshots mycom theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_button_icon_padding--regular, 20px)", }, "sizeButtonLargeHeight": { - "regular": "var(--vkui--size_button_large_height--regular, 48px)", + "compact": "var(--vkui--size_button_large_height--compact, 36px)", + "regular": "var(--vkui--size_button_large_height--regular, 44px)", }, "sizeButtonMediumHeight": { - "regular": "var(--vkui--size_button_medium_height--regular, 40px)", + "compact": "var(--vkui--size_button_medium_height--compact, 32px)", + "regular": "var(--vkui--size_button_medium_height--regular, 36px)", }, "sizeButtonMinimumWidth": { "regular": "var(--vkui--size_button_minimum_width--regular, 80px)", @@ -121124,7 +121202,8 @@ exports[`shapshots mycom theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_button_slider_width_pointer--regular, 16px)", }, "sizeButtonSmallHeight": { - "regular": "var(--vkui--size_button_small_height--regular, 36px)", + "compact": "var(--vkui--size_button_small_height--compact, 28px)", + "regular": "var(--vkui--size_button_small_height--regular, 30px)", }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": "var(--vkui--size_button_tertiary_large_padding_horizontal--regular, 16px)", @@ -121180,7 +121259,8 @@ exports[`shapshots mycom theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_dot_indicate--regular, 8px)", }, "sizeFieldHeight": { - "regular": "var(--vkui--size_field_height--regular, 48px)", + "compact": "var(--vkui--size_field_height--compact, 36px)", + "regular": "var(--vkui--size_field_height--regular, 44px)", }, "sizeFieldHorizontalMargin": { "compact": "var(--vkui--size_field_horizontal_margin--compact, 16px)", @@ -122228,7 +122308,7 @@ exports[`shapshots mycom theme should match root theme snapshot 1`] = ` "elevation1": "0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation1InvertY": "0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation2": "0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06)", - "elevation3": "0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08)", + "elevation3": "0px 16px 48px 0px rgba(0, 16, 61, 0.28)", "elevation4": "0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16)", "fontCaption1": { "regular": { @@ -122947,10 +123027,12 @@ exports[`shapshots mycom theme should match root theme snapshot 1`] = ` "regular": 20, }, "sizeButtonLargeHeight": { - "regular": 48, + "compact": 36, + "regular": 44, }, "sizeButtonMediumHeight": { - "regular": 40, + "compact": 32, + "regular": 36, }, "sizeButtonMinimumWidth": { "regular": 80, @@ -122971,7 +123053,8 @@ exports[`shapshots mycom theme should match root theme snapshot 1`] = ` "regular": 16, }, "sizeButtonSmallHeight": { - "regular": 36, + "compact": 28, + "regular": 30, }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": 16, @@ -123027,7 +123110,8 @@ exports[`shapshots mycom theme should match root theme snapshot 1`] = ` "regular": 8, }, "sizeFieldHeight": { - "regular": 48, + "compact": 36, + "regular": 44, }, "sizeFieldHorizontalMargin": { "compact": 16, @@ -267370,7 +267454,7 @@ exports[`shapshots pharma theme should match cssVars snapshot 1`] = ` }, "elevation3": { "name": "--vkui--elevation3", - "value": "var(--vkui--elevation3, 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08))", + "value": "var(--vkui--elevation3, 0px 16px 48px 0px rgba(0, 16, 61, 0.28))", }, "elevation4": { "name": "--vkui--elevation4", @@ -270345,9 +270429,13 @@ exports[`shapshots pharma theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_large_height", "value": "var(--vkui--size_button_large_height)", }, + "compact": { + "name": "--vkui--size_button_large_height--compact", + "value": "var(--vkui--size_button_large_height--compact, 36px)", + }, "regular": { "name": "--vkui--size_button_large_height--regular", - "value": "var(--vkui--size_button_large_height--regular, 48px)", + "value": "var(--vkui--size_button_large_height--regular, 44px)", }, }, "sizeButtonMediumHeight": { @@ -270355,9 +270443,13 @@ exports[`shapshots pharma theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_medium_height", "value": "var(--vkui--size_button_medium_height)", }, + "compact": { + "name": "--vkui--size_button_medium_height--compact", + "value": "var(--vkui--size_button_medium_height--compact, 32px)", + }, "regular": { "name": "--vkui--size_button_medium_height--regular", - "value": "var(--vkui--size_button_medium_height--regular, 40px)", + "value": "var(--vkui--size_button_medium_height--regular, 36px)", }, }, "sizeButtonMinimumWidth": { @@ -270425,9 +270517,13 @@ exports[`shapshots pharma theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_button_small_height", "value": "var(--vkui--size_button_small_height)", }, + "compact": { + "name": "--vkui--size_button_small_height--compact", + "value": "var(--vkui--size_button_small_height--compact, 28px)", + }, "regular": { "name": "--vkui--size_button_small_height--regular", - "value": "var(--vkui--size_button_small_height--regular, 36px)", + "value": "var(--vkui--size_button_small_height--regular, 30px)", }, }, "sizeButtonTertiaryLargePaddingHorizontal": { @@ -270613,9 +270709,13 @@ exports[`shapshots pharma theme should match cssVars snapshot 1`] = ` "name": "--vkui--size_field_height", "value": "var(--vkui--size_field_height)", }, + "compact": { + "name": "--vkui--size_field_height--compact", + "value": "var(--vkui--size_field_height--compact, 36px)", + }, "regular": { "name": "--vkui--size_field_height--regular", - "value": "var(--vkui--size_field_height--regular, 48px)", + "value": "var(--vkui--size_field_height--regular, 44px)", }, }, "sizeFieldHorizontalMargin": { @@ -272224,7 +272324,7 @@ exports[`shapshots pharma theme should match pixelify theme snapshot 1`] = ` "elevation1": "0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation1InvertY": "0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation2": "0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06)", - "elevation3": "0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08)", + "elevation3": "0px 16px 48px 0px rgba(0, 16, 61, 0.28)", "elevation4": "0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16)", "fontCaption1": { "regular": { @@ -272943,10 +273043,12 @@ exports[`shapshots pharma theme should match pixelify theme snapshot 1`] = ` "regular": "20px", }, "sizeButtonLargeHeight": { - "regular": "48px", + "compact": "36px", + "regular": "44px", }, "sizeButtonMediumHeight": { - "regular": "40px", + "compact": "32px", + "regular": "36px", }, "sizeButtonMinimumWidth": { "regular": "80px", @@ -272967,7 +273069,8 @@ exports[`shapshots pharma theme should match pixelify theme snapshot 1`] = ` "regular": "16px", }, "sizeButtonSmallHeight": { - "regular": "36px", + "compact": "28px", + "regular": "30px", }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": "16px", @@ -273023,7 +273126,8 @@ exports[`shapshots pharma theme should match pixelify theme snapshot 1`] = ` "regular": "8px", }, "sizeFieldHeight": { - "regular": "48px", + "compact": "36px", + "regular": "44px", }, "sizeFieldHorizontalMargin": { "compact": "16px", @@ -274073,7 +274177,7 @@ exports[`shapshots pharma theme should match pseudo theme from CssVars 1`] = ` "elevation1": "var(--vkui--elevation1, 0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08))", "elevation1InvertY": "var(--vkui--elevation1_invert_y, 0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08))", "elevation2": "var(--vkui--elevation2, 0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06))", - "elevation3": "var(--vkui--elevation3, 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08))", + "elevation3": "var(--vkui--elevation3, 0px 16px 48px 0px rgba(0, 16, 61, 0.28))", "elevation4": "var(--vkui--elevation4, 0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16))", "fontCaption1": { "regular": { @@ -274792,10 +274896,12 @@ exports[`shapshots pharma theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_button_icon_padding--regular, 20px)", }, "sizeButtonLargeHeight": { - "regular": "var(--vkui--size_button_large_height--regular, 48px)", + "compact": "var(--vkui--size_button_large_height--compact, 36px)", + "regular": "var(--vkui--size_button_large_height--regular, 44px)", }, "sizeButtonMediumHeight": { - "regular": "var(--vkui--size_button_medium_height--regular, 40px)", + "compact": "var(--vkui--size_button_medium_height--compact, 32px)", + "regular": "var(--vkui--size_button_medium_height--regular, 36px)", }, "sizeButtonMinimumWidth": { "regular": "var(--vkui--size_button_minimum_width--regular, 80px)", @@ -274816,7 +274922,8 @@ exports[`shapshots pharma theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_button_slider_width_pointer--regular, 16px)", }, "sizeButtonSmallHeight": { - "regular": "var(--vkui--size_button_small_height--regular, 36px)", + "compact": "var(--vkui--size_button_small_height--compact, 28px)", + "regular": "var(--vkui--size_button_small_height--regular, 30px)", }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": "var(--vkui--size_button_tertiary_large_padding_horizontal--regular, 16px)", @@ -274872,7 +274979,8 @@ exports[`shapshots pharma theme should match pseudo theme from CssVars 1`] = ` "regular": "var(--vkui--size_dot_indicate--regular, 8px)", }, "sizeFieldHeight": { - "regular": "var(--vkui--size_field_height--regular, 48px)", + "compact": "var(--vkui--size_field_height--compact, 36px)", + "regular": "var(--vkui--size_field_height--regular, 44px)", }, "sizeFieldHorizontalMargin": { "compact": "var(--vkui--size_field_horizontal_margin--compact, 16px)", @@ -275922,7 +276030,7 @@ exports[`shapshots pharma theme should match root theme snapshot 1`] = ` "elevation1": "0 2px 6px 0 rgba(0, 16, 61, 0.08), 0 1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation1InvertY": "0 -2px 6px 0 rgba(0, 16, 61, 0.08), 0 -1px 2px 0 rgba(0, 16, 61, 0.08)", "elevation2": "0 0 2px 0 rgba(0, 16, 61, 0.06), 0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06)", - "elevation3": "0 0 6px 0 rgba(0, 16, 61, 0.06), 0 6px 12px 0 rgba(0, 16, 61, 0.06), 0 6px 20px 0 rgba(0, 16, 61, 0.06), 0 10px 36px 0 rgba(0, 16, 61, 0.08)", + "elevation3": "0px 16px 48px 0px rgba(0, 16, 61, 0.28)", "elevation4": "0 2px 6px 0 rgba(0, 16, 61, 0.06), 0 16px 48px 0 rgba(0, 16, 61, 0.08), 0 24px 68px 0 rgba(0, 16, 61, 0.16)", "fontCaption1": { "regular": { @@ -276641,10 +276749,12 @@ exports[`shapshots pharma theme should match root theme snapshot 1`] = ` "regular": 20, }, "sizeButtonLargeHeight": { - "regular": 48, + "compact": 36, + "regular": 44, }, "sizeButtonMediumHeight": { - "regular": 40, + "compact": 32, + "regular": 36, }, "sizeButtonMinimumWidth": { "regular": 80, @@ -276665,7 +276775,8 @@ exports[`shapshots pharma theme should match root theme snapshot 1`] = ` "regular": 16, }, "sizeButtonSmallHeight": { - "regular": 36, + "compact": 28, + "regular": 30, }, "sizeButtonTertiaryLargePaddingHorizontal": { "regular": 16, @@ -276721,7 +276832,8 @@ exports[`shapshots pharma theme should match root theme snapshot 1`] = ` "regular": 8, }, "sizeFieldHeight": { - "regular": 48, + "compact": 36, + "regular": 44, }, "sizeFieldHorizontalMargin": { "compact": 16, diff --git a/src/themeDescriptions/themes/media/index.ts b/src/themeDescriptions/themes/media/index.ts index 59b899c79..b73ab36f9 100644 --- a/src/themeDescriptions/themes/media/index.ts +++ b/src/themeDescriptions/themes/media/index.ts @@ -7,7 +7,7 @@ import { helpers, projectColors, socialColors } from '@/themeDescriptions/common import { darkTheme, lightTheme } from '../../base/paradigm'; const { fontWeightBase3 } = lightTheme; -const { x0, x05, x2, x3, x4, x5, x6, x8, x10, x12 } = helpers; +const { x0, x05, x2, x3, x4, x5, x6, x8 } = helpers; const fontFamilyBase: Property.FontFamily = 'Inter, Helvetica, Arial, sans-serif'; const fontFamilyAccent: Property.FontFamily = `VKSansDisplay, MailSans, ${fontFamilyBase}`; @@ -508,17 +508,23 @@ export const mediaTheme: ThemeMediaDescription = { */ sizeFieldHeight: { - regular: x12, + regular: 44, + compact: 36, }, sizeButtonLargeHeight: { - regular: x12, + regular: 44, + compact: 36, }, + sizeButtonMediumHeight: { - regular: x10, + regular: 36, + compact: 32, }, + sizeButtonSmallHeight: { - regular: 36, + regular: 30, + compact: 28, }, sizeFieldWidthMin: { @@ -608,6 +614,25 @@ export const mediaTheme: ThemeMediaDescription = { regular: x4, }, + sizeButtonBaseSmallPaddingHorizontal: { + regular: 16, + }, + sizeButtonBaseMediumPaddingHorizontal: { + regular: 16, + }, + sizeButtonBaseLargePaddingHorizontal: { + regular: 20, + }, + sizeButtonBaseSmallPaddingHorizontalIcon: { + regular: 12, + }, + sizeButtonBaseMediumPaddingHorizontalIcon: { + regular: 12, + }, + sizeButtonBaseLargePaddingHorizontalIcon: { + regular: 16, + }, + /** * ОТСТУПЫ МЕЖДУ ЭЛЕМЕНТАМИ УПРАВЛЕНИЯ */ @@ -694,6 +719,8 @@ export const mediaTheme: ThemeMediaDescription = { sizeBadgeXL: { regular: 56, }, + + elevation3: '0px 16px 48px 0px rgba(0, 16, 61, 0.28)', }; export const mediaDarkTheme: ThemeMediaDescription = { @@ -704,4 +731,5 @@ export const mediaDarkTheme: ThemeMediaDescription = { ...mediaTheme.colors, ...darkTheme.colors, }, + elevation3: '0px 16px 48px 0px rgba(0, 0, 0, 0.40)', }; From 529b9f2723023dbd76e621d9129b754a94b7899d Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 4 Sep 2024 05:48:11 +0000 Subject: [PATCH 03/36] build(deps): bump peter-evans/create-pull-request from 6 to 7 Bumps [peter-evans/create-pull-request](https://github.com/peter-evans/create-pull-request) from 6 to 7. - [Release notes](https://github.com/peter-evans/create-pull-request/releases) - [Commits](https://github.com/peter-evans/create-pull-request/compare/v6...v7) --- updated-dependencies: - dependency-name: peter-evans/create-pull-request dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] --- .github/workflows/figma.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/figma.yml b/.github/workflows/figma.yml index c2b99a73f..e376a6cd7 100644 --- a/.github/workflows/figma.yml +++ b/.github/workflows/figma.yml @@ -26,7 +26,7 @@ jobs: - run: yarn test -u - name: Create Pull Request - uses: peter-evans/create-pull-request@v6 + uses: peter-evans/create-pull-request@v7 with: token: ${{ secrets.DEVTOOLS_GITHUB_TOKEN }} title: Figma updates From 2f2010579381a5d868f64584beb89133d26dcbde Mon Sep 17 00:00:00 2001 From: nick Date: Mon, 9 Sep 2024 19:38:06 +0300 Subject: [PATCH 04/36] feat(Android): Added tokenized gradients --- .../__snapshots__/snapthots.test.ts.snap | 64 +++++++++---------- .../themes/vkontakteAndroid/index.ts | 14 +++- 2 files changed, 44 insertions(+), 34 deletions(-) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index 0b0134afb..4f38fe9ae 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -442628,19 +442628,19 @@ exports[`shapshots vkontakteAndroid theme should match cssVars snapshot 1`] = ` }, "gradient": { "name": "--vkui--gradient", - "value": "var(--vkui--gradient, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%)", + "value": "var(--vkui--gradient, colorBackgroundContent, transparent)", }, "gradientBlack": { "name": "--vkui--gradient_black", - "value": "var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%)", + "value": "var(--vkui--gradient_black, #00000060, transparent)", }, "gradientTint": { "name": "--vkui--gradient_tint", - "value": "var(--vkui--gradient_tint, rgba(249, 249, 249, 0) 0%, rgba(249, 249, 249, 0.05) 15%, rgba(249, 249, 249, 0.2) 30%, rgba(249, 249, 249, 0.8) 70%, rgba(249, 249, 249, 0.95) 85%, rgba(249, 249, 249, 1) 100%)", + "value": "var(--vkui--gradient_tint, colorBackgroundTertiary, transparent)", }, "gradientWhite": { "name": "--vkui--gradient_white", - "value": "var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%)", + "value": "var(--vkui--gradient_white, #FFFFFF, transparent)", }, "opacityDisable": { "name": "--vkui--opacity_disable", @@ -445362,10 +445362,10 @@ exports[`shapshots vkontakteAndroid theme should match pixelify theme snapshot 1 "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", - "gradientBlack": "rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%", - "gradientTint": "rgba(249, 249, 249, 0) 0%, rgba(249, 249, 249, 0.05) 15%, rgba(249, 249, 249, 0.2) 30%, rgba(249, 249, 249, 0.8) 70%, rgba(249, 249, 249, 0.95) 85%, rgba(249, 249, 249, 1) 100%", - "gradientWhite": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", + "gradient": "colorBackgroundContent, transparent", + "gradientBlack": "#00000060, transparent", + "gradientTint": "colorBackgroundTertiary, transparent", + "gradientWhite": "#FFFFFF, transparent", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, "sizeArrow": { @@ -446773,10 +446773,10 @@ exports[`shapshots vkontakteAndroid theme should match pseudo theme from CssVars "fontWeightBase1": "var(--vkui--font_weight_base1, 600)", "fontWeightBase2": "var(--vkui--font_weight_base2, 500)", "fontWeightBase3": "var(--vkui--font_weight_base3, 400)", - "gradient": "var(--vkui--gradient, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%)", - "gradientBlack": "var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%)", - "gradientTint": "var(--vkui--gradient_tint, rgba(249, 249, 249, 0) 0%, rgba(249, 249, 249, 0.05) 15%, rgba(249, 249, 249, 0.2) 30%, rgba(249, 249, 249, 0.8) 70%, rgba(249, 249, 249, 0.95) 85%, rgba(249, 249, 249, 1) 100%)", - "gradientWhite": "var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%)", + "gradient": "var(--vkui--gradient, colorBackgroundContent, transparent)", + "gradientBlack": "var(--vkui--gradient_black, #00000060, transparent)", + "gradientTint": "var(--vkui--gradient_tint, colorBackgroundTertiary, transparent)", + "gradientWhite": "var(--vkui--gradient_white, #FFFFFF, transparent)", "opacityDisable": "var(--vkui--opacity_disable, 0.4)", "opacityDisableAccessibility": "var(--vkui--opacity_disable_accessibility, 0.64)", "sizeArrow": { @@ -448184,10 +448184,10 @@ exports[`shapshots vkontakteAndroid theme should match root theme snapshot 1`] = "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", - "gradientBlack": "rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%", - "gradientTint": "rgba(249, 249, 249, 0) 0%, rgba(249, 249, 249, 0.05) 15%, rgba(249, 249, 249, 0.2) 30%, rgba(249, 249, 249, 0.8) 70%, rgba(249, 249, 249, 0.95) 85%, rgba(249, 249, 249, 1) 100%", - "gradientWhite": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", + "gradient": "colorBackgroundContent, transparent", + "gradientBlack": "#00000060, transparent", + "gradientTint": "colorBackgroundTertiary, transparent", + "gradientWhite": "#FFFFFF, transparent", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, "sizeArrow": { @@ -451425,19 +451425,19 @@ exports[`shapshots vkontakteAndroidDark theme should match cssVars snapshot 1`] }, "gradient": { "name": "--vkui--gradient", - "value": "var(--vkui--gradient, rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%)", + "value": "var(--vkui--gradient, colorBackgroundContent, transparent)", }, "gradientBlack": { "name": "--vkui--gradient_black", - "value": "var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%)", + "value": "var(--vkui--gradient_black, #00000060, transparent)", }, "gradientTint": { "name": "--vkui--gradient_tint", - "value": "var(--vkui--gradient_tint, rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%)", + "value": "var(--vkui--gradient_tint, colorBackgroundTertiary, transparent)", }, "gradientWhite": { "name": "--vkui--gradient_white", - "value": "var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%)", + "value": "var(--vkui--gradient_white, #FFFFFF, transparent)", }, "opacityDisable": { "name": "--vkui--opacity_disable", @@ -454159,10 +454159,10 @@ exports[`shapshots vkontakteAndroidDark theme should match pixelify theme snapsh "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%", - "gradientBlack": "rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%", - "gradientTint": "rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%", - "gradientWhite": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", + "gradient": "colorBackgroundContent, transparent", + "gradientBlack": "#00000060, transparent", + "gradientTint": "colorBackgroundTertiary, transparent", + "gradientWhite": "#FFFFFF, transparent", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, "sizeArrow": { @@ -455570,10 +455570,10 @@ exports[`shapshots vkontakteAndroidDark theme should match pseudo theme from Css "fontWeightBase1": "var(--vkui--font_weight_base1, 600)", "fontWeightBase2": "var(--vkui--font_weight_base2, 500)", "fontWeightBase3": "var(--vkui--font_weight_base3, 400)", - "gradient": "var(--vkui--gradient, rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%)", - "gradientBlack": "var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%)", - "gradientTint": "var(--vkui--gradient_tint, rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%)", - "gradientWhite": "var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%)", + "gradient": "var(--vkui--gradient, colorBackgroundContent, transparent)", + "gradientBlack": "var(--vkui--gradient_black, #00000060, transparent)", + "gradientTint": "var(--vkui--gradient_tint, colorBackgroundTertiary, transparent)", + "gradientWhite": "var(--vkui--gradient_white, #FFFFFF, transparent)", "opacityDisable": "var(--vkui--opacity_disable, 0.4)", "opacityDisableAccessibility": "var(--vkui--opacity_disable_accessibility, 0.64)", "sizeArrow": { @@ -456981,10 +456981,10 @@ exports[`shapshots vkontakteAndroidDark theme should match root theme snapshot 1 "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%", - "gradientBlack": "rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%", - "gradientTint": "rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%", - "gradientWhite": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", + "gradient": "colorBackgroundContent, transparent", + "gradientBlack": "#00000060, transparent", + "gradientTint": "colorBackgroundTertiary, transparent", + "gradientWhite": "#FFFFFF, transparent", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, "sizeArrow": { diff --git a/src/themeDescriptions/themes/vkontakteAndroid/index.ts b/src/themeDescriptions/themes/vkontakteAndroid/index.ts index 77ba55b03..258ccf40c 100644 --- a/src/themeDescriptions/themes/vkontakteAndroid/index.ts +++ b/src/themeDescriptions/themes/vkontakteAndroid/index.ts @@ -1,5 +1,6 @@ import lodash from 'lodash'; +import { Gradients } from '@/interfaces/general/gradients'; import { DeepPartial } from '@/interfaces/general/tools/utils'; import type { LocalVkontakteAndroidColorsDescriptionStruct, @@ -223,7 +224,7 @@ export const vkontakteLocalColorDark: LocalVkontakteAndroidColorsDescriptionStru const fontFamilyAccent = '"VK Sans Display", -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif'; -const gradients: VkontakteAndroidGradients = { +const colorGradients: VkontakteAndroidGradients = { vkontakteGradientAquamarineBlue: '#7DF1FA, #2BB4D6', vkontakteGradientBlue: '#66CCFF, #3F8AE0', vkontakteGradientCandy: '#FF99CC, #E52E6A', @@ -260,6 +261,13 @@ const gradients: VkontakteAndroidGradients = { vkontakteGradientWomensDay: '#FF99CC, #E52E6A', }; +const gradients: Gradients = { + gradient: 'colorBackgroundContent, transparent', + gradientTint: 'colorBackgroundTertiary, transparent', + gradientWhite: '#FFFFFF, transparent', + gradientBlack: '#00000060, transparent', +}; + export const vkontakteDisplayTitleFontsPartial: DeepPartial = { fontDisplayTitle1: { regular: { @@ -386,7 +394,7 @@ const androidFonts: typeof fonts = lodash.merge Date: Wed, 11 Sep 2024 16:57:39 +0000 Subject: [PATCH 05/36] build(deps): bump express from 4.19.2 to 4.20.0 Bumps [express](https://github.com/expressjs/express) from 4.19.2 to 4.20.0. - [Release notes](https://github.com/expressjs/express/releases) - [Changelog](https://github.com/expressjs/express/blob/master/History.md) - [Commits](https://github.com/expressjs/express/compare/4.19.2...4.20.0) --- updated-dependencies: - dependency-name: express dependency-type: indirect ... Signed-off-by: dependabot[bot] --- yarn.lock | 93 +++++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 67 insertions(+), 26 deletions(-) diff --git a/yarn.lock b/yarn.lock index a883c3d25..2c7a2494c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2710,10 +2710,10 @@ binary-extensions@^2.0.0: resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d" integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA== -body-parser@1.20.2: - version "1.20.2" - resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.2.tgz#6feb0e21c4724d06de7ff38da36dad4f57a747fd" - integrity sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA== +body-parser@1.20.3: + version "1.20.3" + resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.3.tgz#1953431221c6fb5cd63c4b36d53fab0928e548c6" + integrity sha512-7rAxByjUMqQ3/bHJy7D6OGXvx/MMc4IqBn/X0fcM1QUcAItpZrBEYhWGem+tzXH90c+G01ypMcYJBO9Y30203g== dependencies: bytes "3.1.2" content-type "~1.0.5" @@ -2723,7 +2723,7 @@ body-parser@1.20.2: http-errors "2.0.0" iconv-lite "0.4.24" on-finished "2.4.1" - qs "6.11.0" + qs "6.13.0" raw-body "2.5.2" type-is "~1.6.18" unpipe "1.0.0" @@ -3653,6 +3653,11 @@ encodeurl@~1.0.2: resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59" integrity sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w== +encodeurl@~2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-2.0.0.tgz#7b8ea898077d7e409d3ac45474ea38eaf0857a58" + integrity sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg== + enhanced-resolve@^5.0.0, enhanced-resolve@^5.17.1: version "5.17.1" resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.17.1.tgz#67bfbbcc2f81d511be77d686a90267ef7f898a15" @@ -4139,36 +4144,36 @@ expect@^29.7.0: jest-util "^29.7.0" express@^4.17.3: - version "4.19.2" - resolved "https://registry.yarnpkg.com/express/-/express-4.19.2.tgz#e25437827a3aa7f2a827bc8171bbbb664a356465" - integrity sha512-5T6nhjsT+EOMzuck8JjBHARTHfMht0POzlA60WV2pMD3gyXw2LZnZ+ueGdNxG+0calOJcWKbpFcuzLZ91YWq9Q== + version "4.20.0" + resolved "https://registry.yarnpkg.com/express/-/express-4.20.0.tgz#f1d08e591fcec770c07be4767af8eb9bcfd67c48" + integrity sha512-pLdae7I6QqShF5PnNTCVn4hI91Dx0Grkn2+IAsMTgMIKuQVte2dN9PeGSSAME2FR8anOhVA62QDIUaWVfEXVLw== dependencies: accepts "~1.3.8" array-flatten "1.1.1" - body-parser "1.20.2" + body-parser "1.20.3" content-disposition "0.5.4" content-type "~1.0.4" cookie "0.6.0" cookie-signature "1.0.6" debug "2.6.9" depd "2.0.0" - encodeurl "~1.0.2" + encodeurl "~2.0.0" escape-html "~1.0.3" etag "~1.8.1" finalhandler "1.2.0" fresh "0.5.2" http-errors "2.0.0" - merge-descriptors "1.0.1" + merge-descriptors "1.0.3" methods "~1.1.2" on-finished "2.4.1" parseurl "~1.3.3" - path-to-regexp "0.1.7" + path-to-regexp "0.1.10" proxy-addr "~2.0.7" qs "6.11.0" range-parser "~1.2.1" safe-buffer "5.2.1" - send "0.18.0" - serve-static "1.15.0" + send "0.19.0" + serve-static "1.16.0" setprototypeof "1.2.0" statuses "2.0.1" type-is "~1.6.18" @@ -6056,10 +6061,10 @@ memfs@^4.6.0: dependencies: tslib "^2.0.0" -merge-descriptors@1.0.1: - version "1.0.1" - resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.1.tgz#b00aaa556dd8b44568150ec9d1b953f3f90cbb61" - integrity sha512-cCi6g3/Zr1iqQi6ySbseM1Xvooa98N0w31jzUYrXPX2xqObmFGHJ0tQ5u74H3mVh7wLouTseZyYIq39g8cNp1w== +merge-descriptors@1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.3.tgz#d80319a65f3c7935351e5cfdac8f9318504dbed5" + integrity sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ== merge-stream@^2.0.0: version "2.0.0" @@ -6638,10 +6643,10 @@ path-scurry@^1.10.1: lru-cache "^9.1.1 || ^10.0.0" minipass "^5.0.0 || ^6.0.2 || ^7.0.0" -path-to-regexp@0.1.7: - version "0.1.7" - resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c" - integrity sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ== +path-to-regexp@0.1.10: + version "0.1.10" + resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.10.tgz#67e9108c5c0551b9e5326064387de4763c4d5f8b" + integrity sha512-7lf7qcQidTku0Gu3YDPc8DJ1q7OOucfa/BSsIwjuh56VU7katFvuM8hULfkwB3Fns/rsVF7PwPKVw1sl5KQS9w== path-type@^3.0.0: version "3.0.0" @@ -6858,6 +6863,13 @@ qs@6.11.0: dependencies: side-channel "^1.0.4" +qs@6.13.0: + version "6.13.0" + resolved "https://registry.yarnpkg.com/qs/-/qs-6.13.0.tgz#6ca3bd58439f7e245655798997787b0d88a51906" + integrity sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg== + dependencies: + side-channel "^1.0.6" + queue-microtask@^1.2.2: version "1.2.3" resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243" @@ -7292,6 +7304,25 @@ send@0.18.0: range-parser "~1.2.1" statuses "2.0.1" +send@0.19.0: + version "0.19.0" + resolved "https://registry.yarnpkg.com/send/-/send-0.19.0.tgz#bbc5a388c8ea6c048967049dbeac0e4a3f09d7f8" + integrity sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw== + dependencies: + debug "2.6.9" + depd "2.0.0" + destroy "1.2.0" + encodeurl "~1.0.2" + escape-html "~1.0.3" + etag "~1.8.1" + fresh "0.5.2" + http-errors "2.0.0" + mime "1.6.0" + ms "2.1.3" + on-finished "2.4.1" + range-parser "~1.2.1" + statuses "2.0.1" + serialize-javascript@^6.0.1, serialize-javascript@^6.0.2: version "6.0.2" resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-6.0.2.tgz#defa1e055c83bf6d59ea805d8da862254eb6a6c2" @@ -7312,10 +7343,10 @@ serve-index@^1.9.1: mime-types "~2.1.17" parseurl "~1.3.2" -serve-static@1.15.0: - version "1.15.0" - resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.15.0.tgz#faaef08cffe0a1a62f60cad0c4e513cff0ac9540" - integrity sha512-XGuRDNjXUijsUL0vl6nSD7cwURuzEgglbOaFuZM9g3kwDXOWVTck0jLzjPzGD+TazWbboZYu52/9/XPdUgne9g== +serve-static@1.16.0: + version "1.16.0" + resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.16.0.tgz#2bf4ed49f8af311b519c46f272bf6ac3baf38a92" + integrity sha512-pDLK8zwl2eKaYrs8mrPZBJua4hMplRWJ1tIFksVC3FtBEBnl8dxgeHtsaMS8DhS9i4fLObaon6ABoc4/hQGdPA== dependencies: encodeurl "~1.0.2" escape-html "~1.0.3" @@ -7402,6 +7433,16 @@ side-channel@^1.0.4: get-intrinsic "^1.2.4" object-inspect "^1.13.1" +side-channel@^1.0.6: + version "1.0.6" + resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.6.tgz#abd25fb7cd24baf45466406b1096b7831c9215f2" + integrity sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA== + dependencies: + call-bind "^1.0.7" + es-errors "^1.3.0" + get-intrinsic "^1.2.4" + object-inspect "^1.13.1" + signal-exit@^3.0.3, signal-exit@^3.0.7: version "3.0.7" resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9" From 1e9551bb59c2dbc97b5fb97296908ffb381642b1 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Thu, 12 Sep 2024 05:04:46 +0000 Subject: [PATCH 06/36] build(deps-dev): bump ts-jest from 29.2.4 to 29.2.5 Bumps [ts-jest](https://github.com/kulshekhar/ts-jest) from 29.2.4 to 29.2.5. - [Release notes](https://github.com/kulshekhar/ts-jest/releases) - [Changelog](https://github.com/kulshekhar/ts-jest/blob/main/CHANGELOG.md) - [Commits](https://github.com/kulshekhar/ts-jest/compare/v29.2.4...v29.2.5) --- updated-dependencies: - dependency-name: ts-jest dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- package.json | 2 +- yarn.lock | 50 ++++++++++++++++++-------------------------------- 2 files changed, 19 insertions(+), 33 deletions(-) diff --git a/package.json b/package.json index d7be05e40..5141744e9 100644 --- a/package.json +++ b/package.json @@ -93,7 +93,7 @@ "rimraf": "5.0.7", "style-loader": "4.0.0", "terser-webpack-plugin": "5.3.10", - "ts-jest": "29.2.4", + "ts-jest": "29.2.5", "ts-loader": "9.5.1", "ts-morph": "20.0.0", "ts-node": "10.9.2", diff --git a/yarn.lock b/yarn.lock index a883c3d25..a963f0fc3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2796,7 +2796,7 @@ browserslist@^4.21.10, browserslist@^4.22.3, browserslist@^4.23.1: node-releases "^2.0.18" update-browserslist-db "^1.1.0" -bs-logger@0.x: +bs-logger@^0.2.6: version "0.2.6" resolved "https://registry.yarnpkg.com/bs-logger/-/bs-logger-0.2.6.tgz#eb7d365307a72cf974cc6cda76b68354ad336bd8" integrity sha512-pd8DCoxmbgc7hyPKOvxtqNcjYoOsABPQdcCUjGp3d42VR2CX1ORhk2A87oqqu5R1kk+76nsxZupkmyd+MVtCog== @@ -5944,7 +5944,7 @@ lodash.debounce@^4.0.8: resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af" integrity sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow== -lodash.memoize@4.x, lodash.memoize@^4.1.2: +lodash.memoize@^4.1.2: version "4.1.2" resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe" integrity sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag== @@ -5991,13 +5991,6 @@ lru-cache@^5.1.1: dependencies: yallist "^3.0.2" -lru-cache@^6.0.0: - version "6.0.0" - resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94" - integrity sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA== - dependencies: - yallist "^4.0.0" - "lru-cache@^9.1.1 || ^10.0.0": version "10.2.0" resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-10.2.0.tgz#0bd445ca57363465900f4d1f9bd8db343a4d95c3" @@ -6010,7 +6003,7 @@ make-dir@^4.0.0: dependencies: semver "^7.5.3" -make-error@1.x, make-error@^1.1.1: +make-error@^1.1.1, make-error@^1.3.6: version "1.3.6" resolved "https://registry.yarnpkg.com/make-error/-/make-error-1.3.6.tgz#2eb2e37ea9b67c4891f684a1394799af484cf7a2" integrity sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw== @@ -7266,12 +7259,10 @@ semver@^6.1.0, semver@^6.3.0, semver@^6.3.1: resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.1.tgz#556d2ef8689146e46dcea4bfdd095f3434dffcb4" integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA== -semver@^7.3.2, semver@^7.3.4, semver@^7.5.3, semver@^7.5.4: - version "7.6.0" - resolved "https://registry.yarnpkg.com/semver/-/semver-7.6.0.tgz#1a46a4db4bffcccd97b743b5005c8325f23d4e2d" - integrity sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg== - dependencies: - lru-cache "^6.0.0" +semver@^7.3.2, semver@^7.3.4, semver@^7.5.3, semver@^7.5.4, semver@^7.6.3: + version "7.6.3" + resolved "https://registry.yarnpkg.com/semver/-/semver-7.6.3.tgz#980f7b5550bc175fb4dc09403085627f9eb33143" + integrity sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A== send@0.18.0: version "0.18.0" @@ -7942,20 +7933,20 @@ ts-api-utils@^1.0.1: resolved "https://registry.yarnpkg.com/ts-api-utils/-/ts-api-utils-1.2.1.tgz#f716c7e027494629485b21c0df6180f4d08f5e8b" integrity sha512-RIYA36cJn2WiH9Hy77hdF9r7oEwxAtB/TS9/S4Qd90Ap4z5FSiin5zEiTL44OII1Y3IIlEvxwxFUVgrHSZ/UpA== -ts-jest@29.2.4: - version "29.2.4" - resolved "https://registry.yarnpkg.com/ts-jest/-/ts-jest-29.2.4.tgz#38ccf487407d7a63054a72689f6f99b075e296e5" - integrity sha512-3d6tgDyhCI29HlpwIq87sNuI+3Q6GLTTCeYRHCs7vDz+/3GCMwEtV9jezLyl4ZtnBgx00I7hm8PCP8cTksMGrw== +ts-jest@29.2.5: + version "29.2.5" + resolved "https://registry.yarnpkg.com/ts-jest/-/ts-jest-29.2.5.tgz#591a3c108e1f5ebd013d3152142cb5472b399d63" + integrity sha512-KD8zB2aAZrcKIdGk4OwpJggeLcH1FgrICqDSROWqlnJXGCXK4Mn6FcdK2B6670Xr73lHMG1kHw8R87A0ecZ+vA== dependencies: - bs-logger "0.x" + bs-logger "^0.2.6" ejs "^3.1.10" - fast-json-stable-stringify "2.x" + fast-json-stable-stringify "^2.1.0" jest-util "^29.0.0" json5 "^2.2.3" - lodash.memoize "4.x" - make-error "1.x" - semver "^7.5.3" - yargs-parser "^21.0.1" + lodash.memoize "^4.1.2" + make-error "^1.3.6" + semver "^7.6.3" + yargs-parser "^21.1.1" ts-loader@9.5.1: version "9.5.1" @@ -8524,17 +8515,12 @@ yallist@^3.0.2: resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.1.1.tgz#dbb7daf9bfd8bac9ab45ebf602b8cbad0d5d08fd" integrity sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g== -yallist@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72" - integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A== - yaml@~2.5.0: version "2.5.0" resolved "https://registry.yarnpkg.com/yaml/-/yaml-2.5.0.tgz#c6165a721cf8000e91c36490a41d7be25176cf5d" integrity sha512-2wWLbGbYDiSqqIKoPjar3MPgB94ErzCtrNE1FdqGuaO0pi2JGjmE8aW8TDZwzU7vuxcGRdL/4gPQwQ7hD5AMSw== -yargs-parser@^21.0.1, yargs-parser@^21.1.1: +yargs-parser@^21.1.1: version "21.1.1" resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-21.1.1.tgz#9096bceebf990d21bb31fa9516e0ede294a77d35" integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw== From 0f3a4db3b3631c1ae9bd25a2cc098de1e07bd928 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Thu, 12 Sep 2024 05:04:52 +0000 Subject: [PATCH 07/36] build(deps-dev): bump lint-staged from 15.2.9 to 15.2.10 Bumps [lint-staged](https://github.com/lint-staged/lint-staged) from 15.2.9 to 15.2.10. - [Release notes](https://github.com/lint-staged/lint-staged/releases) - [Changelog](https://github.com/lint-staged/lint-staged/blob/master/CHANGELOG.md) - [Commits](https://github.com/lint-staged/lint-staged/compare/v15.2.9...v15.2.10) --- updated-dependencies: - dependency-name: lint-staged dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- package.json | 2 +- yarn.lock | 18 +++++++++--------- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index d7be05e40..c83e68b92 100644 --- a/package.json +++ b/package.json @@ -85,7 +85,7 @@ "husky": "9.1.4", "jest": "29.7.0", "jest-junit": "16.0.0", - "lint-staged": "15.2.9", + "lint-staged": "15.2.10", "lodash": "4.17.21", "prettier": "3.3.2", "react": "18.3.1", diff --git a/yarn.lock b/yarn.lock index a883c3d25..b080d5d92 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5885,10 +5885,10 @@ lines-and-columns@^1.1.6: resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632" integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg== -lint-staged@15.2.9: - version "15.2.9" - resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-15.2.9.tgz#bf70d40b6b192df6ad756fb89822211615e0f4da" - integrity sha512-BZAt8Lk3sEnxw7tfxM7jeZlPRuT4M68O0/CwZhhaw6eeWu0Lz5eERE3m386InivXB64fp/mDID452h48tvKlRQ== +lint-staged@15.2.10: + version "15.2.10" + resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-15.2.10.tgz#92ac222f802ba911897dcf23671da5bb80643cd2" + integrity sha512-5dY5t743e1byO19P9I4b3x8HJwalIznL5E1FWYnU6OWw33KxNBSLAc6Cy7F2PsFEO8FKnLwjwm5hx7aMF0jzZg== dependencies: chalk "~5.3.0" commander "~12.1.0" @@ -5896,7 +5896,7 @@ lint-staged@15.2.9: execa "~8.0.1" lilconfig "~3.1.2" listr2 "~8.2.4" - micromatch "~4.0.7" + micromatch "~4.0.8" pidtree "~0.6.0" string-argv "~0.3.2" yaml "~2.5.0" @@ -6095,10 +6095,10 @@ micromatch@^3.1.10: snapdragon "^0.8.1" to-regex "^3.0.2" -micromatch@^4.0.0, micromatch@^4.0.2, micromatch@^4.0.4, micromatch@~4.0.7: - version "4.0.7" - resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.7.tgz#33e8190d9fe474a9895525f5618eee136d46c2e5" - integrity sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q== +micromatch@^4.0.0, micromatch@^4.0.2, micromatch@^4.0.4, micromatch@~4.0.8: + version "4.0.8" + resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.8.tgz#d66fa18f3a47076789320b9b1af32bd86d9fa202" + integrity sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA== dependencies: braces "^3.0.3" picomatch "^2.3.1" From 3cd4b094af35aefc87bf92c45491abde93027fb5 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Thu, 12 Sep 2024 05:05:06 +0000 Subject: [PATCH 08/36] build(deps-dev): bump webpack-dev-server from 5.0.4 to 5.1.0 Bumps [webpack-dev-server](https://github.com/webpack/webpack-dev-server) from 5.0.4 to 5.1.0. - [Release notes](https://github.com/webpack/webpack-dev-server/releases) - [Changelog](https://github.com/webpack/webpack-dev-server/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack/webpack-dev-server/compare/v5.0.4...v5.1.0) --- updated-dependencies: - dependency-name: webpack-dev-server dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package.json | 2 +- yarn.lock | 146 +++++++++++++++++++++++++++------------------------ 2 files changed, 77 insertions(+), 71 deletions(-) diff --git a/package.json b/package.json index d7be05e40..8e3bee790 100644 --- a/package.json +++ b/package.json @@ -104,7 +104,7 @@ "typescript-eslint": "7.0.1", "webpack": "5.94.0", "webpack-cli": "5.1.4", - "webpack-dev-server": "5.0.4", + "webpack-dev-server": "5.1.0", "webpack-notifier": "1.15.0" }, "engines": { diff --git a/yarn.lock b/yarn.lock index a883c3d25..6fe6c8955 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2710,10 +2710,10 @@ binary-extensions@^2.0.0: resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d" integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA== -body-parser@1.20.2: - version "1.20.2" - resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.2.tgz#6feb0e21c4724d06de7ff38da36dad4f57a747fd" - integrity sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA== +body-parser@1.20.3: + version "1.20.3" + resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.3.tgz#1953431221c6fb5cd63c4b36d53fab0928e548c6" + integrity sha512-7rAxByjUMqQ3/bHJy7D6OGXvx/MMc4IqBn/X0fcM1QUcAItpZrBEYhWGem+tzXH90c+G01ypMcYJBO9Y30203g== dependencies: bytes "3.1.2" content-type "~1.0.5" @@ -2723,7 +2723,7 @@ body-parser@1.20.2: http-errors "2.0.0" iconv-lite "0.4.24" on-finished "2.4.1" - qs "6.11.0" + qs "6.13.0" raw-body "2.5.2" type-is "~1.6.18" unpipe "1.0.0" @@ -3401,13 +3401,6 @@ default-browser@^5.2.1: bundle-name "^4.1.0" default-browser-id "^5.0.0" -default-gateway@^6.0.3: - version "6.0.3" - resolved "https://registry.yarnpkg.com/default-gateway/-/default-gateway-6.0.3.tgz#819494c888053bdb743edbf343d6cdf7f2943a71" - integrity sha512-fwSOJsbbNzZ/CUFpqFBqYfYNLj1NbMPm8MMCIzHjC83iSJRBEGmDUxU+WP661BaBQImeC2yHwXtz+P/O9o+XEg== - dependencies: - execa "^5.0.0" - define-data-property@^1.0.1, define-data-property@^1.1.2: version "1.1.4" resolved "https://registry.yarnpkg.com/define-data-property/-/define-data-property-1.1.4.tgz#894dc141bb7d3060ae4366f6a0107e68fbe48c5e" @@ -3653,6 +3646,11 @@ encodeurl@~1.0.2: resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59" integrity sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w== +encodeurl@~2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-2.0.0.tgz#7b8ea898077d7e409d3ac45474ea38eaf0857a58" + integrity sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg== + enhanced-resolve@^5.0.0, enhanced-resolve@^5.17.1: version "5.17.1" resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.17.1.tgz#67bfbbcc2f81d511be77d686a90267ef7f898a15" @@ -4138,37 +4136,37 @@ expect@^29.7.0: jest-message-util "^29.7.0" jest-util "^29.7.0" -express@^4.17.3: - version "4.19.2" - resolved "https://registry.yarnpkg.com/express/-/express-4.19.2.tgz#e25437827a3aa7f2a827bc8171bbbb664a356465" - integrity sha512-5T6nhjsT+EOMzuck8JjBHARTHfMht0POzlA60WV2pMD3gyXw2LZnZ+ueGdNxG+0calOJcWKbpFcuzLZ91YWq9Q== +express@^4.19.2: + version "4.21.0" + resolved "https://registry.yarnpkg.com/express/-/express-4.21.0.tgz#d57cb706d49623d4ac27833f1cbc466b668eb915" + integrity sha512-VqcNGcj/Id5ZT1LZ/cfihi3ttTn+NJmkli2eZADigjq29qTlWi/hAQ43t/VLPq8+UX06FCEx3ByOYet6ZFblng== dependencies: accepts "~1.3.8" array-flatten "1.1.1" - body-parser "1.20.2" + body-parser "1.20.3" content-disposition "0.5.4" content-type "~1.0.4" cookie "0.6.0" cookie-signature "1.0.6" debug "2.6.9" depd "2.0.0" - encodeurl "~1.0.2" + encodeurl "~2.0.0" escape-html "~1.0.3" etag "~1.8.1" - finalhandler "1.2.0" + finalhandler "1.3.1" fresh "0.5.2" http-errors "2.0.0" - merge-descriptors "1.0.1" + merge-descriptors "1.0.3" methods "~1.1.2" on-finished "2.4.1" parseurl "~1.3.3" - path-to-regexp "0.1.7" + path-to-regexp "0.1.10" proxy-addr "~2.0.7" - qs "6.11.0" + qs "6.13.0" range-parser "~1.2.1" safe-buffer "5.2.1" - send "0.18.0" - serve-static "1.15.0" + send "0.19.0" + serve-static "1.16.2" setprototypeof "1.2.0" statuses "2.0.1" type-is "~1.6.18" @@ -4311,13 +4309,13 @@ fill-range@^7.1.1: dependencies: to-regex-range "^5.0.1" -finalhandler@1.2.0: - version "1.2.0" - resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.2.0.tgz#7d23fe5731b207b4640e4fcd00aec1f9207a7b32" - integrity sha512-5uXcUVftlQMFnWC9qu/svkWv3GTd2PfUhK/3PLkYNAe7FbqJMt3515HaxE6eRL74GdsriiwujiawdaB1BpEISg== +finalhandler@1.3.1: + version "1.3.1" + resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.3.1.tgz#0c575f1d1d324ddd1da35ad7ece3df7d19088019" + integrity sha512-6BN9trH7bp3qvnrRyzsBz+g3lZxTNZTbVO2EV1CS0WIcDbawYVdYvGflME/9QP0h0pYlCDBCTjYa9nZzMDpyxQ== dependencies: debug "2.6.9" - encodeurl "~1.0.2" + encodeurl "~2.0.0" escape-html "~1.0.3" on-finished "2.4.1" parseurl "~1.3.3" @@ -6056,10 +6054,10 @@ memfs@^4.6.0: dependencies: tslib "^2.0.0" -merge-descriptors@1.0.1: - version "1.0.1" - resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.1.tgz#b00aaa556dd8b44568150ec9d1b953f3f90cbb61" - integrity sha512-cCi6g3/Zr1iqQi6ySbseM1Xvooa98N0w31jzUYrXPX2xqObmFGHJ0tQ5u74H3mVh7wLouTseZyYIq39g8cNp1w== +merge-descriptors@1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.3.tgz#d80319a65f3c7935351e5cfdac8f9318504dbed5" + integrity sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ== merge-stream@^2.0.0: version "2.0.0" @@ -6638,10 +6636,10 @@ path-scurry@^1.10.1: lru-cache "^9.1.1 || ^10.0.0" minipass "^5.0.0 || ^6.0.2 || ^7.0.0" -path-to-regexp@0.1.7: - version "0.1.7" - resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c" - integrity sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ== +path-to-regexp@0.1.10: + version "0.1.10" + resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.10.tgz#67e9108c5c0551b9e5326064387de4763c4d5f8b" + integrity sha512-7lf7qcQidTku0Gu3YDPc8DJ1q7OOucfa/BSsIwjuh56VU7katFvuM8hULfkwB3Fns/rsVF7PwPKVw1sl5KQS9w== path-type@^3.0.0: version "3.0.0" @@ -6851,12 +6849,12 @@ pure-rand@^6.0.0: resolved "https://registry.yarnpkg.com/pure-rand/-/pure-rand-6.0.4.tgz#50b737f6a925468679bff00ad20eade53f37d5c7" integrity sha512-LA0Y9kxMYv47GIPJy6MI84fqTd2HmYZI83W/kM/SkKfDlajnZYfmXFTxkbY+xSBPkLJxltMa9hIkmdc29eguMA== -qs@6.11.0: - version "6.11.0" - resolved "https://registry.yarnpkg.com/qs/-/qs-6.11.0.tgz#fd0d963446f7a65e1367e01abd85429453f0c37a" - integrity sha512-MvjoMCJwEarSbUYk5O+nmoSzSutSsTwF85zcHPQ9OrlFoZOYIjaqBAJIqIXjptyD5vThxGq52Xu/MaJzRkIk4Q== +qs@6.13.0: + version "6.13.0" + resolved "https://registry.yarnpkg.com/qs/-/qs-6.13.0.tgz#6ca3bd58439f7e245655798997787b0d88a51906" + integrity sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg== dependencies: - side-channel "^1.0.4" + side-channel "^1.0.6" queue-microtask@^1.2.2: version "1.2.3" @@ -7143,7 +7141,7 @@ rfdc@^1.4.1: resolved "https://registry.yarnpkg.com/rfdc/-/rfdc-1.4.1.tgz#778f76c4fb731d93414e8f925fbecf64cce7f6ca" integrity sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA== -rimraf@5.0.7, rimraf@^5.0.5: +rimraf@5.0.7: version "5.0.7" resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-5.0.7.tgz#27bddf202e7d89cb2e0381656380d1734a854a74" integrity sha512-nV6YcJo5wbLW77m+8KjH8aB/7/rxQy9SZ0HY5shnwULfS+9nmTtVXAJET5NdZmCzA4fPI/Hm1wo/Po/4mopOdg== @@ -7273,10 +7271,10 @@ semver@^7.3.2, semver@^7.3.4, semver@^7.5.3, semver@^7.5.4: dependencies: lru-cache "^6.0.0" -send@0.18.0: - version "0.18.0" - resolved "https://registry.yarnpkg.com/send/-/send-0.18.0.tgz#670167cc654b05f5aa4a767f9113bb371bc706be" - integrity sha512-qqWzuOjSFOuqPjFe4NOsMLafToQQwBSOEpS+FwEt3A2V3vKubTquT3vmLTQpFgMXp8AlFWFuP1qKaJZOtPpVXg== +send@0.19.0: + version "0.19.0" + resolved "https://registry.yarnpkg.com/send/-/send-0.19.0.tgz#bbc5a388c8ea6c048967049dbeac0e4a3f09d7f8" + integrity sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw== dependencies: debug "2.6.9" depd "2.0.0" @@ -7312,15 +7310,15 @@ serve-index@^1.9.1: mime-types "~2.1.17" parseurl "~1.3.2" -serve-static@1.15.0: - version "1.15.0" - resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.15.0.tgz#faaef08cffe0a1a62f60cad0c4e513cff0ac9540" - integrity sha512-XGuRDNjXUijsUL0vl6nSD7cwURuzEgglbOaFuZM9g3kwDXOWVTck0jLzjPzGD+TazWbboZYu52/9/XPdUgne9g== +serve-static@1.16.2: + version "1.16.2" + resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.16.2.tgz#b6a5343da47f6bdd2673848bf45754941e803296" + integrity sha512-VqpjJZKadQB/PEbEwvFdO43Ax5dFBZ2UECszz8bQ7pi7wt//PWe1P6MN7eCnjsatYtBT6EuiClbjSWP2WrIoTw== dependencies: - encodeurl "~1.0.2" + encodeurl "~2.0.0" escape-html "~1.0.3" parseurl "~1.3.3" - send "0.18.0" + send "0.19.0" set-function-length@^1.2.1: version "1.2.1" @@ -7402,6 +7400,16 @@ side-channel@^1.0.4: get-intrinsic "^1.2.4" object-inspect "^1.13.1" +side-channel@^1.0.6: + version "1.0.6" + resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.6.tgz#abd25fb7cd24baf45466406b1096b7831c9215f2" + integrity sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA== + dependencies: + call-bind "^1.0.7" + es-errors "^1.3.0" + get-intrinsic "^1.2.4" + object-inspect "^1.13.1" + signal-exit@^3.0.3, signal-exit@^3.0.7: version "3.0.7" resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9" @@ -8308,10 +8316,10 @@ webpack-cli@5.1.4: rechoir "^0.8.0" webpack-merge "^5.7.3" -webpack-dev-middleware@^7.1.0: - version "7.1.0" - resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-7.1.0.tgz#7255e24924d4abda607a6ed76941ae35e6051a9f" - integrity sha512-+RYhGOyviHkKdMi1aaT8WZBQW033YgyBgtQHF2kMWo3mYA9z7W2AjsyY/DIzvp2Bhzys4UgHXFsIyTiL5qRBVw== +webpack-dev-middleware@^7.4.2: + version "7.4.2" + resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-7.4.2.tgz#40e265a3d3d26795585cff8207630d3a8ff05877" + integrity sha512-xOO8n6eggxnwYpy1NlzUKpvrjfJTvae5/D6WOK0S2LSo7vjmo5gCM1DbLUmFqrMTJP+W/0YZNctm7jasWvLuBA== dependencies: colorette "^2.0.10" memfs "^4.6.0" @@ -8320,10 +8328,10 @@ webpack-dev-middleware@^7.1.0: range-parser "^1.2.1" schema-utils "^4.0.0" -webpack-dev-server@5.0.4: - version "5.0.4" - resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-5.0.4.tgz#cb6ea47ff796b9251ec49a94f24a425e12e3c9b8" - integrity sha512-dljXhUgx3HqKP2d8J/fUMvhxGhzjeNVarDLcbO/EWMSgRizDkxHQDZQaLFL5VJY9tRBj2Gz+rvCEYYvhbqPHNA== +webpack-dev-server@5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-5.1.0.tgz#8f44147402b4d8ab99bfeb9b6880daa1411064e5" + integrity sha512-aQpaN81X6tXie1FoOB7xlMfCsN19pSvRAeYUHOdFWOlhpQ/LlbfTqYwwmEDFV0h8GGuqmCmKmT+pxcUV/Nt2gQ== dependencies: "@types/bonjour" "^3.5.13" "@types/connect-history-api-fallback" "^1.5.4" @@ -8338,8 +8346,7 @@ webpack-dev-server@5.0.4: colorette "^2.0.10" compression "^1.7.4" connect-history-api-fallback "^2.0.0" - default-gateway "^6.0.3" - express "^4.17.3" + express "^4.19.2" graceful-fs "^4.2.6" html-entities "^2.4.0" http-proxy-middleware "^2.0.3" @@ -8347,14 +8354,13 @@ webpack-dev-server@5.0.4: launch-editor "^2.6.1" open "^10.0.3" p-retry "^6.2.0" - rimraf "^5.0.5" schema-utils "^4.2.0" selfsigned "^2.4.1" serve-index "^1.9.1" sockjs "^0.3.24" spdy "^4.0.2" - webpack-dev-middleware "^7.1.0" - ws "^8.16.0" + webpack-dev-middleware "^7.4.2" + ws "^8.18.0" webpack-merge@^5.7.3: version "5.10.0" @@ -8504,10 +8510,10 @@ write-file-atomic@^4.0.2: imurmurhash "^0.1.4" signal-exit "^3.0.7" -ws@^8.16.0: - version "8.17.1" - resolved "https://registry.yarnpkg.com/ws/-/ws-8.17.1.tgz#9293da530bb548febc95371d90f9c878727d919b" - integrity sha512-6XQFvXTkbfUOZOKKILFG1PDK2NDQs4azKQl26T0YS5CxqWLgXajbPZ+h4gZekJyRqFU8pvnbAbbs/3TgRPy+GQ== +ws@^8.18.0: + version "8.18.0" + resolved "https://registry.yarnpkg.com/ws/-/ws-8.18.0.tgz#0d7505a6eafe2b0e712d232b42279f53bc289bbc" + integrity sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw== xml@^1.0.1: version "1.0.1" From 6eb7fc0eb28ef9fa338b6a57c072c22058dcb6ca Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Thu, 19 Sep 2024 19:50:27 +0300 Subject: [PATCH 09/36] feat/tokenized-gradients: wip new gradient helper function --- .../helpers/getGradientPointsFromColor.ts | 68 ++++++++++++++----- src/build/helpers/tokenHelpers.test.ts | 30 +++++++- src/build/helpers/tokenHelpers.ts | 54 ++++++++++++++- 3 files changed, 131 insertions(+), 21 deletions(-) diff --git a/src/build/helpers/getGradientPointsFromColor.ts b/src/build/helpers/getGradientPointsFromColor.ts index 5799304f4..cf3ad10d1 100644 --- a/src/build/helpers/getGradientPointsFromColor.ts +++ b/src/build/helpers/getGradientPointsFromColor.ts @@ -3,28 +3,62 @@ import type { Property } from 'csstype'; import { GradientPoints } from '@/interfaces/general/gradients'; -type OpacityMap = Array<[number, number]>; +import { getVariableName } from '../themeProcessors/extractVarsNames/extractVarsNames'; + +export type OpacityPoints = [number, number][]; + +type GradientPointRaw = () => { + value: Property.Color; + key?: string; + prefix?: string; +}; + +export const defaultOpacityPoints: OpacityPoints = [ + [0, 0], + [0.05, 15], + [0.2, 30], + [0.8, 70], + [0.95, 85], + [1, 100], +]; + +export function makeGradientPointRaw( + value: Property.Color, + key?: string, + prefix?: string, +): GradientPointRaw { + return () => ({ + value, + key, + prefix, + }); +} export function getGradientPointsFromColor( - colorArg: Property.Color, + colorArg: Property.Color | GradientPointRaw, opacityMultiplier = 1, + opacityPoints: OpacityPoints = defaultOpacityPoints, ): GradientPoints { - const opacityMap: OpacityMap = [ - [0, 0], - [0.05, 15], - [0.2, 30], - [0.8, 70], - [0.95, 85], - [1, 100], - ]; - - const colorRGB: string = color(colorArg).rgb().array().join(', '); - - return opacityMap + const gradientPointData = typeof colorArg === 'function' ? colorArg() : { value: colorArg }; + + const colorRGB: string = color(gradientPointData.value).rgb().array().join(', '); + const colorAlpha = color(gradientPointData.value).alpha(); + + return opacityPoints .map(([pointOpacity, pointCoordinate]) => { - return `rgba(${colorRGB}, ${ - Math.round(pointOpacity * opacityMultiplier * 1000) / 1000 - }) ${pointCoordinate}%`; + const targetOpacity = colorAlpha < 1 ? colorAlpha : pointOpacity; + const colorValue = `rgba(${colorRGB}, ${Math.round(targetOpacity * opacityMultiplier * 1000) / 1000})`; + + if (typeof gradientPointData.key === 'string') { + const tokenName = getVariableName({ + key: gradientPointData.key, + prefix: gradientPointData.prefix, + }); + + return `var(${tokenName}, ${colorValue}) ${pointCoordinate}%`; + } + + return `${colorValue} ${pointCoordinate}%`; }) .join(', '); } diff --git a/src/build/helpers/tokenHelpers.test.ts b/src/build/helpers/tokenHelpers.test.ts index 107ca643a..07e41a9f7 100644 --- a/src/build/helpers/tokenHelpers.test.ts +++ b/src/build/helpers/tokenHelpers.test.ts @@ -1,6 +1,6 @@ import { describe, expect, test } from '@jest/globals'; -import { alias, staticRef } from '@/build/helpers/tokenHelpers'; +import { alias, gradient, namedAlias, staticRef } from '@/build/helpers/tokenHelpers'; describe('tokenHelpers', () => { describe('alias', () => { @@ -11,6 +11,17 @@ describe('tokenHelpers', () => { }); }); + describe('namedAlias', () => { + test('maps token to another token, preserving name', () => { + expect(namedAlias('sizeArrow')({ sizeArrow: { regular: 10 } })).toEqual([ + 'sizeArrow', + { + regular: 10, + }, + ]); + }); + }); + describe('staticRef', () => { test('returns static value', () => { expect(staticRef(10)).toEqual(10); @@ -22,4 +33,21 @@ describe('tokenHelpers', () => { ); }); }); + + describe('gradient', () => { + test('calculates gradient string', () => { + const gradientToken = gradient([namedAlias('colorIconPrimary'), 'transparent']); + const gradientValue = gradientToken({ colors: { colorIconPrimary: 'blue' } as any }); + + expect(gradientValue).toEqual( + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 1)) 0%, rgba(0, 0, 0, 0, 0) 100%', + ); + }); + + test('fails if bad number of arguments is given', () => { + expect(() => gradient([namedAlias('colorIconPrimary')])).toThrowError( + 'Gradient stops length (1) is not equal to the number of opacity points given (2)', + ); + }); + }); }); diff --git a/src/build/helpers/tokenHelpers.ts b/src/build/helpers/tokenHelpers.ts index 8f520a7ce..f56cd61e8 100644 --- a/src/build/helpers/tokenHelpers.ts +++ b/src/build/helpers/tokenHelpers.ts @@ -1,8 +1,27 @@ -import { ThemeGeneral } from '@/interfaces/general'; +import type { Property } from 'csstype'; + +import { ThemeDescription } from '@/interfaces/general'; import { Token } from '@/interfaces/general/tools/tokenValue'; -export function alias(token: string): (theme: Partial) => Token { - return (theme) => theme[token]; +import { getGradientPointsFromColor, makeGradientPointRaw } from './getGradientPointsFromColor'; + +export type TokenFunction = (theme: Partial) => Token; +export type NamedTokenFunction = ( + theme: Partial, +) => [string | undefined, Token]; + +export type OpacityPoint = [number, number]; + +function readThemeToken(theme: any, token: string): Token { + return theme[token] ?? (theme['colors'] ?? {})[token]; +} + +export function alias(token: string): TokenFunction { + return (theme) => readThemeToken(theme, token); +} + +export function namedAlias(token: string): NamedTokenFunction { + return (theme) => [token, readThemeToken(theme, token)]; } export function staticRef(value: Token): T { @@ -12,3 +31,32 @@ export function staticRef(value: Token): T { return value; } + +export function gradient( + stops: (Property.Color | NamedTokenFunction)[], + opacityPoints: OpacityPoint[] = [ + [1, 0], + [1, 100], + ], +): TokenFunction { + if (stops.length !== opacityPoints.length) { + throw new Error( + `Gradient stops length (${ + stops.length + }) is not equal to the number of opacity points given (${opacityPoints.length})`, + ); + } + + return (theme) => { + return opacityPoints + .map(([pointOpacity, pointCoordinate], index) => { + const stop = stops[index]; + const [stopKey, stopValue] = typeof stop === 'function' ? stop(theme) : [undefined, stop]; + + const pointRaw = makeGradientPointRaw(stopValue, stopKey); + + return getGradientPointsFromColor(pointRaw, 1, [[pointOpacity, pointCoordinate]]); + }) + .join(', '); + }; +} From 496c9cf5136307531856f6d9686ce2437b45a4cc Mon Sep 17 00:00:00 2001 From: Andrey Medvedev Date: Tue, 24 Sep 2024 11:27:31 +0300 Subject: [PATCH 10/36] Use vkCom theme color for vkCom gradient instead of base vk theme It should be similar to the content backgroud color --- src/themeDescriptions/themes/vkCom/index.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/themeDescriptions/themes/vkCom/index.ts b/src/themeDescriptions/themes/vkCom/index.ts index b8a9475bb..f25268c7a 100644 --- a/src/themeDescriptions/themes/vkCom/index.ts +++ b/src/themeDescriptions/themes/vkCom/index.ts @@ -1,7 +1,9 @@ import { vkcom_dark, vkcom_light } from '@vkontakte/appearance/main.valette/scheme_web.json'; import lodash from 'lodash'; +import { getGradientPointsFromColor } from '@/build/helpers/getGradientPointsFromColor'; import { ColorsDescription } from '@/interfaces/general'; +import { Gradients } from '@/interfaces/general/gradients'; import { DeepPartial } from '@/interfaces/general/tools/utils'; import { ThemeVkComDescription } from '@/interfaces/themes/vkCom'; import { ThemeVkComDarkDescription } from '@/interfaces/themes/vkComDark'; @@ -394,10 +396,16 @@ const vkComDarkColor: ColorsDescription = { }, }; +export const vkComDarkGradient: Gradients = { + ...darkGradient, + gradientTint: getGradientPointsFromColor(resolveColor(vkcom_dark.colors.background_light)), + gradient: getGradientPointsFromColor(resolveColor(vkcom_dark.colors.background_content)), +}; + export const vkComThemeDark: ThemeVkComDarkDescription = { ...vkComTheme, ...vkComDarkColor, - ...darkGradient, + ...vkComDarkGradient, ...darkElevation, themeName: 'vkComDark', themeNameBase: 'vkCom', From 3ea313ab6f104a8cc8a8ce1e66d3b6984f9e7238 Mon Sep 17 00:00:00 2001 From: Andrey Medvedev Date: Tue, 24 Sep 2024 13:02:37 +0300 Subject: [PATCH 11/36] Update snapshots --- .../__snapshots__/snapthots.test.ts.snap | 32 +++++++++---------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index b79959f27..6e99af7d8 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -400636,7 +400636,7 @@ exports[`shapshots vkComDark theme should match cssVars snapshot 1`] = ` }, "gradient": { "name": "--vkui--gradient", - "value": "var(--vkui--gradient, rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%)", + "value": "var(--vkui--gradient, rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 0.05) 15%, rgba(34, 34, 34, 0.2) 30%, rgba(34, 34, 34, 0.8) 70%, rgba(34, 34, 34, 0.95) 85%, rgba(34, 34, 34, 1) 100%)", }, "gradientBlack": { "name": "--vkui--gradient_black", @@ -400644,7 +400644,7 @@ exports[`shapshots vkComDark theme should match cssVars snapshot 1`] = ` }, "gradientTint": { "name": "--vkui--gradient_tint", - "value": "var(--vkui--gradient_tint, rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%)", + "value": "var(--vkui--gradient_tint, rgba(41, 41, 41, 0) 0%, rgba(41, 41, 41, 0.05) 15%, rgba(41, 41, 41, 0.2) 30%, rgba(41, 41, 41, 0.8) 70%, rgba(41, 41, 41, 0.95) 85%, rgba(41, 41, 41, 1) 100%)", }, "gradientWhite": { "name": "--vkui--gradient_white", @@ -402220,9 +402220,9 @@ exports[`shapshots vkComDark theme should match pixelify theme snapshot 1`] = ` "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%", + "gradient": "rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 0.05) 15%, rgba(34, 34, 34, 0.2) 30%, rgba(34, 34, 34, 0.8) 70%, rgba(34, 34, 34, 0.95) 85%, rgba(34, 34, 34, 1) 100%", "gradientBlack": "rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%", - "gradientTint": "rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%", + "gradientTint": "rgba(41, 41, 41, 0) 0%, rgba(41, 41, 41, 0.05) 15%, rgba(41, 41, 41, 0.2) 30%, rgba(41, 41, 41, 0.8) 70%, rgba(41, 41, 41, 0.95) 85%, rgba(41, 41, 41, 1) 100%", "gradientWhite": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, @@ -403231,9 +403231,9 @@ exports[`shapshots vkComDark theme should match pseudo theme from CssVars 1`] = "fontWeightBase1": "var(--vkui--font_weight_base1, 600)", "fontWeightBase2": "var(--vkui--font_weight_base2, 500)", "fontWeightBase3": "var(--vkui--font_weight_base3, 400)", - "gradient": "var(--vkui--gradient, rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%)", + "gradient": "var(--vkui--gradient, rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 0.05) 15%, rgba(34, 34, 34, 0.2) 30%, rgba(34, 34, 34, 0.8) 70%, rgba(34, 34, 34, 0.95) 85%, rgba(34, 34, 34, 1) 100%)", "gradientBlack": "var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%)", - "gradientTint": "var(--vkui--gradient_tint, rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%)", + "gradientTint": "var(--vkui--gradient_tint, rgba(41, 41, 41, 0) 0%, rgba(41, 41, 41, 0.05) 15%, rgba(41, 41, 41, 0.2) 30%, rgba(41, 41, 41, 0.8) 70%, rgba(41, 41, 41, 0.95) 85%, rgba(41, 41, 41, 1) 100%)", "gradientWhite": "var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%)", "opacityDisable": "var(--vkui--opacity_disable, 0.4)", "opacityDisableAccessibility": "var(--vkui--opacity_disable_accessibility, 0.64)", @@ -404242,9 +404242,9 @@ exports[`shapshots vkComDark theme should match root theme snapshot 1`] = ` "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%", + "gradient": "rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 0.05) 15%, rgba(34, 34, 34, 0.2) 30%, rgba(34, 34, 34, 0.8) 70%, rgba(34, 34, 34, 0.95) 85%, rgba(34, 34, 34, 1) 100%", "gradientBlack": "rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%", - "gradientTint": "rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%", + "gradientTint": "rgba(41, 41, 41, 0) 0%, rgba(41, 41, 41, 0.05) 15%, rgba(41, 41, 41, 0.2) 30%, rgba(41, 41, 41, 0.8) 70%, rgba(41, 41, 41, 0.95) 85%, rgba(41, 41, 41, 1) 100%", "gradientWhite": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, @@ -471617,7 +471617,7 @@ exports[`shapshots vkontakteComDark theme should match cssVars snapshot 1`] = ` }, "gradient": { "name": "--vkui--gradient", - "value": "var(--vkui--gradient, rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%)", + "value": "var(--vkui--gradient, rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 0.05) 15%, rgba(34, 34, 34, 0.2) 30%, rgba(34, 34, 34, 0.8) 70%, rgba(34, 34, 34, 0.95) 85%, rgba(34, 34, 34, 1) 100%)", }, "gradientBlack": { "name": "--vkui--gradient_black", @@ -471625,7 +471625,7 @@ exports[`shapshots vkontakteComDark theme should match cssVars snapshot 1`] = ` }, "gradientTint": { "name": "--vkui--gradient_tint", - "value": "var(--vkui--gradient_tint, rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%)", + "value": "var(--vkui--gradient_tint, rgba(41, 41, 41, 0) 0%, rgba(41, 41, 41, 0.05) 15%, rgba(41, 41, 41, 0.2) 30%, rgba(41, 41, 41, 0.8) 70%, rgba(41, 41, 41, 0.95) 85%, rgba(41, 41, 41, 1) 100%)", }, "gradientWhite": { "name": "--vkui--gradient_white", @@ -474345,9 +474345,9 @@ exports[`shapshots vkontakteComDark theme should match pixelify theme snapshot 1 "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%", + "gradient": "rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 0.05) 15%, rgba(34, 34, 34, 0.2) 30%, rgba(34, 34, 34, 0.8) 70%, rgba(34, 34, 34, 0.95) 85%, rgba(34, 34, 34, 1) 100%", "gradientBlack": "rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%", - "gradientTint": "rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%", + "gradientTint": "rgba(41, 41, 41, 0) 0%, rgba(41, 41, 41, 0.05) 15%, rgba(41, 41, 41, 0.2) 30%, rgba(41, 41, 41, 0.8) 70%, rgba(41, 41, 41, 0.95) 85%, rgba(41, 41, 41, 1) 100%", "gradientWhite": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, @@ -475750,9 +475750,9 @@ exports[`shapshots vkontakteComDark theme should match pseudo theme from CssVars "fontWeightBase1": "var(--vkui--font_weight_base1, 600)", "fontWeightBase2": "var(--vkui--font_weight_base2, 500)", "fontWeightBase3": "var(--vkui--font_weight_base3, 400)", - "gradient": "var(--vkui--gradient, rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%)", + "gradient": "var(--vkui--gradient, rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 0.05) 15%, rgba(34, 34, 34, 0.2) 30%, rgba(34, 34, 34, 0.8) 70%, rgba(34, 34, 34, 0.95) 85%, rgba(34, 34, 34, 1) 100%)", "gradientBlack": "var(--vkui--gradient_black, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%)", - "gradientTint": "var(--vkui--gradient_tint, rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%)", + "gradientTint": "var(--vkui--gradient_tint, rgba(41, 41, 41, 0) 0%, rgba(41, 41, 41, 0.05) 15%, rgba(41, 41, 41, 0.2) 30%, rgba(41, 41, 41, 0.8) 70%, rgba(41, 41, 41, 0.95) 85%, rgba(41, 41, 41, 1) 100%)", "gradientWhite": "var(--vkui--gradient_white, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%)", "opacityDisable": "var(--vkui--opacity_disable, 0.4)", "opacityDisableAccessibility": "var(--vkui--opacity_disable_accessibility, 0.64)", @@ -477155,9 +477155,9 @@ exports[`shapshots vkontakteComDark theme should match root theme snapshot 1`] = "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "rgba(25, 25, 26, 0) 0%, rgba(25, 25, 26, 0.05) 15%, rgba(25, 25, 26, 0.2) 30%, rgba(25, 25, 26, 0.8) 70%, rgba(25, 25, 26, 0.95) 85%, rgba(25, 25, 26, 1) 100%", + "gradient": "rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 0.05) 15%, rgba(34, 34, 34, 0.2) 30%, rgba(34, 34, 34, 0.8) 70%, rgba(34, 34, 34, 0.95) 85%, rgba(34, 34, 34, 1) 100%", "gradientBlack": "rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.02) 15%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0.32) 70%, rgba(0, 0, 0, 0.38) 85%, rgba(0, 0, 0, 0.4) 100%", - "gradientTint": "rgba(32, 32, 33, 0) 0%, rgba(32, 32, 33, 0.05) 15%, rgba(32, 32, 33, 0.2) 30%, rgba(32, 32, 33, 0.8) 70%, rgba(32, 32, 33, 0.95) 85%, rgba(32, 32, 33, 1) 100%", + "gradientTint": "rgba(41, 41, 41, 0) 0%, rgba(41, 41, 41, 0.05) 15%, rgba(41, 41, 41, 0.2) 30%, rgba(41, 41, 41, 0.8) 70%, rgba(41, 41, 41, 0.95) 85%, rgba(41, 41, 41, 1) 100%", "gradientWhite": "rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 15%, rgba(255, 255, 255, 0.2) 30%, rgba(255, 255, 255, 0.8) 70%, rgba(255, 255, 255, 0.95) 85%, rgba(255, 255, 255, 1) 100%", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, From 38fc962575f82b98f7643e0dcf1d738b58c9da82 Mon Sep 17 00:00:00 2001 From: nick Date: Tue, 24 Sep 2024 17:07:00 +0300 Subject: [PATCH 12/36] fix(vkBase): Updated colorOverlaySecondary --- .../__snapshots__/snapthots.test.ts.snap | 528 +++++++++--------- src/themeDescriptions/base/vk.ts | 5 +- 2 files changed, 265 insertions(+), 268 deletions(-) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index b79959f27..a63fe7a10 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -58377,15 +58377,15 @@ exports[`shapshots dobro theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -61166,9 +61166,9 @@ exports[`shapshots dobro theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -62211,9 +62211,9 @@ exports[`shapshots dobro theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -63256,9 +63256,9 @@ exports[`shapshots dobro theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -64930,15 +64930,15 @@ exports[`shapshots dobroDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -67723,9 +67723,9 @@ exports[`shapshots dobroDark theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -68769,9 +68769,9 @@ exports[`shapshots dobroDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -69815,9 +69815,9 @@ exports[`shapshots dobroDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -180416,15 +180416,15 @@ exports[`shapshots octaviusVK theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPaletteBlue1": { @@ -186585,9 +186585,9 @@ exports[`shapshots octaviusVK theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPaletteBlue1": { "active": "#264CEF", @@ -188825,9 +188825,9 @@ exports[`shapshots octaviusVK theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPaletteBlue1": { "active": "var(--vkui--color_palette_blue1--active, #264CEF)", @@ -191065,9 +191065,9 @@ exports[`shapshots octaviusVK theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPaletteBlue1": { "active": "#264CEF", @@ -194114,15 +194114,15 @@ exports[`shapshots octaviusVKDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPaletteBlue1": { @@ -200283,9 +200283,9 @@ exports[`shapshots octaviusVKDark theme should match pixelify theme snapshot 1`] "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPaletteBlue1": { "active": "#3A5FFF", @@ -202523,9 +202523,9 @@ exports[`shapshots octaviusVKDark theme should match pseudo theme from CssVars 1 "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPaletteBlue1": { "active": "var(--vkui--color_palette_blue1--active, #3A5FFF)", @@ -204763,9 +204763,9 @@ exports[`shapshots octaviusVKDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPaletteBlue1": { "active": "#3A5FFF", @@ -339414,15 +339414,15 @@ exports[`shapshots tutoria theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -342723,9 +342723,9 @@ exports[`shapshots tutoria theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -343926,9 +343926,9 @@ exports[`shapshots tutoria theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -345129,9 +345129,9 @@ exports[`shapshots tutoria theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -346961,15 +346961,15 @@ exports[`shapshots tutoriaDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -350274,9 +350274,9 @@ exports[`shapshots tutoriaDark theme should match pixelify theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#689EDD", @@ -351478,9 +351478,9 @@ exports[`shapshots tutoriaDark theme should match pseudo theme from CssVars 1`] "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #689EDD)", @@ -352682,9 +352682,9 @@ exports[`shapshots tutoriaDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#689EDD", @@ -354515,15 +354515,15 @@ exports[`shapshots vkAccessibility theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -357222,9 +357222,9 @@ exports[`shapshots vkAccessibility theme should match pixelify theme snapshot 1` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -358233,9 +358233,9 @@ exports[`shapshots vkAccessibility theme should match pseudo theme from CssVars "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -359244,9 +359244,9 @@ exports[`shapshots vkAccessibility theme should match root theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -360884,15 +360884,15 @@ exports[`shapshots vkAccessibilityDark theme should match cssVars snapshot 1`] = "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -363591,9 +363591,9 @@ exports[`shapshots vkAccessibilityDark theme should match pixelify theme snapsho "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -364602,9 +364602,9 @@ exports[`shapshots vkAccessibilityDark theme should match pseudo theme from CssV "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -365613,9 +365613,9 @@ exports[`shapshots vkAccessibilityDark theme should match root theme snapshot 1` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -367253,15 +367253,15 @@ exports[`shapshots vkAccessibilityIOS theme should match cssVars snapshot 1`] = "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -369960,9 +369960,9 @@ exports[`shapshots vkAccessibilityIOS theme should match pixelify theme snapshot "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -370971,9 +370971,9 @@ exports[`shapshots vkAccessibilityIOS theme should match pseudo theme from CssVa "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -371982,9 +371982,9 @@ exports[`shapshots vkAccessibilityIOS theme should match root theme snapshot 1`] "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -373622,15 +373622,15 @@ exports[`shapshots vkAccessibilityIOSDark theme should match cssVars snapshot 1` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -376329,9 +376329,9 @@ exports[`shapshots vkAccessibilityIOSDark theme should match pixelify theme snap "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -377340,9 +377340,9 @@ exports[`shapshots vkAccessibilityIOSDark theme should match pseudo theme from C "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -378351,9 +378351,9 @@ exports[`shapshots vkAccessibilityIOSDark theme should match root theme snapshot "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -379991,15 +379991,15 @@ exports[`shapshots vkBase theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -382694,9 +382694,9 @@ exports[`shapshots vkBase theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -383704,9 +383704,9 @@ exports[`shapshots vkBase theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -384714,9 +384714,9 @@ exports[`shapshots vkBase theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -386353,15 +386353,15 @@ exports[`shapshots vkBaseDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -389060,9 +389060,9 @@ exports[`shapshots vkBaseDark theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -390071,9 +390071,9 @@ exports[`shapshots vkBaseDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -391082,9 +391082,9 @@ exports[`shapshots vkBaseDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -405460,15 +405460,15 @@ exports[`shapshots vkIOS theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -408167,9 +408167,9 @@ exports[`shapshots vkIOS theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -409178,9 +409178,9 @@ exports[`shapshots vkIOS theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -410189,9 +410189,9 @@ exports[`shapshots vkIOS theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -411829,15 +411829,15 @@ exports[`shapshots vkIOSDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -414536,9 +414536,9 @@ exports[`shapshots vkIOSDark theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -415547,9 +415547,9 @@ exports[`shapshots vkIOSDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -416558,9 +416558,9 @@ exports[`shapshots vkIOSDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -418198,15 +418198,15 @@ exports[`shapshots vkIdOk theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -420901,9 +420901,9 @@ exports[`shapshots vkIdOk theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -421911,9 +421911,9 @@ exports[`shapshots vkIdOk theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -422921,9 +422921,9 @@ exports[`shapshots vkIdOk theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -424560,15 +424560,15 @@ exports[`shapshots vkIdOkDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -427267,9 +427267,9 @@ exports[`shapshots vkIdOkDark theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -428278,9 +428278,9 @@ exports[`shapshots vkIdOkDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -429289,9 +429289,9 @@ exports[`shapshots vkIdOkDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -430929,15 +430929,15 @@ exports[`shapshots vkIdOkIOS theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -433636,9 +433636,9 @@ exports[`shapshots vkIdOkIOS theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -434647,9 +434647,9 @@ exports[`shapshots vkIdOkIOS theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -435658,9 +435658,9 @@ exports[`shapshots vkIdOkIOS theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -437298,15 +437298,15 @@ exports[`shapshots vkIdOkIOSDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -440005,9 +440005,9 @@ exports[`shapshots vkIdOkIOSDark theme should match pixelify theme snapshot 1`] "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -441016,9 +441016,9 @@ exports[`shapshots vkIdOkIOSDark theme should match pseudo theme from CssVars 1` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -442027,9 +442027,9 @@ exports[`shapshots vkIdOkIOSDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -443667,15 +443667,15 @@ exports[`shapshots vkontakteAndroid theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -447630,9 +447630,9 @@ exports[`shapshots vkontakteAndroid theme should match pixelify theme snapshot 1 "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -449051,9 +449051,9 @@ exports[`shapshots vkontakteAndroid theme should match pseudo theme from CssVars "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -450472,9 +450472,9 @@ exports[`shapshots vkontakteAndroid theme should match root theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -452522,15 +452522,15 @@ exports[`shapshots vkontakteAndroidDark theme should match cssVars snapshot 1`] "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -456485,9 +456485,9 @@ exports[`shapshots vkontakteAndroidDark theme should match pixelify theme snapsh "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -457906,9 +457906,9 @@ exports[`shapshots vkontakteAndroidDark theme should match pseudo theme from Css "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -459327,9 +459327,9 @@ exports[`shapshots vkontakteAndroidDark theme should match root theme snapshot 1 "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -478767,15 +478767,15 @@ exports[`shapshots vkontakteIOS theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -482618,9 +482618,9 @@ exports[`shapshots vkontakteIOS theme should match pixelify theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -484023,9 +484023,9 @@ exports[`shapshots vkontakteIOS theme should match pseudo theme from CssVars 1`] "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(44, 45, 46, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(44, 45, 46, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(44, 45, 46, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #237EDD)", @@ -485428,9 +485428,9 @@ exports[`shapshots vkontakteIOS theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(44, 45, 46, 0.58)", - "hover": "rgba(44, 45, 46, 0.54)", - "normal": "rgba(44, 45, 46, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#237EDD", @@ -487462,15 +487462,15 @@ exports[`shapshots vkontakteIOSDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", - "value": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", + "value": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", }, "normal": { "name": "--vkui--color_overlay_secondary", - "value": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "value": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, }, "colorPanelHeaderIcon": { @@ -491313,9 +491313,9 @@ exports[`shapshots vkontakteIOSDark theme should match pixelify theme snapshot 1 "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", @@ -492718,9 +492718,9 @@ exports[`shapshots vkontakteIOSDark theme should match pseudo theme from CssVars "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(55, 56, 57, 0.58))", - "hover": "var(--vkui--color_overlay_secondary--hover, rgba(55, 56, 57, 0.54))", - "normal": "var(--vkui--color_overlay_secondary, rgba(55, 56, 57, 0.5))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", + "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, "colorPanelHeaderIcon": { "active": "var(--vkui--color_panel_header_icon--active, #7CB1ED)", @@ -494123,9 +494123,9 @@ exports[`shapshots vkontakteIOSDark theme should match root theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(55, 56, 57, 0.58)", - "hover": "rgba(55, 56, 57, 0.54)", - "normal": "rgba(55, 56, 57, 0.5)", + "active": "rgba(0, 0, 0, 0.35000000000000003)", + "hover": "rgba(0, 0, 0, 0.31)", + "normal": "rgba(0, 0, 0, 0.27)", }, "colorPanelHeaderIcon": { "active": "#7CB1ED", diff --git a/src/themeDescriptions/base/vk.ts b/src/themeDescriptions/base/vk.ts index e5096aa50..f8443fc3a 100644 --- a/src/themeDescriptions/base/vk.ts +++ b/src/themeDescriptions/base/vk.ts @@ -222,10 +222,7 @@ export const colorFromFigma = (colorsScheme: 'light' | 'dark'): ColorsDescriptio // Other colorOverlayPrimary: other.overlay_primary, - colorOverlaySecondary: { - light: 'rgba(44, 45, 46, 0.5)', - dark: 'rgba(55, 56, 57, 0.5)', - }[colorsScheme], + colorOverlaySecondary: 'rgba(0, 0, 0, 0.27)', colorAvatarOverlay: other.avatar_overlay_alpha, colorAvatarOverlayInverseAlpha: other.avatar_overlay_inverse_alpha, colorActionSheetText: other.action_sheet_text, From 4624626b6feaf3d842f9164769c814fd5bede8de Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 24 Sep 2024 18:30:34 +0300 Subject: [PATCH 13/36] feat/tokenized-gradients: fix gradient token helper --- .../helpers/getGradientPointsFromColor.ts | 4 +- src/build/helpers/tokenHelpers.test.ts | 45 ++++++++++++++++--- src/build/helpers/tokenHelpers.ts | 32 +++++++------ 3 files changed, 61 insertions(+), 20 deletions(-) diff --git a/src/build/helpers/getGradientPointsFromColor.ts b/src/build/helpers/getGradientPointsFromColor.ts index cf3ad10d1..1ab86ff75 100644 --- a/src/build/helpers/getGradientPointsFromColor.ts +++ b/src/build/helpers/getGradientPointsFromColor.ts @@ -41,12 +41,12 @@ export function getGradientPointsFromColor( ): GradientPoints { const gradientPointData = typeof colorArg === 'function' ? colorArg() : { value: colorArg }; - const colorRGB: string = color(gradientPointData.value).rgb().array().join(', '); + const colorRGB: string = color(gradientPointData.value).rgb().array().slice(0, 3).join(', '); const colorAlpha = color(gradientPointData.value).alpha(); return opacityPoints .map(([pointOpacity, pointCoordinate]) => { - const targetOpacity = colorAlpha < 1 ? colorAlpha : pointOpacity; + const targetOpacity = colorAlpha * pointOpacity; const colorValue = `rgba(${colorRGB}, ${Math.round(targetOpacity * opacityMultiplier * 1000) / 1000})`; if (typeof gradientPointData.key === 'string') { diff --git a/src/build/helpers/tokenHelpers.test.ts b/src/build/helpers/tokenHelpers.test.ts index 07e41a9f7..68b290175 100644 --- a/src/build/helpers/tokenHelpers.test.ts +++ b/src/build/helpers/tokenHelpers.test.ts @@ -35,18 +35,53 @@ describe('tokenHelpers', () => { }); describe('gradient', () => { - test('calculates gradient string', () => { + test('calculates gradient string from 1 color with variable', () => { + const gradientToken = gradient(['blue']); + const gradientValue = gradientToken({}); + + expect(gradientValue).toEqual( + [ + 'rgba(0, 0, 255, 0) 0%', + 'rgba(0, 0, 255, 0.05) 15%', + 'rgba(0, 0, 255, 0.2) 30%', + 'rgba(0, 0, 255, 0.8) 70%', + 'rgba(0, 0, 255, 0.95) 85%', + 'rgba(0, 0, 255, 1) 100%', + ].join(', '), + ); + }); + + test('calculates gradient string from 1 color with variable', () => { + const gradientToken = gradient([namedAlias('colorIconPrimary')]); + const gradientValue = gradientToken({ colors: { colorIconPrimary: 'blue' } as any }); + + expect(gradientValue).toEqual( + [ + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0)) 0%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0.05)) 15%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0.2)) 30%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0.8)) 70%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0.95)) 85%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 1)) 100%', + ].join(', '), + ); + }); + + test('calculates gradient string from 2 colors', () => { const gradientToken = gradient([namedAlias('colorIconPrimary'), 'transparent']); const gradientValue = gradientToken({ colors: { colorIconPrimary: 'blue' } as any }); expect(gradientValue).toEqual( - 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 1)) 0%, rgba(0, 0, 0, 0, 0) 100%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 1)) 0%, rgba(0, 0, 0, 0) 100%', ); }); - test('fails if bad number of arguments is given', () => { - expect(() => gradient([namedAlias('colorIconPrimary')])).toThrowError( - 'Gradient stops length (1) is not equal to the number of opacity points given (2)', + test('calculates gradient string from 3 colors', () => { + const gradientToken = gradient(['blue', 'black', 'red']); + const gradientValue = gradientToken({}); + + expect(gradientValue).toEqual( + 'rgba(0, 0, 255, 1) 0%, rgba(0, 0, 0, 1) 50%, rgba(255, 0, 0, 1) 100%', ); }); }); diff --git a/src/build/helpers/tokenHelpers.ts b/src/build/helpers/tokenHelpers.ts index f56cd61e8..15f59d6ba 100644 --- a/src/build/helpers/tokenHelpers.ts +++ b/src/build/helpers/tokenHelpers.ts @@ -3,7 +3,12 @@ import type { Property } from 'csstype'; import { ThemeDescription } from '@/interfaces/general'; import { Token } from '@/interfaces/general/tools/tokenValue'; -import { getGradientPointsFromColor, makeGradientPointRaw } from './getGradientPointsFromColor'; +import { + defaultOpacityPoints, + getGradientPointsFromColor, + makeGradientPointRaw, + OpacityPoints, +} from './getGradientPointsFromColor'; export type TokenFunction = (theme: Partial) => Token; export type NamedTokenFunction = ( @@ -32,25 +37,26 @@ export function staticRef(value: Token): T { return value; } +function makeOpacityPoints(count: number): OpacityPoints { + const result: OpacityPoints = []; + + for (let i = 0; i < count; i++) { + const percent = Math.round(i * (1 / (count - 1)) * 100); + result.push([1, percent]); + } + + return result; +} + export function gradient( stops: (Property.Color | NamedTokenFunction)[], - opacityPoints: OpacityPoint[] = [ - [1, 0], - [1, 100], - ], ): TokenFunction { - if (stops.length !== opacityPoints.length) { - throw new Error( - `Gradient stops length (${ - stops.length - }) is not equal to the number of opacity points given (${opacityPoints.length})`, - ); - } + const opacityPoints = stops.length > 1 ? makeOpacityPoints(stops.length) : defaultOpacityPoints; return (theme) => { return opacityPoints .map(([pointOpacity, pointCoordinate], index) => { - const stop = stops[index]; + const stop = stops[index] ?? stops[stops.length - 1]; const [stopKey, stopValue] = typeof stop === 'function' ? stop(theme) : [undefined, stop]; const pointRaw = makeGradientPointRaw(stopValue, stopKey); From 97730381b3a0b91513fdfd0751ecad295e59e43a Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 24 Sep 2024 19:20:58 +0300 Subject: [PATCH 14/36] feat/tokenized-gradients: fix tokens in vkontakteAndroid theme --- src/build/helpers/tokenHelpers.test.ts | 8 +++--- src/build/helpers/tokenHelpers.ts | 2 +- .../extractGeneralTokens.ts | 10 ++++++- src/interfaces/general/gradients/index.ts | 3 ++- .../themes/vkontakteAndroid/index.ts | 27 ++++++++++++++----- 5 files changed, 36 insertions(+), 14 deletions(-) diff --git a/src/build/helpers/tokenHelpers.test.ts b/src/build/helpers/tokenHelpers.test.ts index 68b290175..7c7e53f50 100644 --- a/src/build/helpers/tokenHelpers.test.ts +++ b/src/build/helpers/tokenHelpers.test.ts @@ -36,7 +36,7 @@ describe('tokenHelpers', () => { describe('gradient', () => { test('calculates gradient string from 1 color with variable', () => { - const gradientToken = gradient(['blue']); + const gradientToken = gradient('blue'); const gradientValue = gradientToken({}); expect(gradientValue).toEqual( @@ -52,7 +52,7 @@ describe('tokenHelpers', () => { }); test('calculates gradient string from 1 color with variable', () => { - const gradientToken = gradient([namedAlias('colorIconPrimary')]); + const gradientToken = gradient(namedAlias('colorIconPrimary')); const gradientValue = gradientToken({ colors: { colorIconPrimary: 'blue' } as any }); expect(gradientValue).toEqual( @@ -68,7 +68,7 @@ describe('tokenHelpers', () => { }); test('calculates gradient string from 2 colors', () => { - const gradientToken = gradient([namedAlias('colorIconPrimary'), 'transparent']); + const gradientToken = gradient(namedAlias('colorIconPrimary'), 'transparent'); const gradientValue = gradientToken({ colors: { colorIconPrimary: 'blue' } as any }); expect(gradientValue).toEqual( @@ -77,7 +77,7 @@ describe('tokenHelpers', () => { }); test('calculates gradient string from 3 colors', () => { - const gradientToken = gradient(['blue', 'black', 'red']); + const gradientToken = gradient('blue', 'black', 'red'); const gradientValue = gradientToken({}); expect(gradientValue).toEqual( diff --git a/src/build/helpers/tokenHelpers.ts b/src/build/helpers/tokenHelpers.ts index 15f59d6ba..81a9a4623 100644 --- a/src/build/helpers/tokenHelpers.ts +++ b/src/build/helpers/tokenHelpers.ts @@ -49,7 +49,7 @@ function makeOpacityPoints(count: number): OpacityPoints { } export function gradient( - stops: (Property.Color | NamedTokenFunction)[], + ...stops: (Property.Color | NamedTokenFunction)[] ): TokenFunction { const opacityPoints = stops.length > 1 ? makeOpacityPoints(stops.length) : defaultOpacityPoints; diff --git a/src/build/themeProcessors/extractGeneralTokens/extractGeneralTokens.ts b/src/build/themeProcessors/extractGeneralTokens/extractGeneralTokens.ts index 112ceba0c..122ca2422 100644 --- a/src/build/themeProcessors/extractGeneralTokens/extractGeneralTokens.ts +++ b/src/build/themeProcessors/extractGeneralTokens/extractGeneralTokens.ts @@ -18,7 +18,15 @@ export function extractGeneralTokens( const tokenValue = themeDescription[token]; if (typeof tokenValue === 'function') { - copyDescription[token] = tokenValue(themeDescription); + copyDescription[token] = tokenValue; + } + } + + for (const token of tokens) { + const tokenValue = copyDescription[token]; + + if (typeof tokenValue === 'function') { + copyDescription[token] = tokenValue(copyDescription); } } diff --git a/src/interfaces/general/gradients/index.ts b/src/interfaces/general/gradients/index.ts index f694ff31d..611f9335d 100644 --- a/src/interfaces/general/gradients/index.ts +++ b/src/interfaces/general/gradients/index.ts @@ -1,4 +1,5 @@ -export type GradientPoints = string; +// TODO: Нормальный тип вместо unknown (поправить Type instantiation is excessively deep and possibly infinite) +export type GradientPoints = string | unknown; export interface Gradients { /** diff --git a/src/themeDescriptions/themes/vkontakteAndroid/index.ts b/src/themeDescriptions/themes/vkontakteAndroid/index.ts index 258ccf40c..b09b2f275 100644 --- a/src/themeDescriptions/themes/vkontakteAndroid/index.ts +++ b/src/themeDescriptions/themes/vkontakteAndroid/index.ts @@ -10,6 +10,7 @@ import type { import type { ThemeVkontakteAndroidDarkDescription } from '@/interfaces/themes/vkontakteAndroidDark'; import { darkTheme as vkDarkTheme, fonts, lightTheme as vkLightTheme } from '../../base/vk'; +import { gradient, namedAlias } from '@/build/helpers/tokenHelpers'; const themeNameBase = 'vkontakteAndroid'; @@ -224,7 +225,19 @@ export const vkontakteLocalColorDark: LocalVkontakteAndroidColorsDescriptionStru const fontFamilyAccent = '"VK Sans Display", -apple-system, system-ui, "Helvetica Neue", Roboto, sans-serif'; -const colorGradients: VkontakteAndroidGradients = { +function makeFunctionalGradients(source: T): T { + const keys = Object.keys(source); + const result: T = {} as any; + + for (const key of keys) { + const colors = source[key].split(', '); + result[key] = gradient(...colors); + } + + return result; +} + +const colorGradients: VkontakteAndroidGradients = makeFunctionalGradients({ vkontakteGradientAquamarineBlue: '#7DF1FA, #2BB4D6', vkontakteGradientBlue: '#66CCFF, #3F8AE0', vkontakteGradientCandy: '#FF99CC, #E52E6A', @@ -259,14 +272,14 @@ const colorGradients: VkontakteAndroidGradients = { vkontakteGradientSberkot: '#9DF19D, #31C2A7, #21A19A, #107F8C', vkontakteGradientMable: '#D9F4FF, #D9F4FF', vkontakteGradientWomensDay: '#FF99CC, #E52E6A', -}; +}); const gradients: Gradients = { - gradient: 'colorBackgroundContent, transparent', - gradientTint: 'colorBackgroundTertiary, transparent', - gradientWhite: '#FFFFFF, transparent', - gradientBlack: '#00000060, transparent', -}; + gradient: gradient(namedAlias('colorBackgroundContent'), 'transparent'), + gradientTint: gradient(namedAlias('colorBackgroundTertiary'), 'transparent'), + gradientWhite: gradient('#FFFFFF', 'transparent'), + gradientBlack: gradient('#00000060', 'transparent'), +} export const vkontakteDisplayTitleFontsPartial: DeepPartial = { fontDisplayTitle1: { From 63e464fa01b395076e67e3bd74c3904d522e8cbe Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 24 Sep 2024 19:21:16 +0300 Subject: [PATCH 15/36] feat/tokenized-gradients: fix linter --- src/themeDescriptions/themes/vkontakteAndroid/index.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/themeDescriptions/themes/vkontakteAndroid/index.ts b/src/themeDescriptions/themes/vkontakteAndroid/index.ts index b09b2f275..757153aa6 100644 --- a/src/themeDescriptions/themes/vkontakteAndroid/index.ts +++ b/src/themeDescriptions/themes/vkontakteAndroid/index.ts @@ -1,5 +1,6 @@ import lodash from 'lodash'; +import { gradient, namedAlias } from '@/build/helpers/tokenHelpers'; import { Gradients } from '@/interfaces/general/gradients'; import { DeepPartial } from '@/interfaces/general/tools/utils'; import type { @@ -10,7 +11,6 @@ import type { import type { ThemeVkontakteAndroidDarkDescription } from '@/interfaces/themes/vkontakteAndroidDark'; import { darkTheme as vkDarkTheme, fonts, lightTheme as vkLightTheme } from '../../base/vk'; -import { gradient, namedAlias } from '@/build/helpers/tokenHelpers'; const themeNameBase = 'vkontakteAndroid'; @@ -279,7 +279,7 @@ const gradients: Gradients = { gradientTint: gradient(namedAlias('colorBackgroundTertiary'), 'transparent'), gradientWhite: gradient('#FFFFFF', 'transparent'), gradientBlack: gradient('#00000060', 'transparent'), -} +}; export const vkontakteDisplayTitleFontsPartial: DeepPartial = { fontDisplayTitle1: { From 334e5afbc26018c6af962d403d21638e048c70ee Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 24 Sep 2024 19:22:59 +0300 Subject: [PATCH 16/36] feat/tokenized-gradients: update snapshots --- .../__snapshots__/snapthots.test.ts.snap | 1696 ++++++++--------- 1 file changed, 848 insertions(+), 848 deletions(-) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index 4f38fe9ae..0b16b21b7 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -442628,19 +442628,19 @@ exports[`shapshots vkontakteAndroid theme should match cssVars snapshot 1`] = ` }, "gradient": { "name": "--vkui--gradient", - "value": "var(--vkui--gradient, colorBackgroundContent, transparent)", + "value": "var(--vkui--gradient, var(--vkui--color_background_content, rgba(255, 255, 255, 1)) 0%, rgba(0, 0, 0, 0) 100%)", }, "gradientBlack": { "name": "--vkui--gradient_black", - "value": "var(--vkui--gradient_black, #00000060, transparent)", + "value": "var(--vkui--gradient_black, rgba(0, 0, 0, 0.376) 0%, rgba(0, 0, 0, 0) 100%)", }, "gradientTint": { "name": "--vkui--gradient_tint", - "value": "var(--vkui--gradient_tint, colorBackgroundTertiary, transparent)", + "value": "var(--vkui--gradient_tint, var(--vkui--color_background_tertiary, rgba(249, 249, 249, 1)) 0%, rgba(0, 0, 0, 0) 100%)", }, "gradientWhite": { "name": "--vkui--gradient_white", - "value": "var(--vkui--gradient_white, #FFFFFF, transparent)", + "value": "var(--vkui--gradient_white, rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 100%)", }, "opacityDisable": { "name": "--vkui--opacity_disable", @@ -444231,139 +444231,139 @@ exports[`shapshots vkontakteAndroid theme should match cssVars snapshot 1`] = ` }, "vkontakteGradientAquamarineBlue": { "name": "--vkui--vkontakte_gradient_aquamarine_blue", - "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", + "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", }, "vkontakteGradientBlue": { "name": "--vkui--vkontakte_gradient_blue", - "value": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", + "value": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", }, "vkontakteGradientCandy": { "name": "--vkui--vkontakte_gradient_candy", - "value": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientCrimson": { "name": "--vkui--vkontakte_gradient_crimson", - "value": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", + "value": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", }, "vkontakteGradientDisco": { "name": "--vkui--vkontakte_gradient_disco", - "value": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", + "value": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", }, "vkontakteGradientEmerald": { "name": "--vkui--vkontakte_gradient_emerald", - "value": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", + "value": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", }, "vkontakteGradientFrost": { "name": "--vkui--vkontakte_gradient_frost", - "value": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", + "value": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", }, "vkontakteGradientGray": { "name": "--vkui--vkontakte_gradient_gray", - "value": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", + "value": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", }, "vkontakteGradientGreen": { "name": "--vkui--vkontakte_gradient_green", - "value": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", + "value": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", }, "vkontakteGradientHalloweenOrange": { "name": "--vkui--vkontakte_gradient_halloween_orange", - "value": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", + "value": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", }, "vkontakteGradientHalloweenViolet": { "name": "--vkui--vkontakte_gradient_halloween_violet", - "value": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", + "value": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", }, "vkontakteGradientLagoon": { "name": "--vkui--vkontakte_gradient_lagoon", - "value": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", + "value": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", }, "vkontakteGradientLavender": { "name": "--vkui--vkontakte_gradient_lavender", - "value": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", + "value": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", }, "vkontakteGradientMable": { "name": "--vkui--vkontakte_gradient_mable", - "value": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", + "value": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", }, "vkontakteGradientMarine": { "name": "--vkui--vkontakte_gradient_marine", - "value": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", + "value": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", }, "vkontakteGradientMidnight": { "name": "--vkui--vkontakte_gradient_midnight", - "value": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", + "value": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", }, "vkontakteGradientNewYear": { "name": "--vkui--vkontakte_gradient_new_year", - "value": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", + "value": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", }, "vkontakteGradientOrange": { "name": "--vkui--vkontakte_gradient_orange", - "value": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", + "value": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", }, "vkontakteGradientPink": { "name": "--vkui--vkontakte_gradient_pink", - "value": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientPurple": { "name": "--vkui--vkontakte_gradient_purple", - "value": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", + "value": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", }, "vkontakteGradientRaspberryPink": { "name": "--vkui--vkontakte_gradient_raspberry_pink", - "value": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", + "value": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", }, "vkontakteGradientRed": { "name": "--vkui--vkontakte_gradient_red", - "value": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", + "value": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", }, "vkontakteGradientRetrowave": { "name": "--vkui--vkontakte_gradient_retrowave", - "value": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", + "value": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", }, "vkontakteGradientSberkot": { "name": "--vkui--vkontakte_gradient_sberkot", - "value": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", + "value": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", }, "vkontakteGradientSunset": { "name": "--vkui--vkontakte_gradient_sunset", - "value": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientTurquoise": { "name": "--vkui--vkontakte_gradient_turquoise", - "value": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", + "value": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", }, "vkontakteGradientTwilight": { "name": "--vkui--vkontakte_gradient_twilight", - "value": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", + "value": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", }, "vkontakteGradientUnicorn": { "name": "--vkui--vkontakte_gradient_unicorn", - "value": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", + "value": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", }, "vkontakteGradientValentine": { "name": "--vkui--vkontakte_gradient_valentine", - "value": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", + "value": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", }, "vkontakteGradientViolet": { "name": "--vkui--vkontakte_gradient_violet", - "value": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", + "value": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", }, "vkontakteGradientWarmValentine": { "name": "--vkui--vkontakte_gradient_warm_valentine", - "value": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", + "value": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", }, "vkontakteGradientWomensDay": { "name": "--vkui--vkontakte_gradient_womens_day", - "value": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientYellow": { "name": "--vkui--vkontakte_gradient_yellow", - "value": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", + "value": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", }, "vkontakteGradientYellowBright": { "name": "--vkui--vkontakte_gradient_yellow_bright", - "value": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "value": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", }, "vkontakteImAttachTint": { "active": { @@ -445362,10 +445362,10 @@ exports[`shapshots vkontakteAndroid theme should match pixelify theme snapshot 1 "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "colorBackgroundContent, transparent", - "gradientBlack": "#00000060, transparent", - "gradientTint": "colorBackgroundTertiary, transparent", - "gradientWhite": "#FFFFFF, transparent", + "gradient": "var(--vkui--color_background_content, rgba(255, 255, 255, 1)) 0%, rgba(0, 0, 0, 0) 100%", + "gradientBlack": "rgba(0, 0, 0, 0.376) 0%, rgba(0, 0, 0, 0) 100%", + "gradientTint": "var(--vkui--color_background_tertiary, rgba(249, 249, 249, 1)) 0%, rgba(0, 0, 0, 0) 100%", + "gradientWhite": "rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 100%", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, "sizeArrow": { @@ -445883,40 +445883,40 @@ exports[`shapshots vkontakteAndroid theme should match pixelify theme snapshot 1 "hover": "#939CA9", "normal": "#99a2ad", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#2978D3", "hover": "#2B7CD9", @@ -446773,10 +446773,10 @@ exports[`shapshots vkontakteAndroid theme should match pseudo theme from CssVars "fontWeightBase1": "var(--vkui--font_weight_base1, 600)", "fontWeightBase2": "var(--vkui--font_weight_base2, 500)", "fontWeightBase3": "var(--vkui--font_weight_base3, 400)", - "gradient": "var(--vkui--gradient, colorBackgroundContent, transparent)", - "gradientBlack": "var(--vkui--gradient_black, #00000060, transparent)", - "gradientTint": "var(--vkui--gradient_tint, colorBackgroundTertiary, transparent)", - "gradientWhite": "var(--vkui--gradient_white, #FFFFFF, transparent)", + "gradient": "var(--vkui--gradient, var(--vkui--color_background_content, rgba(255, 255, 255, 1)) 0%, rgba(0, 0, 0, 0) 100%)", + "gradientBlack": "var(--vkui--gradient_black, rgba(0, 0, 0, 0.376) 0%, rgba(0, 0, 0, 0) 100%)", + "gradientTint": "var(--vkui--gradient_tint, var(--vkui--color_background_tertiary, rgba(249, 249, 249, 1)) 0%, rgba(0, 0, 0, 0) 100%)", + "gradientWhite": "var(--vkui--gradient_white, rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 100%)", "opacityDisable": "var(--vkui--opacity_disable, 0.4)", "opacityDisableAccessibility": "var(--vkui--opacity_disable_accessibility, 0.64)", "sizeArrow": { @@ -447294,40 +447294,40 @@ exports[`shapshots vkontakteAndroid theme should match pseudo theme from CssVars "hover": "var(--vkui--vkontakte_float_button_foreground--hover, #939CA9)", "normal": "var(--vkui--vkontakte_float_button_foreground, #99a2ad)", }, - "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", - "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", - "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", - "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", - "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", - "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", - "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", - "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", - "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", - "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", - "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", - "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", - "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", - "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", - "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", - "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", - "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", - "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", - "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", - "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", - "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", - "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", - "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", - "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", - "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", - "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", - "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", - "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", - "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", - "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", - "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", - "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", - "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", - "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", + "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", + "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", + "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", + "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", + "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", + "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", + "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", + "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", + "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", + "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", + "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", + "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", + "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", + "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", + "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", + "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", + "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", + "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", + "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", + "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", + "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", + "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", + "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", + "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", + "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", + "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", + "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", + "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", + "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", "vkontakteImAttachTint": { "active": "var(--vkui--vkontakte_im_attach_tint--active, #2978D3)", "hover": "var(--vkui--vkontakte_im_attach_tint--hover, #2B7CD9)", @@ -448184,10 +448184,10 @@ exports[`shapshots vkontakteAndroid theme should match root theme snapshot 1`] = "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "colorBackgroundContent, transparent", - "gradientBlack": "#00000060, transparent", - "gradientTint": "colorBackgroundTertiary, transparent", - "gradientWhite": "#FFFFFF, transparent", + "gradient": "var(--vkui--color_background_content, rgba(255, 255, 255, 1)) 0%, rgba(0, 0, 0, 0) 100%", + "gradientBlack": "rgba(0, 0, 0, 0.376) 0%, rgba(0, 0, 0, 0) 100%", + "gradientTint": "var(--vkui--color_background_tertiary, rgba(249, 249, 249, 1)) 0%, rgba(0, 0, 0, 0) 100%", + "gradientWhite": "rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 100%", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, "sizeArrow": { @@ -448705,40 +448705,40 @@ exports[`shapshots vkontakteAndroid theme should match root theme snapshot 1`] = "hover": "#939CA9", "normal": "#99a2ad", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#2978D3", "hover": "#2B7CD9", @@ -451425,19 +451425,19 @@ exports[`shapshots vkontakteAndroidDark theme should match cssVars snapshot 1`] }, "gradient": { "name": "--vkui--gradient", - "value": "var(--vkui--gradient, colorBackgroundContent, transparent)", + "value": "var(--vkui--gradient, var(--vkui--color_background_content, rgba(25, 25, 26, 1)) 0%, rgba(0, 0, 0, 0) 100%)", }, "gradientBlack": { "name": "--vkui--gradient_black", - "value": "var(--vkui--gradient_black, #00000060, transparent)", + "value": "var(--vkui--gradient_black, rgba(0, 0, 0, 0.376) 0%, rgba(0, 0, 0, 0) 100%)", }, "gradientTint": { "name": "--vkui--gradient_tint", - "value": "var(--vkui--gradient_tint, colorBackgroundTertiary, transparent)", + "value": "var(--vkui--gradient_tint, var(--vkui--color_background_tertiary, rgba(32, 32, 33, 1)) 0%, rgba(0, 0, 0, 0) 100%)", }, "gradientWhite": { "name": "--vkui--gradient_white", - "value": "var(--vkui--gradient_white, #FFFFFF, transparent)", + "value": "var(--vkui--gradient_white, rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 100%)", }, "opacityDisable": { "name": "--vkui--opacity_disable", @@ -453028,139 +453028,139 @@ exports[`shapshots vkontakteAndroidDark theme should match cssVars snapshot 1`] }, "vkontakteGradientAquamarineBlue": { "name": "--vkui--vkontakte_gradient_aquamarine_blue", - "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", + "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", }, "vkontakteGradientBlue": { "name": "--vkui--vkontakte_gradient_blue", - "value": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", + "value": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", }, "vkontakteGradientCandy": { "name": "--vkui--vkontakte_gradient_candy", - "value": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientCrimson": { "name": "--vkui--vkontakte_gradient_crimson", - "value": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", + "value": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", }, "vkontakteGradientDisco": { "name": "--vkui--vkontakte_gradient_disco", - "value": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", + "value": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", }, "vkontakteGradientEmerald": { "name": "--vkui--vkontakte_gradient_emerald", - "value": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", + "value": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", }, "vkontakteGradientFrost": { "name": "--vkui--vkontakte_gradient_frost", - "value": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", + "value": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", }, "vkontakteGradientGray": { "name": "--vkui--vkontakte_gradient_gray", - "value": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", + "value": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", }, "vkontakteGradientGreen": { "name": "--vkui--vkontakte_gradient_green", - "value": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", + "value": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", }, "vkontakteGradientHalloweenOrange": { "name": "--vkui--vkontakte_gradient_halloween_orange", - "value": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", + "value": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", }, "vkontakteGradientHalloweenViolet": { "name": "--vkui--vkontakte_gradient_halloween_violet", - "value": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", + "value": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", }, "vkontakteGradientLagoon": { "name": "--vkui--vkontakte_gradient_lagoon", - "value": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", + "value": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", }, "vkontakteGradientLavender": { "name": "--vkui--vkontakte_gradient_lavender", - "value": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", + "value": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", }, "vkontakteGradientMable": { "name": "--vkui--vkontakte_gradient_mable", - "value": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", + "value": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", }, "vkontakteGradientMarine": { "name": "--vkui--vkontakte_gradient_marine", - "value": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", + "value": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", }, "vkontakteGradientMidnight": { "name": "--vkui--vkontakte_gradient_midnight", - "value": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", + "value": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", }, "vkontakteGradientNewYear": { "name": "--vkui--vkontakte_gradient_new_year", - "value": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", + "value": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", }, "vkontakteGradientOrange": { "name": "--vkui--vkontakte_gradient_orange", - "value": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", + "value": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", }, "vkontakteGradientPink": { "name": "--vkui--vkontakte_gradient_pink", - "value": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientPurple": { "name": "--vkui--vkontakte_gradient_purple", - "value": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", + "value": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", }, "vkontakteGradientRaspberryPink": { "name": "--vkui--vkontakte_gradient_raspberry_pink", - "value": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", + "value": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", }, "vkontakteGradientRed": { "name": "--vkui--vkontakte_gradient_red", - "value": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", + "value": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", }, "vkontakteGradientRetrowave": { "name": "--vkui--vkontakte_gradient_retrowave", - "value": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", + "value": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", }, "vkontakteGradientSberkot": { "name": "--vkui--vkontakte_gradient_sberkot", - "value": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", + "value": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", }, "vkontakteGradientSunset": { "name": "--vkui--vkontakte_gradient_sunset", - "value": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientTurquoise": { "name": "--vkui--vkontakte_gradient_turquoise", - "value": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", + "value": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", }, "vkontakteGradientTwilight": { "name": "--vkui--vkontakte_gradient_twilight", - "value": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", + "value": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", }, "vkontakteGradientUnicorn": { "name": "--vkui--vkontakte_gradient_unicorn", - "value": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", + "value": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", }, "vkontakteGradientValentine": { "name": "--vkui--vkontakte_gradient_valentine", - "value": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", + "value": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", }, "vkontakteGradientViolet": { "name": "--vkui--vkontakte_gradient_violet", - "value": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", + "value": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", }, "vkontakteGradientWarmValentine": { "name": "--vkui--vkontakte_gradient_warm_valentine", - "value": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", + "value": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", }, "vkontakteGradientWomensDay": { "name": "--vkui--vkontakte_gradient_womens_day", - "value": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientYellow": { "name": "--vkui--vkontakte_gradient_yellow", - "value": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", + "value": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", }, "vkontakteGradientYellowBright": { "name": "--vkui--vkontakte_gradient_yellow_bright", - "value": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "value": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", }, "vkontakteImAttachTint": { "active": { @@ -454159,10 +454159,10 @@ exports[`shapshots vkontakteAndroidDark theme should match pixelify theme snapsh "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "colorBackgroundContent, transparent", - "gradientBlack": "#00000060, transparent", - "gradientTint": "colorBackgroundTertiary, transparent", - "gradientWhite": "#FFFFFF, transparent", + "gradient": "var(--vkui--color_background_content, rgba(25, 25, 26, 1)) 0%, rgba(0, 0, 0, 0) 100%", + "gradientBlack": "rgba(0, 0, 0, 0.376) 0%, rgba(0, 0, 0, 0) 100%", + "gradientTint": "var(--vkui--color_background_tertiary, rgba(32, 32, 33, 1)) 0%, rgba(0, 0, 0, 0) 100%", + "gradientWhite": "rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 100%", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, "sizeArrow": { @@ -454680,40 +454680,40 @@ exports[`shapshots vkontakteAndroidDark theme should match pixelify theme snapsh "hover": "#ADB1B6", "normal": "#aaaeb3", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -455570,10 +455570,10 @@ exports[`shapshots vkontakteAndroidDark theme should match pseudo theme from Css "fontWeightBase1": "var(--vkui--font_weight_base1, 600)", "fontWeightBase2": "var(--vkui--font_weight_base2, 500)", "fontWeightBase3": "var(--vkui--font_weight_base3, 400)", - "gradient": "var(--vkui--gradient, colorBackgroundContent, transparent)", - "gradientBlack": "var(--vkui--gradient_black, #00000060, transparent)", - "gradientTint": "var(--vkui--gradient_tint, colorBackgroundTertiary, transparent)", - "gradientWhite": "var(--vkui--gradient_white, #FFFFFF, transparent)", + "gradient": "var(--vkui--gradient, var(--vkui--color_background_content, rgba(25, 25, 26, 1)) 0%, rgba(0, 0, 0, 0) 100%)", + "gradientBlack": "var(--vkui--gradient_black, rgba(0, 0, 0, 0.376) 0%, rgba(0, 0, 0, 0) 100%)", + "gradientTint": "var(--vkui--gradient_tint, var(--vkui--color_background_tertiary, rgba(32, 32, 33, 1)) 0%, rgba(0, 0, 0, 0) 100%)", + "gradientWhite": "var(--vkui--gradient_white, rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 100%)", "opacityDisable": "var(--vkui--opacity_disable, 0.4)", "opacityDisableAccessibility": "var(--vkui--opacity_disable_accessibility, 0.64)", "sizeArrow": { @@ -456091,40 +456091,40 @@ exports[`shapshots vkontakteAndroidDark theme should match pseudo theme from Css "hover": "var(--vkui--vkontakte_float_button_foreground--hover, #ADB1B6)", "normal": "var(--vkui--vkontakte_float_button_foreground, #aaaeb3)", }, - "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", - "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", - "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", - "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", - "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", - "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", - "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", - "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", - "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", - "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", - "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", - "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", - "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", - "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", - "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", - "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", - "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", - "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", - "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", - "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", - "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", - "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", - "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", - "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", - "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", - "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", - "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", - "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", - "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", - "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", - "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", - "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", - "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", - "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", + "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", + "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", + "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", + "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", + "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", + "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", + "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", + "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", + "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", + "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", + "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", + "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", + "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", + "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", + "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", + "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", + "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", + "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", + "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", + "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", + "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", + "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", + "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", + "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", + "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", + "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", + "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", + "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", + "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", "vkontakteImAttachTint": { "active": "var(--vkui--vkontakte_im_attach_tint--active, #D7D8DB)", "hover": "var(--vkui--vkontakte_im_attach_tint--hover, #EBEDF0)", @@ -456981,10 +456981,10 @@ exports[`shapshots vkontakteAndroidDark theme should match root theme snapshot 1 "fontWeightBase1": 600, "fontWeightBase2": 500, "fontWeightBase3": 400, - "gradient": "colorBackgroundContent, transparent", - "gradientBlack": "#00000060, transparent", - "gradientTint": "colorBackgroundTertiary, transparent", - "gradientWhite": "#FFFFFF, transparent", + "gradient": "var(--vkui--color_background_content, rgba(25, 25, 26, 1)) 0%, rgba(0, 0, 0, 0) 100%", + "gradientBlack": "rgba(0, 0, 0, 0.376) 0%, rgba(0, 0, 0, 0) 100%", + "gradientTint": "var(--vkui--color_background_tertiary, rgba(32, 32, 33, 1)) 0%, rgba(0, 0, 0, 0) 100%", + "gradientWhite": "rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 100%", "opacityDisable": 0.4, "opacityDisableAccessibility": 0.64, "sizeArrow": { @@ -457502,40 +457502,40 @@ exports[`shapshots vkontakteAndroidDark theme should match root theme snapshot 1 "hover": "#ADB1B6", "normal": "#aaaeb3", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -461713,139 +461713,139 @@ exports[`shapshots vkontakteCom theme should match cssVars snapshot 1`] = ` }, "vkontakteGradientAquamarineBlue": { "name": "--vkui--vkontakte_gradient_aquamarine_blue", - "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", + "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", }, "vkontakteGradientBlue": { "name": "--vkui--vkontakte_gradient_blue", - "value": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", + "value": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", }, "vkontakteGradientCandy": { "name": "--vkui--vkontakte_gradient_candy", - "value": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientCrimson": { "name": "--vkui--vkontakte_gradient_crimson", - "value": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", + "value": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", }, "vkontakteGradientDisco": { "name": "--vkui--vkontakte_gradient_disco", - "value": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", + "value": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", }, "vkontakteGradientEmerald": { "name": "--vkui--vkontakte_gradient_emerald", - "value": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", + "value": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", }, "vkontakteGradientFrost": { "name": "--vkui--vkontakte_gradient_frost", - "value": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", + "value": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", }, "vkontakteGradientGray": { "name": "--vkui--vkontakte_gradient_gray", - "value": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", + "value": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", }, "vkontakteGradientGreen": { "name": "--vkui--vkontakte_gradient_green", - "value": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", + "value": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", }, "vkontakteGradientHalloweenOrange": { "name": "--vkui--vkontakte_gradient_halloween_orange", - "value": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", + "value": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", }, "vkontakteGradientHalloweenViolet": { "name": "--vkui--vkontakte_gradient_halloween_violet", - "value": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", + "value": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", }, "vkontakteGradientLagoon": { "name": "--vkui--vkontakte_gradient_lagoon", - "value": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", + "value": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", }, "vkontakteGradientLavender": { "name": "--vkui--vkontakte_gradient_lavender", - "value": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", + "value": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", }, "vkontakteGradientMable": { "name": "--vkui--vkontakte_gradient_mable", - "value": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", + "value": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", }, "vkontakteGradientMarine": { "name": "--vkui--vkontakte_gradient_marine", - "value": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", + "value": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", }, "vkontakteGradientMidnight": { "name": "--vkui--vkontakte_gradient_midnight", - "value": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", + "value": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", }, "vkontakteGradientNewYear": { "name": "--vkui--vkontakte_gradient_new_year", - "value": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", + "value": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", }, "vkontakteGradientOrange": { "name": "--vkui--vkontakte_gradient_orange", - "value": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", + "value": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", }, "vkontakteGradientPink": { "name": "--vkui--vkontakte_gradient_pink", - "value": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientPurple": { "name": "--vkui--vkontakte_gradient_purple", - "value": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", + "value": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", }, "vkontakteGradientRaspberryPink": { "name": "--vkui--vkontakte_gradient_raspberry_pink", - "value": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", + "value": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", }, "vkontakteGradientRed": { "name": "--vkui--vkontakte_gradient_red", - "value": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", + "value": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", }, "vkontakteGradientRetrowave": { "name": "--vkui--vkontakte_gradient_retrowave", - "value": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", + "value": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", }, "vkontakteGradientSberkot": { "name": "--vkui--vkontakte_gradient_sberkot", - "value": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", + "value": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", }, "vkontakteGradientSunset": { "name": "--vkui--vkontakte_gradient_sunset", - "value": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientTurquoise": { "name": "--vkui--vkontakte_gradient_turquoise", - "value": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", + "value": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", }, "vkontakteGradientTwilight": { "name": "--vkui--vkontakte_gradient_twilight", - "value": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", + "value": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", }, "vkontakteGradientUnicorn": { "name": "--vkui--vkontakte_gradient_unicorn", - "value": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", + "value": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", }, "vkontakteGradientValentine": { "name": "--vkui--vkontakte_gradient_valentine", - "value": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", + "value": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", }, "vkontakteGradientViolet": { "name": "--vkui--vkontakte_gradient_violet", - "value": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", + "value": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", }, "vkontakteGradientWarmValentine": { "name": "--vkui--vkontakte_gradient_warm_valentine", - "value": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", + "value": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", }, "vkontakteGradientWomensDay": { "name": "--vkui--vkontakte_gradient_womens_day", - "value": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientYellow": { "name": "--vkui--vkontakte_gradient_yellow", - "value": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", + "value": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", }, "vkontakteGradientYellowBright": { "name": "--vkui--vkontakte_gradient_yellow_bright", - "value": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "value": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", }, "vkontakteImAttachTint": { "active": { @@ -463349,40 +463349,40 @@ exports[`shapshots vkontakteCom theme should match pixelify theme snapshot 1`] = "hover": "#939CA9", "normal": "#99a2ad", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#3F72B0", "hover": "#4177B5", @@ -464744,40 +464744,40 @@ exports[`shapshots vkontakteCom theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--vkontakte_float_button_foreground--hover, #939CA9)", "normal": "var(--vkui--vkontakte_float_button_foreground, #99a2ad)", }, - "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", - "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", - "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", - "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", - "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", - "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", - "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", - "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", - "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", - "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", - "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", - "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", - "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", - "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", - "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", - "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", - "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", - "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", - "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", - "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", - "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", - "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", - "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", - "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", - "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", - "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", - "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", - "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", - "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", - "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", - "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", - "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", - "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", - "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", + "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", + "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", + "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", + "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", + "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", + "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", + "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", + "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", + "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", + "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", + "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", + "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", + "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", + "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", + "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", + "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", + "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", + "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", + "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", + "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", + "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", + "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", + "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", + "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", + "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", + "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", + "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", + "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", + "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", "vkontakteImAttachTint": { "active": "var(--vkui--vkontakte_im_attach_tint--active, #3F72B0)", "hover": "var(--vkui--vkontakte_im_attach_tint--hover, #4177B5)", @@ -466139,40 +466139,40 @@ exports[`shapshots vkontakteCom theme should match root theme snapshot 1`] = ` "hover": "#939CA9", "normal": "#99a2ad", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#3F72B0", "hover": "#4177B5", @@ -470350,139 +470350,139 @@ exports[`shapshots vkontakteComDark theme should match cssVars snapshot 1`] = ` }, "vkontakteGradientAquamarineBlue": { "name": "--vkui--vkontakte_gradient_aquamarine_blue", - "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", + "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", }, "vkontakteGradientBlue": { "name": "--vkui--vkontakte_gradient_blue", - "value": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", + "value": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", }, "vkontakteGradientCandy": { "name": "--vkui--vkontakte_gradient_candy", - "value": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientCrimson": { "name": "--vkui--vkontakte_gradient_crimson", - "value": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", + "value": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", }, "vkontakteGradientDisco": { "name": "--vkui--vkontakte_gradient_disco", - "value": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", + "value": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", }, "vkontakteGradientEmerald": { "name": "--vkui--vkontakte_gradient_emerald", - "value": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", + "value": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", }, "vkontakteGradientFrost": { "name": "--vkui--vkontakte_gradient_frost", - "value": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", + "value": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", }, "vkontakteGradientGray": { "name": "--vkui--vkontakte_gradient_gray", - "value": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", + "value": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", }, "vkontakteGradientGreen": { "name": "--vkui--vkontakte_gradient_green", - "value": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", + "value": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", }, "vkontakteGradientHalloweenOrange": { "name": "--vkui--vkontakte_gradient_halloween_orange", - "value": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", + "value": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", }, "vkontakteGradientHalloweenViolet": { "name": "--vkui--vkontakte_gradient_halloween_violet", - "value": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", + "value": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", }, "vkontakteGradientLagoon": { "name": "--vkui--vkontakte_gradient_lagoon", - "value": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", + "value": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", }, "vkontakteGradientLavender": { "name": "--vkui--vkontakte_gradient_lavender", - "value": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", + "value": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", }, "vkontakteGradientMable": { "name": "--vkui--vkontakte_gradient_mable", - "value": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", + "value": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", }, "vkontakteGradientMarine": { "name": "--vkui--vkontakte_gradient_marine", - "value": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", + "value": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", }, "vkontakteGradientMidnight": { "name": "--vkui--vkontakte_gradient_midnight", - "value": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", + "value": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", }, "vkontakteGradientNewYear": { "name": "--vkui--vkontakte_gradient_new_year", - "value": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", + "value": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", }, "vkontakteGradientOrange": { "name": "--vkui--vkontakte_gradient_orange", - "value": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", + "value": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", }, "vkontakteGradientPink": { "name": "--vkui--vkontakte_gradient_pink", - "value": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientPurple": { "name": "--vkui--vkontakte_gradient_purple", - "value": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", + "value": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", }, "vkontakteGradientRaspberryPink": { "name": "--vkui--vkontakte_gradient_raspberry_pink", - "value": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", + "value": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", }, "vkontakteGradientRed": { "name": "--vkui--vkontakte_gradient_red", - "value": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", + "value": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", }, "vkontakteGradientRetrowave": { "name": "--vkui--vkontakte_gradient_retrowave", - "value": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", + "value": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", }, "vkontakteGradientSberkot": { "name": "--vkui--vkontakte_gradient_sberkot", - "value": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", + "value": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", }, "vkontakteGradientSunset": { "name": "--vkui--vkontakte_gradient_sunset", - "value": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientTurquoise": { "name": "--vkui--vkontakte_gradient_turquoise", - "value": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", + "value": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", }, "vkontakteGradientTwilight": { "name": "--vkui--vkontakte_gradient_twilight", - "value": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", + "value": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", }, "vkontakteGradientUnicorn": { "name": "--vkui--vkontakte_gradient_unicorn", - "value": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", + "value": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", }, "vkontakteGradientValentine": { "name": "--vkui--vkontakte_gradient_valentine", - "value": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", + "value": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", }, "vkontakteGradientViolet": { "name": "--vkui--vkontakte_gradient_violet", - "value": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", + "value": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", }, "vkontakteGradientWarmValentine": { "name": "--vkui--vkontakte_gradient_warm_valentine", - "value": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", + "value": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", }, "vkontakteGradientWomensDay": { "name": "--vkui--vkontakte_gradient_womens_day", - "value": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientYellow": { "name": "--vkui--vkontakte_gradient_yellow", - "value": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", + "value": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", }, "vkontakteGradientYellowBright": { "name": "--vkui--vkontakte_gradient_yellow_bright", - "value": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "value": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", }, "vkontakteImAttachTint": { "active": { @@ -471986,40 +471986,40 @@ exports[`shapshots vkontakteComDark theme should match pixelify theme snapshot 1 "hover": "#B5B5B5", "normal": "#b2b2b2", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -473381,40 +473381,40 @@ exports[`shapshots vkontakteComDark theme should match pseudo theme from CssVars "hover": "var(--vkui--vkontakte_float_button_foreground--hover, #B5B5B5)", "normal": "var(--vkui--vkontakte_float_button_foreground, #b2b2b2)", }, - "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", - "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", - "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", - "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", - "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", - "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", - "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", - "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", - "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", - "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", - "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", - "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", - "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", - "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", - "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", - "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", - "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", - "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", - "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", - "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", - "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", - "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", - "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", - "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", - "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", - "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", - "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", - "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", - "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", - "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", - "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", - "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", - "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", - "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", + "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", + "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", + "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", + "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", + "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", + "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", + "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", + "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", + "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", + "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", + "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", + "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", + "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", + "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", + "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", + "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", + "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", + "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", + "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", + "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", + "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", + "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", + "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", + "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", + "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", + "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", + "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", + "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", + "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", "vkontakteImAttachTint": { "active": "var(--vkui--vkontakte_im_attach_tint--active, #D7D8DB)", "hover": "var(--vkui--vkontakte_im_attach_tint--hover, #EBEDF0)", @@ -474776,40 +474776,40 @@ exports[`shapshots vkontakteComDark theme should match root theme snapshot 1`] = "hover": "#B5B5B5", "normal": "#b2b2b2", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -478987,139 +478987,139 @@ exports[`shapshots vkontakteIOS theme should match cssVars snapshot 1`] = ` }, "vkontakteGradientAquamarineBlue": { "name": "--vkui--vkontakte_gradient_aquamarine_blue", - "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", + "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", }, "vkontakteGradientBlue": { "name": "--vkui--vkontakte_gradient_blue", - "value": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", + "value": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", }, "vkontakteGradientCandy": { "name": "--vkui--vkontakte_gradient_candy", - "value": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientCrimson": { "name": "--vkui--vkontakte_gradient_crimson", - "value": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", + "value": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", }, "vkontakteGradientDisco": { "name": "--vkui--vkontakte_gradient_disco", - "value": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", + "value": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", }, "vkontakteGradientEmerald": { "name": "--vkui--vkontakte_gradient_emerald", - "value": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", + "value": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", }, "vkontakteGradientFrost": { "name": "--vkui--vkontakte_gradient_frost", - "value": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", + "value": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", }, "vkontakteGradientGray": { "name": "--vkui--vkontakte_gradient_gray", - "value": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", + "value": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", }, "vkontakteGradientGreen": { "name": "--vkui--vkontakte_gradient_green", - "value": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", + "value": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", }, "vkontakteGradientHalloweenOrange": { "name": "--vkui--vkontakte_gradient_halloween_orange", - "value": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", + "value": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", }, "vkontakteGradientHalloweenViolet": { "name": "--vkui--vkontakte_gradient_halloween_violet", - "value": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", + "value": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", }, "vkontakteGradientLagoon": { "name": "--vkui--vkontakte_gradient_lagoon", - "value": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", + "value": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", }, "vkontakteGradientLavender": { "name": "--vkui--vkontakte_gradient_lavender", - "value": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", + "value": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", }, "vkontakteGradientMable": { "name": "--vkui--vkontakte_gradient_mable", - "value": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", + "value": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", }, "vkontakteGradientMarine": { "name": "--vkui--vkontakte_gradient_marine", - "value": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", + "value": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", }, "vkontakteGradientMidnight": { "name": "--vkui--vkontakte_gradient_midnight", - "value": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", + "value": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", }, "vkontakteGradientNewYear": { "name": "--vkui--vkontakte_gradient_new_year", - "value": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", + "value": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", }, "vkontakteGradientOrange": { "name": "--vkui--vkontakte_gradient_orange", - "value": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", + "value": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", }, "vkontakteGradientPink": { "name": "--vkui--vkontakte_gradient_pink", - "value": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientPurple": { "name": "--vkui--vkontakte_gradient_purple", - "value": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", + "value": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", }, "vkontakteGradientRaspberryPink": { "name": "--vkui--vkontakte_gradient_raspberry_pink", - "value": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", + "value": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", }, "vkontakteGradientRed": { "name": "--vkui--vkontakte_gradient_red", - "value": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", + "value": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", }, "vkontakteGradientRetrowave": { "name": "--vkui--vkontakte_gradient_retrowave", - "value": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", + "value": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", }, "vkontakteGradientSberkot": { "name": "--vkui--vkontakte_gradient_sberkot", - "value": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", + "value": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", }, "vkontakteGradientSunset": { "name": "--vkui--vkontakte_gradient_sunset", - "value": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientTurquoise": { "name": "--vkui--vkontakte_gradient_turquoise", - "value": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", + "value": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", }, "vkontakteGradientTwilight": { "name": "--vkui--vkontakte_gradient_twilight", - "value": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", + "value": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", }, "vkontakteGradientUnicorn": { "name": "--vkui--vkontakte_gradient_unicorn", - "value": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", + "value": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", }, "vkontakteGradientValentine": { "name": "--vkui--vkontakte_gradient_valentine", - "value": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", + "value": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", }, "vkontakteGradientViolet": { "name": "--vkui--vkontakte_gradient_violet", - "value": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", + "value": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", }, "vkontakteGradientWarmValentine": { "name": "--vkui--vkontakte_gradient_warm_valentine", - "value": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", + "value": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", }, "vkontakteGradientWomensDay": { "name": "--vkui--vkontakte_gradient_womens_day", - "value": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientYellow": { "name": "--vkui--vkontakte_gradient_yellow", - "value": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", + "value": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", }, "vkontakteGradientYellowBright": { "name": "--vkui--vkontakte_gradient_yellow_bright", - "value": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "value": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", }, "vkontakteImAttachTint": { "active": { @@ -480623,40 +480623,40 @@ exports[`shapshots vkontakteIOS theme should match pixelify theme snapshot 1`] = "hover": "#939CA9", "normal": "#99a2ad", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#2978D3", "hover": "#2B7CD9", @@ -482018,40 +482018,40 @@ exports[`shapshots vkontakteIOS theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--vkontakte_float_button_foreground--hover, #939CA9)", "normal": "var(--vkui--vkontakte_float_button_foreground, #99a2ad)", }, - "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", - "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", - "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", - "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", - "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", - "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", - "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", - "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", - "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", - "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", - "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", - "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", - "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", - "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", - "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", - "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", - "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", - "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", - "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", - "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", - "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", - "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", - "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", - "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", - "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", - "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", - "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", - "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", - "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", - "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", - "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", - "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", - "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", - "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", + "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", + "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", + "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", + "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", + "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", + "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", + "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", + "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", + "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", + "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", + "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", + "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", + "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", + "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", + "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", + "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", + "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", + "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", + "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", + "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", + "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", + "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", + "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", + "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", + "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", + "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", + "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", + "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", + "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", "vkontakteImAttachTint": { "active": "var(--vkui--vkontakte_im_attach_tint--active, #2978D3)", "hover": "var(--vkui--vkontakte_im_attach_tint--hover, #2B7CD9)", @@ -483413,40 +483413,40 @@ exports[`shapshots vkontakteIOS theme should match root theme snapshot 1`] = ` "hover": "#939CA9", "normal": "#99a2ad", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#2978D3", "hover": "#2B7CD9", @@ -487624,139 +487624,139 @@ exports[`shapshots vkontakteIOSDark theme should match cssVars snapshot 1`] = ` }, "vkontakteGradientAquamarineBlue": { "name": "--vkui--vkontakte_gradient_aquamarine_blue", - "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", + "value": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", }, "vkontakteGradientBlue": { "name": "--vkui--vkontakte_gradient_blue", - "value": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", + "value": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", }, "vkontakteGradientCandy": { "name": "--vkui--vkontakte_gradient_candy", - "value": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientCrimson": { "name": "--vkui--vkontakte_gradient_crimson", - "value": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", + "value": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", }, "vkontakteGradientDisco": { "name": "--vkui--vkontakte_gradient_disco", - "value": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", + "value": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", }, "vkontakteGradientEmerald": { "name": "--vkui--vkontakte_gradient_emerald", - "value": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", + "value": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", }, "vkontakteGradientFrost": { "name": "--vkui--vkontakte_gradient_frost", - "value": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", + "value": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", }, "vkontakteGradientGray": { "name": "--vkui--vkontakte_gradient_gray", - "value": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", + "value": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", }, "vkontakteGradientGreen": { "name": "--vkui--vkontakte_gradient_green", - "value": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", + "value": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", }, "vkontakteGradientHalloweenOrange": { "name": "--vkui--vkontakte_gradient_halloween_orange", - "value": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", + "value": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", }, "vkontakteGradientHalloweenViolet": { "name": "--vkui--vkontakte_gradient_halloween_violet", - "value": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", + "value": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", }, "vkontakteGradientLagoon": { "name": "--vkui--vkontakte_gradient_lagoon", - "value": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", + "value": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", }, "vkontakteGradientLavender": { "name": "--vkui--vkontakte_gradient_lavender", - "value": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", + "value": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", }, "vkontakteGradientMable": { "name": "--vkui--vkontakte_gradient_mable", - "value": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", + "value": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", }, "vkontakteGradientMarine": { "name": "--vkui--vkontakte_gradient_marine", - "value": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", + "value": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", }, "vkontakteGradientMidnight": { "name": "--vkui--vkontakte_gradient_midnight", - "value": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", + "value": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", }, "vkontakteGradientNewYear": { "name": "--vkui--vkontakte_gradient_new_year", - "value": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", + "value": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", }, "vkontakteGradientOrange": { "name": "--vkui--vkontakte_gradient_orange", - "value": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", + "value": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", }, "vkontakteGradientPink": { "name": "--vkui--vkontakte_gradient_pink", - "value": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientPurple": { "name": "--vkui--vkontakte_gradient_purple", - "value": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", + "value": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", }, "vkontakteGradientRaspberryPink": { "name": "--vkui--vkontakte_gradient_raspberry_pink", - "value": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", + "value": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", }, "vkontakteGradientRed": { "name": "--vkui--vkontakte_gradient_red", - "value": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", + "value": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", }, "vkontakteGradientRetrowave": { "name": "--vkui--vkontakte_gradient_retrowave", - "value": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", + "value": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", }, "vkontakteGradientSberkot": { "name": "--vkui--vkontakte_gradient_sberkot", - "value": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", + "value": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", }, "vkontakteGradientSunset": { "name": "--vkui--vkontakte_gradient_sunset", - "value": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", + "value": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", }, "vkontakteGradientTurquoise": { "name": "--vkui--vkontakte_gradient_turquoise", - "value": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", + "value": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", }, "vkontakteGradientTwilight": { "name": "--vkui--vkontakte_gradient_twilight", - "value": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", + "value": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", }, "vkontakteGradientUnicorn": { "name": "--vkui--vkontakte_gradient_unicorn", - "value": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", + "value": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", }, "vkontakteGradientValentine": { "name": "--vkui--vkontakte_gradient_valentine", - "value": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", + "value": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", }, "vkontakteGradientViolet": { "name": "--vkui--vkontakte_gradient_violet", - "value": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", + "value": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", }, "vkontakteGradientWarmValentine": { "name": "--vkui--vkontakte_gradient_warm_valentine", - "value": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", + "value": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", }, "vkontakteGradientWomensDay": { "name": "--vkui--vkontakte_gradient_womens_day", - "value": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", + "value": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", }, "vkontakteGradientYellow": { "name": "--vkui--vkontakte_gradient_yellow", - "value": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", + "value": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", }, "vkontakteGradientYellowBright": { "name": "--vkui--vkontakte_gradient_yellow_bright", - "value": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "value": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", }, "vkontakteImAttachTint": { "active": { @@ -489260,40 +489260,40 @@ exports[`shapshots vkontakteIOSDark theme should match pixelify theme snapshot 1 "hover": "#ADB1B6", "normal": "#aaaeb3", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -490655,40 +490655,40 @@ exports[`shapshots vkontakteIOSDark theme should match pseudo theme from CssVars "hover": "var(--vkui--vkontakte_float_button_foreground--hover, #ADB1B6)", "normal": "var(--vkui--vkontakte_float_button_foreground, #aaaeb3)", }, - "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, #7DF1FA, #2BB4D6)", - "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, #66CCFF, #3F8AE0)", - "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, #FF99CC, #E52E6A)", - "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, #FF7373, #E53949, #BF1C38)", - "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, #FFB726, #FF2693, #8122E0, #2693FF)", - "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, #00D948, #0D8046)", - "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, #4FA0FF, #016CEA)", - "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, #C1CAD6, #878F99)", - "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, #6CD97E, #12B312)", - "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, #CB1E3B, #F05C44, #FFA000)", - "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, #FFA000, #CD4C4B, #792EC0)", - "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, #2BD9D9, #5C9CE6)", - "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, #928FFF, #4B47B2)", - "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, #D9F4FF, #D9F4FF)", - "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, #2EE54D, #0D7EFF)", - "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, #73D0FF, #3885E1, #0032A6)", - "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, #BB64E4, #805BD7, #2866D5)", - "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, #FFBF80, #E66B2E)", - "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, #FF8880, #E62E6B)", - "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, #A393F5, #735CE6)", - "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, #FF80D5, #E645B1)", - "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, #FF7583, #E62E40)", - "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, #30F2B1, #5967FF, #FF26A5)", - "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, #9DF19D, #31C2A7, #21A19A, #107F8C)", - "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, #FFD24D, #F26549, #E62E6B)", - "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, #8AE6E6, #12B3B3)", - "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, #FF4D87, #9F40FF, #3399FF)", - "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, #FF99CC, #A179F2, #5CA1E6)", - "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, #FF8A65, #F25383, #8F13DB)", - "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, #D3A6FF, #903FE0)", - "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, #F3386A, #FF819E)", - "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, #FF99CC, #E52E6A)", - "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, #FFC44D, #F07300)", - "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, #FFD54F, #E7A902)", + "vkontakteGradientAquamarineBlue": "var(--vkui--vkontakte_gradient_aquamarine_blue, rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%)", + "vkontakteGradientBlue": "var(--vkui--vkontakte_gradient_blue, rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%)", + "vkontakteGradientCandy": "var(--vkui--vkontakte_gradient_candy, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientCrimson": "var(--vkui--vkontakte_gradient_crimson, rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%)", + "vkontakteGradientDisco": "var(--vkui--vkontakte_gradient_disco, rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%)", + "vkontakteGradientEmerald": "var(--vkui--vkontakte_gradient_emerald, rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%)", + "vkontakteGradientFrost": "var(--vkui--vkontakte_gradient_frost, rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%)", + "vkontakteGradientGray": "var(--vkui--vkontakte_gradient_gray, rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%)", + "vkontakteGradientGreen": "var(--vkui--vkontakte_gradient_green, rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%)", + "vkontakteGradientHalloweenOrange": "var(--vkui--vkontakte_gradient_halloween_orange, rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%)", + "vkontakteGradientHalloweenViolet": "var(--vkui--vkontakte_gradient_halloween_violet, rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%)", + "vkontakteGradientLagoon": "var(--vkui--vkontakte_gradient_lagoon, rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%)", + "vkontakteGradientLavender": "var(--vkui--vkontakte_gradient_lavender, rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%)", + "vkontakteGradientMable": "var(--vkui--vkontakte_gradient_mable, rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%)", + "vkontakteGradientMarine": "var(--vkui--vkontakte_gradient_marine, rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%)", + "vkontakteGradientMidnight": "var(--vkui--vkontakte_gradient_midnight, rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%)", + "vkontakteGradientNewYear": "var(--vkui--vkontakte_gradient_new_year, rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%)", + "vkontakteGradientOrange": "var(--vkui--vkontakte_gradient_orange, rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%)", + "vkontakteGradientPink": "var(--vkui--vkontakte_gradient_pink, rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientPurple": "var(--vkui--vkontakte_gradient_purple, rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%)", + "vkontakteGradientRaspberryPink": "var(--vkui--vkontakte_gradient_raspberry_pink, rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%)", + "vkontakteGradientRed": "var(--vkui--vkontakte_gradient_red, rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%)", + "vkontakteGradientRetrowave": "var(--vkui--vkontakte_gradient_retrowave, rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%)", + "vkontakteGradientSberkot": "var(--vkui--vkontakte_gradient_sberkot, rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%)", + "vkontakteGradientSunset": "var(--vkui--vkontakte_gradient_sunset, rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%)", + "vkontakteGradientTurquoise": "var(--vkui--vkontakte_gradient_turquoise, rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%)", + "vkontakteGradientTwilight": "var(--vkui--vkontakte_gradient_twilight, rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%)", + "vkontakteGradientUnicorn": "var(--vkui--vkontakte_gradient_unicorn, rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%)", + "vkontakteGradientValentine": "var(--vkui--vkontakte_gradient_valentine, rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%)", + "vkontakteGradientViolet": "var(--vkui--vkontakte_gradient_violet, rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%)", + "vkontakteGradientWarmValentine": "var(--vkui--vkontakte_gradient_warm_valentine, rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%)", + "vkontakteGradientWomensDay": "var(--vkui--vkontakte_gradient_womens_day, rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%)", + "vkontakteGradientYellow": "var(--vkui--vkontakte_gradient_yellow, rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%)", + "vkontakteGradientYellowBright": "var(--vkui--vkontakte_gradient_yellow_bright, rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%)", "vkontakteImAttachTint": { "active": "var(--vkui--vkontakte_im_attach_tint--active, #D7D8DB)", "hover": "var(--vkui--vkontakte_im_attach_tint--hover, #EBEDF0)", @@ -492050,40 +492050,40 @@ exports[`shapshots vkontakteIOSDark theme should match root theme snapshot 1`] = "hover": "#ADB1B6", "normal": "#aaaeb3", }, - "vkontakteGradientAquamarineBlue": "#7DF1FA, #2BB4D6", - "vkontakteGradientBlue": "#66CCFF, #3F8AE0", - "vkontakteGradientCandy": "#FF99CC, #E52E6A", - "vkontakteGradientCrimson": "#FF7373, #E53949, #BF1C38", - "vkontakteGradientDisco": "#FFB726, #FF2693, #8122E0, #2693FF", - "vkontakteGradientEmerald": "#00D948, #0D8046", - "vkontakteGradientFrost": "#4FA0FF, #016CEA", - "vkontakteGradientGray": "#C1CAD6, #878F99", - "vkontakteGradientGreen": "#6CD97E, #12B312", - "vkontakteGradientHalloweenOrange": "#CB1E3B, #F05C44, #FFA000", - "vkontakteGradientHalloweenViolet": "#FFA000, #CD4C4B, #792EC0", - "vkontakteGradientLagoon": "#2BD9D9, #5C9CE6", - "vkontakteGradientLavender": "#928FFF, #4B47B2", - "vkontakteGradientMable": "#D9F4FF, #D9F4FF", - "vkontakteGradientMarine": "#2EE54D, #0D7EFF", - "vkontakteGradientMidnight": "#73D0FF, #3885E1, #0032A6", - "vkontakteGradientNewYear": "#BB64E4, #805BD7, #2866D5", - "vkontakteGradientOrange": "#FFBF80, #E66B2E", - "vkontakteGradientPink": "#FF8880, #E62E6B", - "vkontakteGradientPurple": "#A393F5, #735CE6", - "vkontakteGradientRaspberryPink": "#FF80D5, #E645B1", - "vkontakteGradientRed": "#FF7583, #E62E40", - "vkontakteGradientRetrowave": "#30F2B1, #5967FF, #FF26A5", - "vkontakteGradientSberkot": "#9DF19D, #31C2A7, #21A19A, #107F8C", - "vkontakteGradientSunset": "#FFD24D, #F26549, #E62E6B", - "vkontakteGradientTurquoise": "#8AE6E6, #12B3B3", - "vkontakteGradientTwilight": "#FF4D87, #9F40FF, #3399FF", - "vkontakteGradientUnicorn": "#FF99CC, #A179F2, #5CA1E6", - "vkontakteGradientValentine": "#FF8A65, #F25383, #8F13DB", - "vkontakteGradientViolet": "#D3A6FF, #903FE0", - "vkontakteGradientWarmValentine": "#F3386A, #FF819E", - "vkontakteGradientWomensDay": "#FF99CC, #E52E6A", - "vkontakteGradientYellow": "#FFC44D, #F07300", - "vkontakteGradientYellowBright": "#FFD54F, #E7A902", + "vkontakteGradientAquamarineBlue": "rgba(125, 241, 250, 1) 0%, rgba(43, 180, 214, 1) 100%", + "vkontakteGradientBlue": "rgba(102, 204, 255, 1) 0%, rgba(63, 138, 224, 1) 100%", + "vkontakteGradientCandy": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientCrimson": "rgba(255, 115, 115, 1) 0%, rgba(229, 57, 73, 1) 50%, rgba(191, 28, 56, 1) 100%", + "vkontakteGradientDisco": "rgba(255, 183, 38, 1) 0%, rgba(255, 38, 147, 1) 33%, rgba(129, 34, 224, 1) 67%, rgba(38, 147, 255, 1) 100%", + "vkontakteGradientEmerald": "rgba(0, 217, 72, 1) 0%, rgba(13, 128, 70, 1) 100%", + "vkontakteGradientFrost": "rgba(79, 160, 255, 1) 0%, rgba(1, 108, 234, 1) 100%", + "vkontakteGradientGray": "rgba(193, 202, 214, 1) 0%, rgba(135, 143, 153, 1) 100%", + "vkontakteGradientGreen": "rgba(108, 217, 126, 1) 0%, rgba(18, 179, 18, 1) 100%", + "vkontakteGradientHalloweenOrange": "rgba(203, 30, 59, 1) 0%, rgba(240, 92, 68, 1) 50%, rgba(255, 160, 0, 1) 100%", + "vkontakteGradientHalloweenViolet": "rgba(255, 160, 0, 1) 0%, rgba(205, 76, 75, 1) 50%, rgba(121, 46, 192, 1) 100%", + "vkontakteGradientLagoon": "rgba(43, 217, 217, 1) 0%, rgba(92, 156, 230, 1) 100%", + "vkontakteGradientLavender": "rgba(146, 143, 255, 1) 0%, rgba(75, 71, 178, 1) 100%", + "vkontakteGradientMable": "rgba(217, 244, 255, 1) 0%, rgba(217, 244, 255, 1) 100%", + "vkontakteGradientMarine": "rgba(46, 229, 77, 1) 0%, rgba(13, 126, 255, 1) 100%", + "vkontakteGradientMidnight": "rgba(115, 208, 255, 1) 0%, rgba(56, 133, 225, 1) 50%, rgba(0, 50, 166, 1) 100%", + "vkontakteGradientNewYear": "rgba(187, 100, 228, 1) 0%, rgba(128, 91, 215, 1) 50%, rgba(40, 102, 213, 1) 100%", + "vkontakteGradientOrange": "rgba(255, 191, 128, 1) 0%, rgba(230, 107, 46, 1) 100%", + "vkontakteGradientPink": "rgba(255, 136, 128, 1) 0%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientPurple": "rgba(163, 147, 245, 1) 0%, rgba(115, 92, 230, 1) 100%", + "vkontakteGradientRaspberryPink": "rgba(255, 128, 213, 1) 0%, rgba(230, 69, 177, 1) 100%", + "vkontakteGradientRed": "rgba(255, 117, 131, 1) 0%, rgba(230, 46, 64, 1) 100%", + "vkontakteGradientRetrowave": "rgba(48, 242, 177, 1) 0%, rgba(89, 103, 255, 1) 50%, rgba(255, 38, 165, 1) 100%", + "vkontakteGradientSberkot": "rgba(157, 241, 157, 1) 0%, rgba(49, 194, 167, 1) 33%, rgba(33, 161, 154, 1) 67%, rgba(16, 127, 140, 1) 100%", + "vkontakteGradientSunset": "rgba(255, 210, 77, 1) 0%, rgba(242, 101, 73, 1) 50%, rgba(230, 46, 107, 1) 100%", + "vkontakteGradientTurquoise": "rgba(138, 230, 230, 1) 0%, rgba(18, 179, 179, 1) 100%", + "vkontakteGradientTwilight": "rgba(255, 77, 135, 1) 0%, rgba(159, 64, 255, 1) 50%, rgba(51, 153, 255, 1) 100%", + "vkontakteGradientUnicorn": "rgba(255, 153, 204, 1) 0%, rgba(161, 121, 242, 1) 50%, rgba(92, 161, 230, 1) 100%", + "vkontakteGradientValentine": "rgba(255, 138, 101, 1) 0%, rgba(242, 83, 131, 1) 50%, rgba(143, 19, 219, 1) 100%", + "vkontakteGradientViolet": "rgba(211, 166, 255, 1) 0%, rgba(144, 63, 224, 1) 100%", + "vkontakteGradientWarmValentine": "rgba(243, 56, 106, 1) 0%, rgba(255, 129, 158, 1) 100%", + "vkontakteGradientWomensDay": "rgba(255, 153, 204, 1) 0%, rgba(229, 46, 106, 1) 100%", + "vkontakteGradientYellow": "rgba(255, 196, 77, 1) 0%, rgba(240, 115, 0, 1) 100%", + "vkontakteGradientYellowBright": "rgba(255, 213, 79, 1) 0%, rgba(231, 169, 2, 1) 100%", "vkontakteImAttachTint": { "active": "#D7D8DB", "hover": "#EBEDF0", From 80fbcc1b7a15f3b3432c6b3ab5280d80956c1549 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 24 Sep 2024 20:21:49 +0300 Subject: [PATCH 17/36] feat/tokenized-gradients: fix struct compiler --- .../structJSON/compileStructJSON.test.ts | 13 ++++++ .../compilers/structJSON/compileStructJSON.ts | 43 +++++++++++++++++++ 2 files changed, 56 insertions(+) diff --git a/src/build/compilers/structJSON/compileStructJSON.test.ts b/src/build/compilers/structJSON/compileStructJSON.test.ts index 23d2bd489..324b3ee2c 100644 --- a/src/build/compilers/structJSON/compileStructJSON.test.ts +++ b/src/build/compilers/structJSON/compileStructJSON.test.ts @@ -8,6 +8,8 @@ describe('compileJSON', () => { colorA: '#fff', colorsScheme: 'scheme', randomToken: 123, + gradientTest: + 'var(--vkui--color_background_content, rgba(255, 255, 255, 1)) 0%, rgba(0, 0, 0, 0) 100%', }; expect(compileStructJSON(testData)).toBe( @@ -20,6 +22,17 @@ describe('compileJSON', () => { }, "other": { "randomToken": 123 + }, + "gradient": { + "gradientTest": [ + { + "color": "rgba(255, 255, 255, 1)", + "token": "colorBackgroundContent" + }, + { + "color": "rgba(0, 0, 0, 0)" + } + ] } }`, ); diff --git a/src/build/compilers/structJSON/compileStructJSON.ts b/src/build/compilers/structJSON/compileStructJSON.ts index 6e1b031a8..77957d252 100644 --- a/src/build/compilers/structJSON/compileStructJSON.ts +++ b/src/build/compilers/structJSON/compileStructJSON.ts @@ -1,3 +1,4 @@ +import { convertSnakeToCamel } from '@/build/helpers/convertSnakeToCamel'; import type { Theme } from '@/interfaces/general'; export type ValuesOf = T[number]; @@ -18,6 +19,44 @@ const groups = [ 'other', ] as const; +interface StructGradientPoint { + color: string; + token?: string; +} + +function parseRawToken(rawToken: string): StructGradientPoint { + rawToken = rawToken.replace(/^,\s/g, '').replace(/\d+$/g, '').trim(); + + if (rawToken.startsWith('var(')) { + const varNameRaw = /^var\(([\w\-_]+)/.exec(rawToken); + + if (varNameRaw) { + const varName = varNameRaw[1]; + const varValue = rawToken.slice(varNameRaw[0].length, -1).trim().slice(1).trim(); + + return { color: varValue, token: convertSnakeToCamel(varName) }; + } + + return { color: rawToken }; + } + + return { color: rawToken }; +} + +function compileStructGradients( + cssGradients: Record, +): Record { + const structGradients: Record = {}; + const keys = Object.keys(cssGradients); + + for (const key of keys) { + const rawPoints = cssGradients[key].split('%').slice(0, -1); + structGradients[key] = rawPoints.map(parseRawToken); + } + + return structGradients; +} + /** * Компилирует структурируемый json с темой */ @@ -34,5 +73,9 @@ export const compileStructJSON = (theme: T): string => { structTheme[group][key] = theme[key]; }); + if (structTheme['gradient']) { + structTheme['gradient'] = compileStructGradients(structTheme['gradient']); + } + return JSON.stringify(structTheme, null, '\t'); }; From abba3f12a511a41bbde6a4c78685eb279f5e0a06 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 24 Sep 2024 20:22:16 +0300 Subject: [PATCH 18/36] feat/tokenized-gradients: add tests --- src/build/helpers/convertSnakeToCamel.test.ts | 21 +++++++++++++++++++ src/build/helpers/convertSnakeToCamel.ts | 9 ++++++++ 2 files changed, 30 insertions(+) create mode 100644 src/build/helpers/convertSnakeToCamel.test.ts create mode 100644 src/build/helpers/convertSnakeToCamel.ts diff --git a/src/build/helpers/convertSnakeToCamel.test.ts b/src/build/helpers/convertSnakeToCamel.test.ts new file mode 100644 index 000000000..b3b746069 --- /dev/null +++ b/src/build/helpers/convertSnakeToCamel.test.ts @@ -0,0 +1,21 @@ +import { describe, expect, test } from '@jest/globals'; + +import { convertSnakeToCamel } from './convertSnakeToCamel'; + +describe('convertSnakeToCamel', () => { + test('convert empty string', () => { + expect(convertSnakeToCamel('')).toEqual(''); + }); + + test('replaces prefix', () => { + expect(convertSnakeToCamel('--vkui--')).toEqual(''); + }); + + test('replaces prefix and converts to lower case', () => { + expect(convertSnakeToCamel('--vkui--Test')).toEqual('test'); + }); + + test('replaces prefix and converts to camel case', () => { + expect(convertSnakeToCamel('--vkui--Test_var')).toEqual('testVar'); + }); +}); diff --git a/src/build/helpers/convertSnakeToCamel.ts b/src/build/helpers/convertSnakeToCamel.ts new file mode 100644 index 000000000..99e8aa29c --- /dev/null +++ b/src/build/helpers/convertSnakeToCamel.ts @@ -0,0 +1,9 @@ +/** + * snake_case -> camelCase + */ +export function convertSnakeToCamel(snake: string, prefix = 'vkui'): string { + return snake + .replace(new RegExp(`^--${prefix}--`), '') + .toLowerCase() + .replace(/([-_][a-z])/g, (group) => group.toUpperCase().replace('-', '').replace('_', '')); +} From bc27733aa7873138dced8571eeb0e764adb3e7d8 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Wed, 25 Sep 2024 16:27:46 +0300 Subject: [PATCH 19/36] feat/tokenized-gradients: add article route to docs --- docs/docs.d.ts | 6 + docs/src/App.tsx | 28 +- .../INDEX.md => src/articles/NewTheme.md} | 0 docs/src/pages/Articles.tsx | 47 ++ docs/src/styles/articles.css | 69 ++ docs/src/styles/index.css | 1 + .../{webpack.client.js => webpack.client.mjs} | 24 +- .../{webpack.config.js => webpack.config.mjs} | 25 +- package.json | 11 +- yarn.lock | 666 +++++++++++++++++- 10 files changed, 832 insertions(+), 45 deletions(-) rename docs/{articles/new-theme/INDEX.md => src/articles/NewTheme.md} (100%) create mode 100644 docs/src/pages/Articles.tsx create mode 100644 docs/src/styles/articles.css rename docs/webpack/{webpack.client.js => webpack.client.mjs} (73%) rename docs/webpack/{webpack.config.js => webpack.config.mjs} (56%) diff --git a/docs/docs.d.ts b/docs/docs.d.ts index 976923f62..573880f37 100644 --- a/docs/docs.d.ts +++ b/docs/docs.d.ts @@ -2,3 +2,9 @@ declare module '*.svg' { const content: any; export default content; } + +declare module '*.md' { + const content: any; + export default content; +} + diff --git a/docs/src/App.tsx b/docs/src/App.tsx index 8ed21fbb7..ed85d2d66 100644 --- a/docs/src/App.tsx +++ b/docs/src/App.tsx @@ -2,13 +2,39 @@ import '@vkontakte/vkui/dist/vkui.css'; import './styles/index.css'; import React, { FC } from 'react'; +import { + createBrowserRouter, + RouterProvider, + } from "react-router-dom"; import Main from '@/components/layouts/Main'; import Tokens from '@/pages/Tokens'; +import { Articles } from './pages/Articles'; + +import articleNewTheme from "./articles/NewTheme.md"; + +function articleRoute(slug: string, contents?: string) { + return { + path: `/articles/${slug}`, + element: + }; +} + +const router = createBrowserRouter([ + { + path: "/", + element: , + }, + { + path: "/articles", + element: + }, + articleRoute("new-theme", articleNewTheme), +]); const App: FC = () => (
- +
); diff --git a/docs/articles/new-theme/INDEX.md b/docs/src/articles/NewTheme.md similarity index 100% rename from docs/articles/new-theme/INDEX.md rename to docs/src/articles/NewTheme.md diff --git a/docs/src/pages/Articles.tsx b/docs/src/pages/Articles.tsx new file mode 100644 index 000000000..d26fd1410 --- /dev/null +++ b/docs/src/pages/Articles.tsx @@ -0,0 +1,47 @@ +import * as React from 'react'; +import hljs from 'highlight.js/lib/core'; +import typescript from 'highlight.js/lib/languages/typescript'; +import css from 'highlight.js/lib/languages/css'; +import 'highlight.js/styles/github.css'; + +hljs.registerLanguage('typescript', typescript); +hljs.registerLanguage('css', css); + +export interface ArticlesProps { + contentsHtml?: string; +} + +export function Articles(props: ArticlesProps) { + let articleContent = props.contentsHtml ?? ''; + const ref = React.useRef(undefined); + + React.useEffect(() => { + if (!ref.current) { + return; + } + + const codeBlocks = ref.current.querySelectorAll("code.language-typescript, code.language-css"); + + for (let i = 0; i < codeBlocks.length; i++) { + const codeBlock = codeBlocks[i] as HTMLElement; + codeBlock.innerHTML = hljs.highlightAuto(codeBlock.innerText).value; + } + + const links = ref.current.querySelectorAll("a[href]"); + + for (let i = 0; i < links.length; i++) { + const link = links[i] as HTMLElement; + link.setAttribute("target", "_blank"); + } + }, [ref.current]); + + return ( +
+
+
+ ); +} diff --git a/docs/src/styles/articles.css b/docs/src/styles/articles.css new file mode 100644 index 000000000..c4c29525c --- /dev/null +++ b/docs/src/styles/articles.css @@ -0,0 +1,69 @@ + +.articles-container { + color: var(--vkui--color_text_primary); + + font-size: var(--vkui--font_text--font_size--regular); + line-height: var(--vkui--font_text--line_height--regular); + font-family: var(--vkui--font_text--font_family--regular); + font-weight: var(--vkui--font_text--font_weight--regular); +} + +.articles-container p { + font-size: var(--vkui--font_paragraph--font_size--regular); + line-height: var(--vkui--font_paragraph--line_height--regular); + font-family: var(--vkui--font_paragraph--font_family--regular); + font-weight: var(--vkui--font_paragraph--font_weight--regular); +} + +.articles-container h1 { + font-size: var(--vkui--font_title1--font_size--regular); + line-height: var(--vkui--font_title1--line_height--regular); + font-family: var(--vkui--font_title1--font_family--regular); + font-weight: var(--vkui--font_title1--font_weight--regular); +} + +.articles-container h2 { + font-size: var(--vkui--font_title2--font_size--regular); + line-height: var(--vkui--font_title2--line_height--regular); + font-family: var(--vkui--font_title2--font_family--regular); + font-weight: var(--vkui--font_title2--font_weight--regular); +} + +.articles-container h3 { + font-size: var(--vkui--font_title3--font_size--regular); + line-height: var(--vkui--font_title3--line_height--regular); + font-family: var(--vkui--font_title3--font_family--regular); + font-weight: var(--vkui--font_title3--font_weight--regular); +} + +.articles-container h3 { + font-size: var(--vkui--font_title3--font_size--regular); + line-height: var(--vkui--font_title3--line_height--regular); + font-family: var(--vkui--font_title3--font_family--regular); + font-weight: var(--vkui--font_title3--font_weight--regular); +} + +.articles-container a, .articles-container a:visited { + color: var(--vkui--color_text_link); +} + +.articles-container a:hover { + color: var(--vkui--color_text_link--hover); +} + +.articles-container a:active { + color: var(--vkui--color_text_link--active); +} + +.articles-container code { + background-color: var(--vkui--color_background_secondary); + border-radius: var(--vkui--size_border_radius--regular); + padding: 4px; +} + +.articles-container pre code { + display: block; + padding: var(--vkui--size_base_padding_horizontal--regular) var(--vkui--size_base_padding_vertical--regular); + margin: var(--vkui--size_label_horizontal_margin--regular) 0; + overflow: auto; +} diff --git a/docs/src/styles/index.css b/docs/src/styles/index.css index 67f2a9970..788a562e9 100644 --- a/docs/src/styles/index.css +++ b/docs/src/styles/index.css @@ -1,5 +1,6 @@ @import 'flex.css'; @import 'space.css'; +@import 'articles.css'; .container { max-width: 1144px; diff --git a/docs/webpack/webpack.client.js b/docs/webpack/webpack.client.mjs similarity index 73% rename from docs/webpack/webpack.client.js rename to docs/webpack/webpack.client.mjs index 21d5ed62c..7fc5e6b41 100644 --- a/docs/webpack/webpack.client.js +++ b/docs/webpack/webpack.client.mjs @@ -1,12 +1,16 @@ -const path = require('path'); -const HtmlWebpackPlugin = require('html-webpack-plugin'); -const WebpackNotifierPlugin = require('webpack-notifier'); -const TerserPlugin = require('terser-webpack-plugin'); -const { CleanWebpackPlugin } = require('clean-webpack-plugin'); -const CopyWebpackPlugin = require('copy-webpack-plugin'); -const webpackConfig = require('./webpack.config'); +import path from 'path'; +import { fileURLToPath } from 'node:url'; + +import HtmlWebpackPlugin from 'html-webpack-plugin'; +import WebpackNotifierPlugin from 'webpack-notifier'; +import TerserPlugin from 'terser-webpack-plugin'; +import { CleanWebpackPlugin } from 'clean-webpack-plugin'; +import CopyWebpackPlugin from 'copy-webpack-plugin'; +import webpackConfig from './webpack.config.mjs'; + +export default function (env, argv) { + const __dirname = path.dirname(fileURLToPath(import.meta.url)); -module.exports = function (env, argv) { const watchMode = argv.liveReload || false; const modeEnv = argv.mode || 'development'; const isProd = modeEnv === 'production'; @@ -44,10 +48,10 @@ module.exports = function (env, argv) { output: { path: path.resolve(__dirname, '../dist'), filename: watchMode ? 'assets/[name].[hash].js' : 'assets/[name].[chunkhash].js', - publicPath: 'auto', + publicPath: '/', }, module: { - rules: [config.modules.ts, config.modules.css, config.modules.svg], + rules: [config.modules.ts, config.modules.css, config.modules.svg, config.modules.md], }, plugins: [ new CleanWebpackPlugin({ diff --git a/docs/webpack/webpack.config.js b/docs/webpack/webpack.config.mjs similarity index 56% rename from docs/webpack/webpack.config.js rename to docs/webpack/webpack.config.mjs index dbc8d438e..a30fc3364 100644 --- a/docs/webpack/webpack.config.js +++ b/docs/webpack/webpack.config.mjs @@ -1,6 +1,11 @@ -const path = require('path'); +import path from 'path'; +import RemarkHTML from 'remark-html'; +import RemarkHightlightJs from 'remark-highlight.js'; +import { fileURLToPath } from 'node:url'; + +export default function () { + const __dirname = path.dirname(fileURLToPath(import.meta.url)); -module.exports = function () { const modules = { ts: { test: /\.ts(x?)$/, @@ -32,6 +37,22 @@ module.exports = function () { }, ], }, + md: { + test: /\.md$/, + use: [ + { + loader: 'html-loader', + }, + { + loader: 'remark-loader', + options: { + remarkOptions: { + plugins: [RemarkHTML], + }, + }, + }, + ], + }, }; const resolve = { diff --git a/package.json b/package.json index e19c655e8..a6bca2d7b 100644 --- a/package.json +++ b/package.json @@ -25,8 +25,8 @@ "clear:dist": "find dist -regex '.*[^d]\\.ts' -delete", "open:coverage": "open .coverage/index.html", "styleguide": "sh ./tasks/styleguide.sh", - "docs:dev": "cd docs/webpack && webpack-dev-server --config webpack.client.js --mode development", - "docs:build": "cd docs/webpack && webpack --config webpack.client.js --mode production", + "docs:dev": "cd docs/webpack && webpack-dev-server --config webpack.client.mjs --mode development", + "docs:build": "cd docs/webpack && webpack --config webpack.client.mjs --mode production", "docs:prepare-data": "ts-node tasks/docs/prepareTokensData.ts", "pre-commit": "lint-staged" }, @@ -81,6 +81,8 @@ "eslint-plugin-sonarjs": "0.24.0", "eslint-plugin-unicorn": "51.0.1", "fs-extra": "11.2.0", + "highlight.js": "11.10.0", + "html-loader": "5.1.0", "html-webpack-plugin": "5.6.0", "husky": "9.1.4", "jest": "29.7.0", @@ -90,9 +92,14 @@ "prettier": "3.3.2", "react": "18.3.1", "react-dom": "18.3.1", + "react-router-dom": "6.26.2", + "remark": "15.0.1", + "remark-html": "16.0.1", + "remark-loader": "6.0.0", "rimraf": "5.0.7", "style-loader": "4.0.0", "terser-webpack-plugin": "5.3.10", + "tree-sitter": "0.21.1", "ts-jest": "29.2.4", "ts-loader": "9.5.1", "ts-morph": "20.0.0", diff --git a/yarn.lock b/yarn.lock index 61abf4543..2160cbfca 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1509,6 +1509,11 @@ resolved "https://registry.yarnpkg.com/@pkgr/core/-/core-0.1.1.tgz#1ec17e2edbec25c8306d424ecfbf13c7de1aaa31" integrity sha512-cq8o4cWH0ibXh9VGi5P20Tu9XF/0fFXl9EUinr9QfTM7a7p0oTA4iJRCQWppXR1Pg8dSM0UCItCkPwsk9qWWYA== +"@remix-run/router@1.19.2": + version "1.19.2" + resolved "https://registry.yarnpkg.com/@remix-run/router/-/router-1.19.2.tgz#0c896535473291cb41f152c180bedd5680a3b273" + integrity sha512-baiMx18+IMuD1yyvOGaHM9QrVUPGGG0jC+z+IPHnRJWUAUvaKuWKyE8gjDj2rzv3sz9zOGoRSPgeBVHRhZnBlA== + "@sinclair/typebox@^0.27.8": version "0.27.8" resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.27.8.tgz#6667fac16c436b5434a387a34dedb013198f6e6e" @@ -1768,6 +1773,13 @@ dependencies: "@types/node" "*" +"@types/debug@^4.0.0": + version "4.1.12" + resolved "https://registry.yarnpkg.com/@types/debug/-/debug-4.1.12.tgz#a155f21690871953410df4b6b6f53187f0500917" + integrity sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ== + dependencies: + "@types/ms" "*" + "@types/eslint-scope@^3.7.3": version "3.7.7" resolved "https://registry.yarnpkg.com/@types/eslint-scope/-/eslint-scope-3.7.7.tgz#3108bd5f18b0cdb277c867b3dd449c9ed7079ac5" @@ -1832,6 +1844,13 @@ dependencies: "@types/node" "*" +"@types/hast@^3.0.0": + version "3.0.4" + resolved "https://registry.yarnpkg.com/@types/hast/-/hast-3.0.4.tgz#1d6b39993b82cea6ad783945b0508c25903e15aa" + integrity sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ== + dependencies: + "@types/unist" "*" + "@types/html-minifier-terser@^6.0.0": version "6.1.0" resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz#4fc33a00c1d0c16987b1a20cf92d20614c55ac35" @@ -1890,6 +1909,13 @@ resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.17.6.tgz#193ced6a40c8006cfc1ca3f4553444fb38f0e543" integrity sha512-OpXEVoCKSS3lQqjx9GGGOapBeuW5eUboYHRlHP9urXPX25IKZ6AnP5ZRxtVf63iieUbsHxLn8NQ5Nlftc6yzAA== +"@types/mdast@^4.0.0": + version "4.0.4" + resolved "https://registry.yarnpkg.com/@types/mdast/-/mdast-4.0.4.tgz#7ccf72edd2f1aa7dd3437e180c64373585804dd6" + integrity sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA== + dependencies: + "@types/unist" "*" + "@types/mime@*": version "3.0.4" resolved "https://registry.yarnpkg.com/@types/mime/-/mime-3.0.4.tgz#2198ac274de6017b44d941e00261d5bc6a0e0a45" @@ -1905,6 +1931,11 @@ resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-5.1.2.tgz#07508b45797cb81ec3f273011b054cd0755eddca" integrity sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA== +"@types/ms@*": + version "0.7.34" + resolved "https://registry.yarnpkg.com/@types/ms/-/ms-0.7.34.tgz#10964ba0dee6ac4cd462e2795b6bebd407303433" + integrity sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g== + "@types/node-forge@^1.3.0": version "1.3.11" resolved "https://registry.yarnpkg.com/@types/node-forge/-/node-forge-1.3.11.tgz#0972ea538ddb0f4d9c2fa0ec5db5724773a604da" @@ -2005,6 +2036,11 @@ resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-2.0.3.tgz#6209321eb2c1712a7e7466422b8cb1fc0d9dd5d8" integrity sha512-9aEbYZ3TbYMznPdcdr3SmIrLXwC/AKZXQeCf9Pgao5CKb8CyHuEX5jzWPTkvregvhRJHcpRO6BFoGW9ycaOkYw== +"@types/unist@*", "@types/unist@^3.0.0": + version "3.0.3" + resolved "https://registry.yarnpkg.com/@types/unist/-/unist-3.0.3.tgz#acaab0f919ce69cce629c2d4ed2eb4adc1b6c20c" + integrity sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q== + "@types/ws@^8.5.10": version "8.5.10" resolved "https://registry.yarnpkg.com/@types/ws/-/ws-8.5.10.tgz#4acfb517970853fa6574a3a6886791d04a396787" @@ -2110,7 +2146,7 @@ "@typescript-eslint/types" "7.0.1" eslint-visitor-keys "^3.4.1" -"@ungap/structured-clone@^1.2.0": +"@ungap/structured-clone@^1.0.0", "@ungap/structured-clone@^1.2.0": version "1.2.0" resolved "https://registry.yarnpkg.com/@ungap/structured-clone/-/structured-clone-1.2.0.tgz#756641adb587851b5ccb3e095daf27ae581c8406" integrity sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ== @@ -2698,6 +2734,11 @@ babel-preset-jest@^29.6.3: babel-plugin-jest-hoist "^29.6.3" babel-preset-current-node-syntax "^1.0.0" +bail@^2.0.0: + version "2.0.2" + resolved "https://registry.yarnpkg.com/bail/-/bail-2.0.2.tgz#d26f5cd8fe5d6f832a31517b9f7c356040ba6d5d" + integrity sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw== + balanced-match@^1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" @@ -2927,6 +2968,11 @@ caniuse-lite@^1.0.30001646: resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001649.tgz#3ec700309ca0da2b0d3d5fb03c411b191761c992" integrity sha512-fJegqZZ0ZX8HOWr6rcafGr72+xcgJKI9oWfDW5DrD7ExUtgZC7a7R7ZYmZqplh7XDocFdGeIFn7roAxhOeYrPQ== +ccount@^2.0.0: + version "2.0.1" + resolved "https://registry.yarnpkg.com/ccount/-/ccount-2.0.1.tgz#17a3bf82302e0870d6da43a01311a8bc02a3ecf5" + integrity sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg== + chalk@^2.4.2: version "2.4.2" resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424" @@ -2954,6 +3000,21 @@ char-regex@^1.0.2: resolved "https://registry.yarnpkg.com/char-regex/-/char-regex-1.0.2.tgz#d744358226217f981ed58f479b1d6bcc29545dcf" integrity sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw== +character-entities-html4@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/character-entities-html4/-/character-entities-html4-2.1.0.tgz#1f1adb940c971a4b22ba39ddca6b618dc6e56b2b" + integrity sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA== + +character-entities-legacy@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/character-entities-legacy/-/character-entities-legacy-3.0.0.tgz#76bc83a90738901d7bc223a9e93759fdd560125b" + integrity sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ== + +character-entities@^2.0.0: + version "2.0.2" + resolved "https://registry.yarnpkg.com/character-entities/-/character-entities-2.0.2.tgz#2d09c2e72cd9523076ccb21157dff66ad43fcc22" + integrity sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ== + chokidar@^3.6.0: version "3.6.0" resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.6.0.tgz#197c6cc669ef2a8dc5e7b4d97ee4e092c3eb0d5b" @@ -2999,7 +3060,7 @@ class-utils@^0.3.5: isobject "^3.0.0" static-extend "^0.1.1" -clean-css@^5.2.2: +clean-css@^5.2.2, clean-css@~5.3.2: version "5.3.3" resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-5.3.3.tgz#b330653cd3bd6b75009cc25c714cae7b93351ccd" integrity sha512-D5J+kHaVb/wKSFcyyV75uCn8fiY4sV38XJoe4CUyGQ+mOU/fMVYUdH1hJC+CJQ5uY3EnW27SbJYS4X8BiLrAFg== @@ -3126,7 +3187,12 @@ colorette@^2.0.10, colorette@^2.0.14, colorette@^2.0.20: resolved "https://registry.yarnpkg.com/colorette/-/colorette-2.0.20.tgz#9eb793e6833067f7235902fcd3b09917a000a95a" integrity sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w== -commander@^10.0.1: +comma-separated-tokens@^2.0.0: + version "2.0.3" + resolved "https://registry.yarnpkg.com/comma-separated-tokens/-/comma-separated-tokens-2.0.3.tgz#4e89c9458acb61bc8fef19f4529973b2392839ee" + integrity sha512-Fu4hJdvzeylCfQPp9SGWidpzrMs7tTrlu6Vb8XGaRGck8QSNZJJp538Wrb60Lax4fPwR64ViY468OIUTbRlGZg== + +commander@^10.0.0, commander@^10.0.1: version "10.0.1" resolved "https://registry.yarnpkg.com/commander/-/commander-10.0.1.tgz#881ee46b4f77d1c1dccc5823433aa39b022cbe06" integrity sha512-y4Mg2tXshplEbSGzx7amzPwKKOCGuoSRP/CjEdwwk0FOGlUbq6lKuoyDZTNZkmxHdJtp54hdfY/JUrdL7Xfdug== @@ -3387,6 +3453,13 @@ debug@^3.2.7: dependencies: ms "^2.1.1" +debug@^4.0.0: + version "4.3.7" + resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.7.tgz#87945b4151a011d76d95a198d7111c865c360a52" + integrity sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ== + dependencies: + ms "^2.1.3" + debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.6: version "4.3.6" resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.6.tgz#2ab2c38fbaffebf8aa95fdfe6d88438c7a13c52b" @@ -3394,6 +3467,13 @@ debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3 dependencies: ms "2.1.2" +decode-named-character-reference@^1.0.0: + version "1.0.2" + resolved "https://registry.yarnpkg.com/decode-named-character-reference/-/decode-named-character-reference-1.0.2.tgz#daabac9690874c394c81e4162a0304b35d824f0e" + integrity sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg== + dependencies: + character-entities "^2.0.0" + decode-uri-component@^0.2.0: version "0.2.2" resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.2.tgz#e69dbe25d37941171dd540e024c444cd5188e1e9" @@ -3502,6 +3582,11 @@ depd@~1.1.2: resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9" integrity sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ== +dequal@^2.0.0: + version "2.0.3" + resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.3.tgz#2644214f1997d39ed0ee0ece72335490a7ac67be" + integrity sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA== + destroy@1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/destroy/-/destroy-1.2.0.tgz#4803735509ad8be552934c67df614f94e66fa015" @@ -3517,6 +3602,13 @@ detect-node@^2.0.4: resolved "https://registry.yarnpkg.com/detect-node/-/detect-node-2.1.0.tgz#c9c70775a49c3d03bc2c06d9a73be550f978f8b1" integrity sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g== +devlop@^1.0.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/devlop/-/devlop-1.1.0.tgz#4db7c2ca4dc6e0e834c30be70c94bbc976dc7018" + integrity sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA== + dependencies: + dequal "^2.0.0" + diff-sequences@^29.6.3: version "29.6.3" resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-29.6.3.tgz#4deaf894d11407c51efc8418012f9e70b84ea921" @@ -4221,6 +4313,11 @@ extend-shallow@^3.0.0, extend-shallow@^3.0.2: assign-symbols "^1.0.0" is-extendable "^1.0.1" +extend@^3.0.0: + version "3.0.2" + resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa" + integrity sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g== + extglob@^2.0.4: version "2.0.4" resolved "https://registry.yarnpkg.com/extglob/-/extglob-2.0.4.tgz#ad00fe4dc612a9232e8718711dc5cb5ab0285543" @@ -4448,6 +4545,13 @@ fresh@0.5.2: resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.5.2.tgz#3d8cadd90d976569fa835ab1f8e4b23a105605a7" integrity sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q== +front-matter@^4.0.2: + version "4.0.2" + resolved "https://registry.yarnpkg.com/front-matter/-/front-matter-4.0.2.tgz#b14e54dc745cfd7293484f3210d15ea4edd7f4d5" + integrity sha512-I8ZuJ/qG92NWX8i5x1Y8qyj3vizhXS31OxjKDu3LKP+7/qBgfIKValiZIEwoVoJKUHlhWtYrktkxV1XsX+pPlg== + dependencies: + js-yaml "^3.13.1" + fs-extra@11.2.0: version "11.2.0" resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-11.2.0.tgz#e70e17dfad64232287d01929399e0ea7c86b0e5b" @@ -4769,11 +4873,49 @@ hasown@^2.0.0, hasown@^2.0.1: dependencies: function-bind "^1.1.2" +hast-util-sanitize@^5.0.0: + version "5.0.1" + resolved "https://registry.yarnpkg.com/hast-util-sanitize/-/hast-util-sanitize-5.0.1.tgz#8e90068cd68e651c569960b77a1b25076579b4cf" + integrity sha512-IGrgWLuip4O2nq5CugXy4GI2V8kx4sFVy5Hd4vF7AR2gxS0N9s7nEAVUyeMtZKZvzrxVsHt73XdTsno1tClIkQ== + dependencies: + "@types/hast" "^3.0.0" + "@ungap/structured-clone" "^1.2.0" + unist-util-position "^5.0.0" + +hast-util-to-html@^9.0.0: + version "9.0.3" + resolved "https://registry.yarnpkg.com/hast-util-to-html/-/hast-util-to-html-9.0.3.tgz#a9999a0ba6b4919576a9105129fead85d37f302b" + integrity sha512-M17uBDzMJ9RPCqLMO92gNNUDuBSq10a25SDBI08iCCxmorf4Yy6sYHK57n9WAbRAAaU+DuR4W6GN9K4DFZesYg== + dependencies: + "@types/hast" "^3.0.0" + "@types/unist" "^3.0.0" + ccount "^2.0.0" + comma-separated-tokens "^2.0.0" + hast-util-whitespace "^3.0.0" + html-void-elements "^3.0.0" + mdast-util-to-hast "^13.0.0" + property-information "^6.0.0" + space-separated-tokens "^2.0.0" + stringify-entities "^4.0.0" + zwitch "^2.0.4" + +hast-util-whitespace@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/hast-util-whitespace/-/hast-util-whitespace-3.0.0.tgz#7778ed9d3c92dd9e8c5c8f648a49c21fc51cb621" + integrity sha512-88JUN06ipLwsnv+dVn+OIYOvAuvBMy/Qoi6O7mQHxdPXpjy+Cd6xRkWwux7DKO+4sYILtLBRIKgsdpS2gQc7qw== + dependencies: + "@types/hast" "^3.0.0" + he@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f" integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw== +highlight.js@11.10.0: + version "11.10.0" + resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-11.10.0.tgz#6e3600dc4b33d6dc23d5bd94fbf72405f5892b92" + integrity sha512-SYVnVFswQER+zu1laSya563s+F8VDGt7o35d4utbamowvUNLLMovFqwCLSocpZTz3MgaSRA1IbqRWZv97dtErQ== + hosted-git-info@^2.1.4: version "2.8.9" resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.8.9.tgz#dffc0bf9a21c02209090f2aa69429e1414daf3f9" @@ -4799,6 +4941,14 @@ html-escaper@^2.0.0: resolved "https://registry.yarnpkg.com/html-escaper/-/html-escaper-2.0.2.tgz#dfd60027da36a36dfcbe236262c00a5822681453" integrity sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg== +html-loader@5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/html-loader/-/html-loader-5.1.0.tgz#85c13e0abc3b5f3aa6e7f664eee6e44d00718d95" + integrity sha512-Jb3xwDbsm0W3qlXrCZwcYqYGnYz55hb6aoKQTlzyZPXsPpi6tHXzAfqalecglMQgNvtEfxrCQPaKT90Irt5XDA== + dependencies: + html-minifier-terser "^7.2.0" + parse5 "^7.1.2" + html-minifier-terser@^6.0.2: version "6.1.0" resolved "https://registry.yarnpkg.com/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz#bfc818934cc07918f6b3669f5774ecdfd48f32ab" @@ -4812,6 +4962,24 @@ html-minifier-terser@^6.0.2: relateurl "^0.2.7" terser "^5.10.0" +html-minifier-terser@^7.2.0: + version "7.2.0" + resolved "https://registry.yarnpkg.com/html-minifier-terser/-/html-minifier-terser-7.2.0.tgz#18752e23a2f0ed4b0f550f217bb41693e975b942" + integrity sha512-tXgn3QfqPIpGl9o+K5tpcj3/MN4SfLtsx2GWwBC3SSd0tXQGyF3gsSqad8loJgKZGM3ZxbYDd5yhiBIdWpmvLA== + dependencies: + camel-case "^4.1.2" + clean-css "~5.3.2" + commander "^10.0.0" + entities "^4.4.0" + param-case "^3.0.4" + relateurl "^0.2.7" + terser "^5.15.1" + +html-void-elements@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/html-void-elements/-/html-void-elements-3.0.0.tgz#fc9dbd84af9e747249034d4d62602def6517f1d7" + integrity sha512-bEqo66MRXsUGxWHV5IP0PUiAWwoEjba4VCzg0LjFJBpchPaTfyfCKTG6bc5F8ucKec3q5y6qOdGyYTSBEvhCrg== + html-webpack-plugin@5.6.0: version "5.6.0" resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-5.6.0.tgz#50a8fa6709245608cb00e811eacecb8e0d7b7ea0" @@ -5218,6 +5386,11 @@ is-plain-obj@^3.0.0: resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-3.0.0.tgz#af6f2ea14ac5a646183a5bbdb5baabbc156ad9d7" integrity sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA== +is-plain-obj@^4.0.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-4.1.0.tgz#d65025edec3657ce032fd7db63c97883eaed71f0" + integrity sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg== + is-plain-object@^2.0.3, is-plain-object@^2.0.4: version "2.0.4" resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-2.0.4.tgz#2c163b3fafb1b606d9d17928f05c2a1c38e07677" @@ -6001,6 +6174,11 @@ log-update@^6.1.0: strip-ansi "^7.1.0" wrap-ansi "^9.0.0" +longest-streak@^3.0.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/longest-streak/-/longest-streak-3.1.0.tgz#62fa67cd958742a1574af9f39866364102d90cd4" + integrity sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g== + loose-envify@^1.1.0: version "1.4.0" resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf" @@ -6065,6 +6243,68 @@ map-visit@^1.0.0: dependencies: object-visit "^1.0.0" +mdast-util-from-markdown@^2.0.0: + version "2.0.1" + resolved "https://registry.yarnpkg.com/mdast-util-from-markdown/-/mdast-util-from-markdown-2.0.1.tgz#32a6e8f512b416e1f51eb817fc64bd867ebcd9cc" + integrity sha512-aJEUyzZ6TzlsX2s5B4Of7lN7EQtAxvtradMMglCQDyaTFgse6CmtmdJ15ElnVRlCg1vpNyVtbem0PWzlNieZsA== + dependencies: + "@types/mdast" "^4.0.0" + "@types/unist" "^3.0.0" + decode-named-character-reference "^1.0.0" + devlop "^1.0.0" + mdast-util-to-string "^4.0.0" + micromark "^4.0.0" + micromark-util-decode-numeric-character-reference "^2.0.0" + micromark-util-decode-string "^2.0.0" + micromark-util-normalize-identifier "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + unist-util-stringify-position "^4.0.0" + +mdast-util-phrasing@^4.0.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/mdast-util-phrasing/-/mdast-util-phrasing-4.1.0.tgz#7cc0a8dec30eaf04b7b1a9661a92adb3382aa6e3" + integrity sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w== + dependencies: + "@types/mdast" "^4.0.0" + unist-util-is "^6.0.0" + +mdast-util-to-hast@^13.0.0: + version "13.2.0" + resolved "https://registry.yarnpkg.com/mdast-util-to-hast/-/mdast-util-to-hast-13.2.0.tgz#5ca58e5b921cc0a3ded1bc02eed79a4fe4fe41f4" + integrity sha512-QGYKEuUsYT9ykKBCMOEDLsU5JRObWQusAolFMeko/tYPufNkRffBAQjIE+99jbA87xv6FgmjLtwjh9wBWajwAA== + dependencies: + "@types/hast" "^3.0.0" + "@types/mdast" "^4.0.0" + "@ungap/structured-clone" "^1.0.0" + devlop "^1.0.0" + micromark-util-sanitize-uri "^2.0.0" + trim-lines "^3.0.0" + unist-util-position "^5.0.0" + unist-util-visit "^5.0.0" + vfile "^6.0.0" + +mdast-util-to-markdown@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/mdast-util-to-markdown/-/mdast-util-to-markdown-2.1.0.tgz#9813f1d6e0cdaac7c244ec8c6dabfdb2102ea2b4" + integrity sha512-SR2VnIEdVNCJbP6y7kVTJgPLifdr8WEU440fQec7qHoHOUz/oJ2jmNRqdDQ3rbiStOXb2mCDGTuwsK5OPUgYlQ== + dependencies: + "@types/mdast" "^4.0.0" + "@types/unist" "^3.0.0" + longest-streak "^3.0.0" + mdast-util-phrasing "^4.0.0" + mdast-util-to-string "^4.0.0" + micromark-util-decode-string "^2.0.0" + unist-util-visit "^5.0.0" + zwitch "^2.0.0" + +mdast-util-to-string@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/mdast-util-to-string/-/mdast-util-to-string-4.0.0.tgz#7a5121475556a04e7eddeb67b264aae79d312814" + integrity sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg== + dependencies: + "@types/mdast" "^4.0.0" + mdn-data@2.0.28: version "2.0.28" resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.28.tgz#5ec48e7bef120654539069e1ae4ddc81ca490eba" @@ -6107,6 +6347,200 @@ methods@~1.1.2: resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee" integrity sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w== +micromark-core-commonmark@^2.0.0: + version "2.0.1" + resolved "https://registry.yarnpkg.com/micromark-core-commonmark/-/micromark-core-commonmark-2.0.1.tgz#9a45510557d068605c6e9a80f282b2bb8581e43d" + integrity sha512-CUQyKr1e///ZODyD1U3xit6zXwy1a8q2a1S1HKtIlmgvurrEpaw/Y9y6KSIbF8P59cn/NjzHyO+Q2fAyYLQrAA== + dependencies: + decode-named-character-reference "^1.0.0" + devlop "^1.0.0" + micromark-factory-destination "^2.0.0" + micromark-factory-label "^2.0.0" + micromark-factory-space "^2.0.0" + micromark-factory-title "^2.0.0" + micromark-factory-whitespace "^2.0.0" + micromark-util-character "^2.0.0" + micromark-util-chunked "^2.0.0" + micromark-util-classify-character "^2.0.0" + micromark-util-html-tag-name "^2.0.0" + micromark-util-normalize-identifier "^2.0.0" + micromark-util-resolve-all "^2.0.0" + micromark-util-subtokenize "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-factory-destination@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-factory-destination/-/micromark-factory-destination-2.0.0.tgz#857c94debd2c873cba34e0445ab26b74f6a6ec07" + integrity sha512-j9DGrQLm/Uhl2tCzcbLhy5kXsgkHUrjJHg4fFAeoMRwJmJerT9aw4FEhIbZStWN8A3qMwOp1uzHr4UL8AInxtA== + dependencies: + micromark-util-character "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-factory-label@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-factory-label/-/micromark-factory-label-2.0.0.tgz#17c5c2e66ce39ad6f4fc4cbf40d972f9096f726a" + integrity sha512-RR3i96ohZGde//4WSe/dJsxOX6vxIg9TimLAS3i4EhBAFx8Sm5SmqVfR8E87DPSR31nEAjZfbt91OMZWcNgdZw== + dependencies: + devlop "^1.0.0" + micromark-util-character "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-factory-space@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-factory-space/-/micromark-factory-space-2.0.0.tgz#5e7afd5929c23b96566d0e1ae018ae4fcf81d030" + integrity sha512-TKr+LIDX2pkBJXFLzpyPyljzYK3MtmllMUMODTQJIUfDGncESaqB90db9IAUcz4AZAJFdd8U9zOp9ty1458rxg== + dependencies: + micromark-util-character "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-factory-title@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-factory-title/-/micromark-factory-title-2.0.0.tgz#726140fc77892af524705d689e1cf06c8a83ea95" + integrity sha512-jY8CSxmpWLOxS+t8W+FG3Xigc0RDQA9bKMY/EwILvsesiRniiVMejYTE4wumNc2f4UbAa4WsHqe3J1QS1sli+A== + dependencies: + micromark-factory-space "^2.0.0" + micromark-util-character "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-factory-whitespace@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-factory-whitespace/-/micromark-factory-whitespace-2.0.0.tgz#9e92eb0f5468083381f923d9653632b3cfb5f763" + integrity sha512-28kbwaBjc5yAI1XadbdPYHX/eDnqaUFVikLwrO7FDnKG7lpgxnvk/XGRhX/PN0mOZ+dBSZ+LgunHS+6tYQAzhA== + dependencies: + micromark-factory-space "^2.0.0" + micromark-util-character "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-util-character@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/micromark-util-character/-/micromark-util-character-2.1.0.tgz#31320ace16b4644316f6bf057531689c71e2aee1" + integrity sha512-KvOVV+X1yLBfs9dCBSopq/+G1PcgT3lAK07mC4BzXi5E7ahzMAF8oIupDDJ6mievI6F+lAATkbQQlQixJfT3aQ== + dependencies: + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-util-chunked@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-chunked/-/micromark-util-chunked-2.0.0.tgz#e51f4db85fb203a79dbfef23fd41b2f03dc2ef89" + integrity sha512-anK8SWmNphkXdaKgz5hJvGa7l00qmcaUQoMYsBwDlSKFKjc6gjGXPDw3FNL3Nbwq5L8gE+RCbGqTw49FK5Qyvg== + dependencies: + micromark-util-symbol "^2.0.0" + +micromark-util-classify-character@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-classify-character/-/micromark-util-classify-character-2.0.0.tgz#8c7537c20d0750b12df31f86e976d1d951165f34" + integrity sha512-S0ze2R9GH+fu41FA7pbSqNWObo/kzwf8rN/+IGlW/4tC6oACOs8B++bh+i9bVyNnwCcuksbFwsBme5OCKXCwIw== + dependencies: + micromark-util-character "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-util-combine-extensions@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-combine-extensions/-/micromark-util-combine-extensions-2.0.0.tgz#75d6ab65c58b7403616db8d6b31315013bfb7ee5" + integrity sha512-vZZio48k7ON0fVS3CUgFatWHoKbbLTK/rT7pzpJ4Bjp5JjkZeasRfrS9wsBdDJK2cJLHMckXZdzPSSr1B8a4oQ== + dependencies: + micromark-util-chunked "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-util-decode-numeric-character-reference@^2.0.0: + version "2.0.1" + resolved "https://registry.yarnpkg.com/micromark-util-decode-numeric-character-reference/-/micromark-util-decode-numeric-character-reference-2.0.1.tgz#2698bbb38f2a9ba6310e359f99fcb2b35a0d2bd5" + integrity sha512-bmkNc7z8Wn6kgjZmVHOX3SowGmVdhYS7yBpMnuMnPzDq/6xwVA604DuOXMZTO1lvq01g+Adfa0pE2UKGlxL1XQ== + dependencies: + micromark-util-symbol "^2.0.0" + +micromark-util-decode-string@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-decode-string/-/micromark-util-decode-string-2.0.0.tgz#7dfa3a63c45aecaa17824e656bcdb01f9737154a" + integrity sha512-r4Sc6leeUTn3P6gk20aFMj2ntPwn6qpDZqWvYmAG6NgvFTIlj4WtrAudLi65qYoaGdXYViXYw2pkmn7QnIFasA== + dependencies: + decode-named-character-reference "^1.0.0" + micromark-util-character "^2.0.0" + micromark-util-decode-numeric-character-reference "^2.0.0" + micromark-util-symbol "^2.0.0" + +micromark-util-encode@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-encode/-/micromark-util-encode-2.0.0.tgz#0921ac7953dc3f1fd281e3d1932decfdb9382ab1" + integrity sha512-pS+ROfCXAGLWCOc8egcBvT0kf27GoWMqtdarNfDcjb6YLuV5cM3ioG45Ys2qOVqeqSbjaKg72vU+Wby3eddPsA== + +micromark-util-html-tag-name@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-html-tag-name/-/micromark-util-html-tag-name-2.0.0.tgz#ae34b01cbe063363847670284c6255bb12138ec4" + integrity sha512-xNn4Pqkj2puRhKdKTm8t1YHC/BAjx6CEwRFXntTaRf/x16aqka6ouVoutm+QdkISTlT7e2zU7U4ZdlDLJd2Mcw== + +micromark-util-normalize-identifier@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-normalize-identifier/-/micromark-util-normalize-identifier-2.0.0.tgz#91f9a4e65fe66cc80c53b35b0254ad67aa431d8b" + integrity sha512-2xhYT0sfo85FMrUPtHcPo2rrp1lwbDEEzpx7jiH2xXJLqBuy4H0GgXk5ToU8IEwoROtXuL8ND0ttVa4rNqYK3w== + dependencies: + micromark-util-symbol "^2.0.0" + +micromark-util-resolve-all@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-resolve-all/-/micromark-util-resolve-all-2.0.0.tgz#189656e7e1a53d0c86a38a652b284a252389f364" + integrity sha512-6KU6qO7DZ7GJkaCgwBNtplXCvGkJToU86ybBAUdavvgsCiG8lSSvYxr9MhwmQ+udpzywHsl4RpGJsYWG1pDOcA== + dependencies: + micromark-util-types "^2.0.0" + +micromark-util-sanitize-uri@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-sanitize-uri/-/micromark-util-sanitize-uri-2.0.0.tgz#ec8fbf0258e9e6d8f13d9e4770f9be64342673de" + integrity sha512-WhYv5UEcZrbAtlsnPuChHUAsu/iBPOVaEVsntLBIdpibO0ddy8OzavZz3iL2xVvBZOpolujSliP65Kq0/7KIYw== + dependencies: + micromark-util-character "^2.0.0" + micromark-util-encode "^2.0.0" + micromark-util-symbol "^2.0.0" + +micromark-util-subtokenize@^2.0.0: + version "2.0.1" + resolved "https://registry.yarnpkg.com/micromark-util-subtokenize/-/micromark-util-subtokenize-2.0.1.tgz#76129c49ac65da6e479c09d0ec4b5f29ec6eace5" + integrity sha512-jZNtiFl/1aY73yS3UGQkutD0UbhTt68qnRpw2Pifmz5wV9h8gOVsN70v+Lq/f1rKaU/W8pxRe8y8Q9FX1AOe1Q== + dependencies: + devlop "^1.0.0" + micromark-util-chunked "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + +micromark-util-symbol@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-symbol/-/micromark-util-symbol-2.0.0.tgz#12225c8f95edf8b17254e47080ce0862d5db8044" + integrity sha512-8JZt9ElZ5kyTnO94muPxIGS8oyElRJaiJO8EzV6ZSyGQ1Is8xwl4Q45qU5UOg+bGH4AikWziz0iN4sFLWs8PGw== + +micromark-util-types@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/micromark-util-types/-/micromark-util-types-2.0.0.tgz#63b4b7ffeb35d3ecf50d1ca20e68fc7caa36d95e" + integrity sha512-oNh6S2WMHWRZrmutsRmDDfkzKtxF+bc2VxLC9dvtrDIRFln627VsFP6fLMgTryGDljgLPjkrzQSDcPrjPyDJ5w== + +micromark@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/micromark/-/micromark-4.0.0.tgz#84746a249ebd904d9658cfabc1e8e5f32cbc6249" + integrity sha512-o/sd0nMof8kYff+TqcDx3VSrgBTcZpSvYcAHIfHhv5VAuNmisCxjhx6YmxS8PFEpb9z5WKWKPdzf0jM23ro3RQ== + dependencies: + "@types/debug" "^4.0.0" + debug "^4.0.0" + decode-named-character-reference "^1.0.0" + devlop "^1.0.0" + micromark-core-commonmark "^2.0.0" + micromark-factory-space "^2.0.0" + micromark-util-character "^2.0.0" + micromark-util-chunked "^2.0.0" + micromark-util-combine-extensions "^2.0.0" + micromark-util-decode-numeric-character-reference "^2.0.0" + micromark-util-encode "^2.0.0" + micromark-util-normalize-identifier "^2.0.0" + micromark-util-resolve-all "^2.0.0" + micromark-util-sanitize-uri "^2.0.0" + micromark-util-subtokenize "^2.0.0" + micromark-util-symbol "^2.0.0" + micromark-util-types "^2.0.0" + micromatch@^3.1.10: version "3.1.10" resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-3.1.10.tgz#70859bc95c9840952f359a068a3fc49f9ecfac23" @@ -6247,7 +6681,7 @@ ms@2.1.2: resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009" integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w== -ms@2.1.3, ms@^2.1.1: +ms@2.1.3, ms@^2.1.1, ms@^2.1.3: version "2.1.3" resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2" integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA== @@ -6305,11 +6739,21 @@ no-case@^3.0.4: lower-case "^2.0.2" tslib "^2.0.3" +node-addon-api@^8.0.0: + version "8.1.0" + resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-8.1.0.tgz#55a573685dd4bd053f189cffa4e6332d2b1f1645" + integrity sha512-yBY+qqWSv3dWKGODD6OGE6GnTX7Q2r+4+DfpqxHSHh8x0B4EKP9+wVGLS6U/AM1vxSNNmUEuIV5EGhYwPpfOwQ== + node-forge@^1: version "1.3.1" resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-1.3.1.tgz#be8da2af243b2417d5f646a770663a92b7e9ded3" integrity sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA== +node-gyp-build@^4.8.0: + version "4.8.2" + resolved "https://registry.yarnpkg.com/node-gyp-build/-/node-gyp-build-4.8.2.tgz#4f802b71c1ab2ca16af830e6c1ea7dd1ad9496fa" + integrity sha512-IRUxE4BVsHWXkV/SFOut4qTlagw2aM8T5/vnTsmrHJvVoKueJHRc/JaFND7QDDc61kLYUJ6qlZM3sqTSyx2dTw== + node-int64@^0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/node-int64/-/node-int64-0.4.0.tgz#87a9065cdb355d3182d8f94ce11188b825c68a3b" @@ -6603,6 +7047,13 @@ parse-json@^5.0.0, parse-json@^5.2.0: json-parse-even-better-errors "^2.3.0" lines-and-columns "^1.1.6" +parse5@^7.1.2: + version "7.1.2" + resolved "https://registry.yarnpkg.com/parse5/-/parse5-7.1.2.tgz#0736bebbfd77793823240a23b7fc5e010b7f8e32" + integrity sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw== + dependencies: + entities "^4.4.0" + parseurl@~1.3.2, parseurl@~1.3.3: version "1.3.3" resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4" @@ -6869,6 +7320,11 @@ prompts@^2.0.1: kleur "^3.0.3" sisteransi "^1.0.5" +property-information@^6.0.0: + version "6.5.0" + resolved "https://registry.yarnpkg.com/property-information/-/property-information-6.5.0.tgz#6212fbb52ba757e92ef4fb9d657563b933b7ffec" + integrity sha512-PgTgs/BlvHxOu8QuEN7wi5A0OmXaBcHpmCSTehcs6Uuu9IkDIEo13Hy7n898RHfrQ49vKCoGeWZSaAK01nwVig== + proxy-addr@~2.0.7: version "2.0.7" resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-2.0.7.tgz#f19fe69ceab311eeb94b42e70e8c2070f9ba1025" @@ -6934,6 +7390,21 @@ react-is@^18.0.0: resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b" integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w== +react-router-dom@6.26.2: + version "6.26.2" + resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.26.2.tgz#a6e3b0cbd6bfd508e42b9342099d015a0ac59680" + integrity sha512-z7YkaEW0Dy35T3/QKPYB1LjMK2R1fxnHO8kWpUMTBdfVzZrWOiY9a7CtN8HqdWtDUWd5FY6Dl8HFsqVwH4uOtQ== + dependencies: + "@remix-run/router" "1.19.2" + react-router "6.26.2" + +react-router@6.26.2: + version "6.26.2" + resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.26.2.tgz#2f0a68999168954431cdc29dd36cec3b6fa44a7e" + integrity sha512-tvN1iuT03kHgOFnLPfLJ8V95eijteveqdOSk+srqfePtQvqCExB8eHOYnlilbOcyJyKnYkr1vJvf7YqotAJu1A== + dependencies: + "@remix-run/router" "1.19.2" + react@18.3.1: version "18.3.1" resolved "https://registry.yarnpkg.com/react/-/react-18.3.1.tgz#49ab892009c53933625bd16b2533fc754cab2891" @@ -7079,6 +7550,53 @@ relateurl@^0.2.7: resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9" integrity sha512-G08Dxvm4iDN3MLM0EsP62EDV9IuhXPR6blNz6Utcp7zyV3tr4HVNINt6MpaRWbxoOHT3Q7YN2P+jaHX8vUbgog== +remark-html@16.0.1: + version "16.0.1" + resolved "https://registry.yarnpkg.com/remark-html/-/remark-html-16.0.1.tgz#9246d0cf22254c208a86531cbeb26203ae2dd34c" + integrity sha512-B9JqA5i0qZe0Nsf49q3OXyGvyXuZFDzAP2iOFLEumymuYJITVpiH1IgsTEwTpdptDmZlMDMWeDmSawdaJIGCXQ== + dependencies: + "@types/mdast" "^4.0.0" + hast-util-sanitize "^5.0.0" + hast-util-to-html "^9.0.0" + mdast-util-to-hast "^13.0.0" + unified "^11.0.0" + +remark-loader@6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/remark-loader/-/remark-loader-6.0.0.tgz#08fe5524576770aad4ad6b4632c022b0c5beb969" + integrity sha512-3Z4WLyVYbI1F6TQNnA9/iuHsoRcu8ruH2ABixLpgSWiSiYdNgURgLdpbdze8jTm2+VWWcAq9xIH7maWSpi2sSw== + dependencies: + front-matter "^4.0.2" + +remark-parse@^11.0.0: + version "11.0.0" + resolved "https://registry.yarnpkg.com/remark-parse/-/remark-parse-11.0.0.tgz#aa60743fcb37ebf6b069204eb4da304e40db45a1" + integrity sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA== + dependencies: + "@types/mdast" "^4.0.0" + mdast-util-from-markdown "^2.0.0" + micromark-util-types "^2.0.0" + unified "^11.0.0" + +remark-stringify@^11.0.0: + version "11.0.0" + resolved "https://registry.yarnpkg.com/remark-stringify/-/remark-stringify-11.0.0.tgz#4c5b01dd711c269df1aaae11743eb7e2e7636fd3" + integrity sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw== + dependencies: + "@types/mdast" "^4.0.0" + mdast-util-to-markdown "^2.0.0" + unified "^11.0.0" + +remark@15.0.1: + version "15.0.1" + resolved "https://registry.yarnpkg.com/remark/-/remark-15.0.1.tgz#ac7e7563260513b66426bc47f850e7aa5862c37c" + integrity sha512-Eht5w30ruCXgFmxVUSlNWQ9iiimq07URKeFS3hNc8cUWy1llX4KDWfyEDZRycMc+znsN9Ux5/tJ/BFdgdOwA3A== + dependencies: + "@types/mdast" "^4.0.0" + remark-parse "^11.0.0" + remark-stringify "^11.0.0" + unified "^11.0.0" + renderkid@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/renderkid/-/renderkid-3.0.0.tgz#5fd823e4d6951d37358ecc9a58b1f06836b6268a" @@ -7595,6 +8113,11 @@ source-map@^0.7.4: resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.4.tgz#a9bbe705c9d8846f4e08ff6765acf0f1b0898656" integrity sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA== +space-separated-tokens@^2.0.0: + version "2.0.2" + resolved "https://registry.yarnpkg.com/space-separated-tokens/-/space-separated-tokens-2.0.2.tgz#1ecd9d2350a3844572c3f4a312bceb018348859f" + integrity sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q== + spdx-correct@^3.0.0: version "3.2.0" resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.2.0.tgz#4f5ab0668f0059e34f9c00dce331784a12de4e9c" @@ -7694,16 +8217,7 @@ string-length@^4.0.1: char-regex "^1.0.2" strip-ansi "^6.0.0" -"string-width-cjs@npm:string-width@^4.2.0": - version "4.2.3" - resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" - integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== - dependencies: - emoji-regex "^8.0.0" - is-fullwidth-code-point "^3.0.0" - strip-ansi "^6.0.1" - -string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: +"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -7771,14 +8285,15 @@ string_decoder@~1.1.1: dependencies: safe-buffer "~5.1.0" -"strip-ansi-cjs@npm:strip-ansi@^6.0.1": - version "6.0.1" - resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" - integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== +stringify-entities@^4.0.0: + version "4.0.4" + resolved "https://registry.yarnpkg.com/stringify-entities/-/stringify-entities-4.0.4.tgz#b3b79ef5f277cc4ac73caeb0236c5ba939b3a4f3" + integrity sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg== dependencies: - ansi-regex "^5.0.1" + character-entities-html4 "^2.0.0" + character-entities-legacy "^3.0.0" -strip-ansi@^6.0.0, strip-ansi@^6.0.1: +"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== @@ -7907,6 +8422,16 @@ terser@^5.10.0, terser@^5.26.0: commander "^2.20.0" source-map-support "~0.5.20" +terser@^5.15.1: + version "5.33.0" + resolved "https://registry.yarnpkg.com/terser/-/terser-5.33.0.tgz#8f9149538c7468ffcb1246cfec603c16720d2db1" + integrity sha512-JuPVaB7s1gdFKPKTelwUyRq5Sid2A3Gko2S0PncwdBq7kN9Ti9HPWDQ06MPsEDGsZeVESjKEnyGy68quBk1w6g== + dependencies: + "@jridgewell/source-map" "^0.3.3" + acorn "^8.8.2" + commander "^2.20.0" + source-map-support "~0.5.20" + test-exclude@^6.0.0: version "6.0.0" resolved "https://registry.yarnpkg.com/test-exclude/-/test-exclude-6.0.0.tgz#04a8698661d805ea6fa293b6cb9e63ac044ef15e" @@ -7973,6 +8498,24 @@ toidentifier@1.0.1: resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.1.tgz#3be34321a88a820ed1bd80dfaa33e479fbb8dd35" integrity sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA== +tree-sitter@0.21.1: + version "0.21.1" + resolved "https://registry.yarnpkg.com/tree-sitter/-/tree-sitter-0.21.1.tgz#fbb34c09056700814af0e1e37688e06463ba04c4" + integrity sha512-7dxoA6kYvtgWw80265MyqJlkRl4yawIjO7S5MigytjELkX43fV2WsAXzsNfO7sBpPPCF5Gp0+XzHk0DwLCq3xQ== + dependencies: + node-addon-api "^8.0.0" + node-gyp-build "^4.8.0" + +trim-lines@^3.0.0: + version "3.0.1" + resolved "https://registry.yarnpkg.com/trim-lines/-/trim-lines-3.0.1.tgz#d802e332a07df861c48802c04321017b1bd87338" + integrity sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg== + +trough@^2.0.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/trough/-/trough-2.2.0.tgz#94a60bd6bd375c152c1df911a4b11d5b0256f50f" + integrity sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw== + ts-api-utils@^1.0.1: version "1.2.1" resolved "https://registry.yarnpkg.com/ts-api-utils/-/ts-api-utils-1.2.1.tgz#f716c7e027494629485b21c0df6180f4d08f5e8b" @@ -8203,6 +8746,19 @@ unicorn-magic@^0.1.0: resolved "https://registry.yarnpkg.com/unicorn-magic/-/unicorn-magic-0.1.0.tgz#1bb9a51c823aaf9d73a8bfcd3d1a23dde94b0ce4" integrity sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ== +unified@^11.0.0: + version "11.0.5" + resolved "https://registry.yarnpkg.com/unified/-/unified-11.0.5.tgz#f66677610a5c0a9ee90cab2b8d4d66037026d9e1" + integrity sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA== + dependencies: + "@types/unist" "^3.0.0" + bail "^2.0.0" + devlop "^1.0.0" + extend "^3.0.0" + is-plain-obj "^4.0.0" + trough "^2.0.0" + vfile "^6.0.0" + union-value@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/union-value/-/union-value-1.0.1.tgz#0b6fe7b835aecda61c6ea4d4f02c14221e109847" @@ -8213,6 +8769,44 @@ union-value@^1.0.0: is-extendable "^0.1.1" set-value "^2.0.1" +unist-util-is@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/unist-util-is/-/unist-util-is-6.0.0.tgz#b775956486aff107a9ded971d996c173374be424" + integrity sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw== + dependencies: + "@types/unist" "^3.0.0" + +unist-util-position@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/unist-util-position/-/unist-util-position-5.0.0.tgz#678f20ab5ca1207a97d7ea8a388373c9cf896be4" + integrity sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA== + dependencies: + "@types/unist" "^3.0.0" + +unist-util-stringify-position@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/unist-util-stringify-position/-/unist-util-stringify-position-4.0.0.tgz#449c6e21a880e0855bf5aabadeb3a740314abac2" + integrity sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ== + dependencies: + "@types/unist" "^3.0.0" + +unist-util-visit-parents@^6.0.0: + version "6.0.1" + resolved "https://registry.yarnpkg.com/unist-util-visit-parents/-/unist-util-visit-parents-6.0.1.tgz#4d5f85755c3b8f0dc69e21eca5d6d82d22162815" + integrity sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw== + dependencies: + "@types/unist" "^3.0.0" + unist-util-is "^6.0.0" + +unist-util-visit@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-5.0.0.tgz#a7de1f31f72ffd3519ea71814cccf5fd6a9217d6" + integrity sha512-MR04uvD+07cwl/yhVuVWAtw+3GOR/knlL55Nd/wAdblk27GCVt3lqpTivy/tkJcZoNPzTwS1Y+KMojlLDhoTzg== + dependencies: + "@types/unist" "^3.0.0" + unist-util-is "^6.0.0" + unist-util-visit-parents "^6.0.0" + universalify@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/universalify/-/universalify-2.0.1.tgz#168efc2180964e6386d061e094df61afe239b18d" @@ -8311,6 +8905,22 @@ vary@~1.1.2: resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc" integrity sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg== +vfile-message@^4.0.0: + version "4.0.2" + resolved "https://registry.yarnpkg.com/vfile-message/-/vfile-message-4.0.2.tgz#c883c9f677c72c166362fd635f21fc165a7d1181" + integrity sha512-jRDZ1IMLttGj41KcZvlrYAaI3CfqpLpfpf+Mfig13viT6NKvRzWZ+lXz0Y5D60w6uJIBAOGq9mSHf0gktF0duw== + dependencies: + "@types/unist" "^3.0.0" + unist-util-stringify-position "^4.0.0" + +vfile@^6.0.0: + version "6.0.3" + resolved "https://registry.yarnpkg.com/vfile/-/vfile-6.0.3.tgz#3652ab1c496531852bf55a6bac57af981ebc38ab" + integrity sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q== + dependencies: + "@types/unist" "^3.0.0" + vfile-message "^4.0.0" + walker@^1.0.8: version "1.0.8" resolved "https://registry.yarnpkg.com/walker/-/walker-1.0.8.tgz#bd498db477afe573dc04185f011d3ab8a8d7653f" @@ -8500,16 +9110,7 @@ wildcard@^2.0.0: resolved "https://registry.yarnpkg.com/wildcard/-/wildcard-2.0.1.tgz#5ab10d02487198954836b6349f74fff961e10f67" integrity sha512-CC1bOL87PIWSBhDcTrdeLo6eGT7mCFtrg0uIJtqJUFyK+eJnzl8A1niH56uu7KMa5XFrtiV+AQuHO3n7DsHnLQ== -"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0": - version "7.0.0" - resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" - integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== - dependencies: - ansi-styles "^4.0.0" - string-width "^4.1.0" - strip-ansi "^6.0.0" - -wrap-ansi@^7.0.0: +"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== @@ -8611,3 +9212,8 @@ yocto-queue@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-1.0.0.tgz#7f816433fb2cbc511ec8bf7d263c3b58a1a3c251" integrity sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g== + +zwitch@^2.0.0, zwitch@^2.0.4: + version "2.0.4" + resolved "https://registry.yarnpkg.com/zwitch/-/zwitch-2.0.4.tgz#c827d4b0acb76fc3e685a4c6ec2902d51070e9d7" + integrity sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A== From f69db4ae33d8a98fb747796d6c5b4b2574abda23 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Wed, 25 Sep 2024 18:14:31 +0300 Subject: [PATCH 20/36] feat/tokenized-gradients: add tokens doc article layout --- docs/src/App.tsx | 36 ++++++++++---- docs/src/articles/NewTheme.md | 4 +- docs/src/articles/TokenHelpers.md | 1 + .../layouts/shared/AsideMenu/AsideMenu.tsx | 48 +++++++++++++++++++ docs/src/pages/Articles.tsx | 14 +++++- docs/src/styles/articles.css | 40 ++++++++++++++-- docs/webpack/webpack.config.mjs | 1 - 7 files changed, 128 insertions(+), 16 deletions(-) create mode 100644 docs/src/articles/TokenHelpers.md create mode 100644 docs/src/components/layouts/shared/AsideMenu/AsideMenu.tsx diff --git a/docs/src/App.tsx b/docs/src/App.tsx index ed85d2d66..b80ff206a 100644 --- a/docs/src/App.tsx +++ b/docs/src/App.tsx @@ -12,13 +12,26 @@ import Tokens from '@/pages/Tokens'; import { Articles } from './pages/Articles'; import articleNewTheme from "./articles/NewTheme.md"; +import articleTokenHelpers from "./articles/TokenHelpers.md"; -function articleRoute(slug: string, contents?: string) { - return { - path: `/articles/${slug}`, - element: - }; -} +const articles = [ + { + title: "Темы", + }, + { + slug: "new-theme", + title: "Создание новой темы для проекта", + contents: articleNewTheme, + }, + { + title: "Токены", + }, + { + slug: "token-helpers", + title: "Хелпер-функции", + contents: articleTokenHelpers, + }, +]; const router = createBrowserRouter([ { @@ -27,9 +40,16 @@ const router = createBrowserRouter([ }, { path: "/articles", - element: + element: }, - articleRoute("new-theme", articleNewTheme), + ...articles + .filter((article) => !!article.slug) + .map((article) => ( + { + path: `/articles/${article.slug}`, + element: + } + )), ]); const App: FC = () => ( diff --git a/docs/src/articles/NewTheme.md b/docs/src/articles/NewTheme.md index cb81e45d5..c542dc25e 100644 --- a/docs/src/articles/NewTheme.md +++ b/docs/src/articles/NewTheme.md @@ -1,4 +1,4 @@ -# Создание новой темы для вашего проекта +# Создание новой темы для проекта Если вы хотите использовать токены VKUI не только в связке с основной библиотекой, но и в произвольной вёрстке, у вас может возникнуть потребность расширения стандартного набора. @@ -14,7 +14,7 @@ Прежде, чем заводить свою тему, вам нужно ответить для себя на следующий вопрос: -_Какая из базовых тем будет являться основной для вашего проекта?_ +### Какая из базовых тем будет являться основной для вашего проекта? Выбор базовой темы влияет на внешний вид вашего проекта в тех местах, которые вы не поправите в своей теме. diff --git a/docs/src/articles/TokenHelpers.md b/docs/src/articles/TokenHelpers.md new file mode 100644 index 000000000..255ff3e29 --- /dev/null +++ b/docs/src/articles/TokenHelpers.md @@ -0,0 +1 @@ +# Хелпер-функции для токенов \ No newline at end of file diff --git a/docs/src/components/layouts/shared/AsideMenu/AsideMenu.tsx b/docs/src/components/layouts/shared/AsideMenu/AsideMenu.tsx new file mode 100644 index 000000000..504e8257a --- /dev/null +++ b/docs/src/components/layouts/shared/AsideMenu/AsideMenu.tsx @@ -0,0 +1,48 @@ +import { Card, Spacing, Title } from '@vkontakte/vkui'; +import * as React from 'react'; +import { Link } from 'react-router-dom'; + +export interface AsideMenuItem { + slug?: string; + title: string; +} + +export interface AsideMenuProps { + items?: AsideMenuItem[]; +} + +const defaultItems: AsideMenuItem[] = []; + +export function AsideMenu(props: AsideMenuProps) { + const items = props.items ?? defaultItems; + + return ( + + ); +} diff --git a/docs/src/pages/Articles.tsx b/docs/src/pages/Articles.tsx index d26fd1410..a58860fab 100644 --- a/docs/src/pages/Articles.tsx +++ b/docs/src/pages/Articles.tsx @@ -3,11 +3,14 @@ import hljs from 'highlight.js/lib/core'; import typescript from 'highlight.js/lib/languages/typescript'; import css from 'highlight.js/lib/languages/css'; import 'highlight.js/styles/github.css'; +import { AsideMenu, AsideMenuItem } from '@/components/layouts/shared/AsideMenu/AsideMenu'; +import { Spacing, useAdaptivityWithJSMediaQueries } from '@vkontakte/vkui'; hljs.registerLanguage('typescript', typescript); hljs.registerLanguage('css', css); export interface ArticlesProps { + items?: AsideMenuItem[]; contentsHtml?: string; } @@ -15,6 +18,9 @@ export function Articles(props: ArticlesProps) { let articleContent = props.contentsHtml ?? ''; const ref = React.useRef(undefined); + const { viewWidth } = useAdaptivityWithJSMediaQueries(); + const isMobile = viewWidth <= 3; + React.useEffect(() => { if (!ref.current) { return; @@ -36,7 +42,13 @@ export function Articles(props: ArticlesProps) { }, [ref.current]); return ( -
+
+ + + {isMobile && ( + + )} +
Date: Wed, 25 Sep 2024 20:05:58 +0300 Subject: [PATCH 21/36] feat/tokenized-gradients: add language toggler --- docs/src/articles/TokenHelpers.md | 207 +++++++++++++++++++++++++++++- docs/src/pages/Articles.tsx | 115 ++++++++++++++++- docs/src/styles/articles.css | 33 +++++ src/build/helpers/tokenHelpers.ts | 16 ++- 4 files changed, 368 insertions(+), 3 deletions(-) diff --git a/docs/src/articles/TokenHelpers.md b/docs/src/articles/TokenHelpers.md index 255ff3e29..bbfd08e6e 100644 --- a/docs/src/articles/TokenHelpers.md +++ b/docs/src/articles/TokenHelpers.md @@ -1 +1,206 @@ -# Хелпер-функции для токенов \ No newline at end of file +# Хелпер-функции для токенов +Значения токенов бывают разные. Большинство токенов можно выразить либо числом (размеры), либо строкой (цвета, шрифты и прочее). + +Но иногда для правильной записи значений базовых типов недостаточно. Бывавет так, что в значении токена нужно сослаться +на другой токен, или сгенерировать значение токена по набору правил. + +Для этих целей в пакете `@vkontakte/vkui-tokens` предусмотрены **функции-хелперы**. Они выполняются на этапе +сборки темы и позволяют управлять тем, какие значения попадут в итоговые файлы. + +  + +## `alias` +Функция выполняет подстановку значения другого токена. + +Будьте осторожны с указанием токенов, которые сами являются ссылками. +Неправильно указанный токен может привезти к переполнению стека и крешу сборки! + +### Интерфейс +```typescript +function alias(token: string): TokenFunction; +``` + +### Параметры +* **token** — Имя токена. Можно использовать токены из текущей темы либо из всех тем, от которой наследуется текущая. + +### Пример +Исходный файл темы: + +```typescript +import { ParadigmThemeDescription } from '@/interfaces/namespaces/paradigm'; +import { lightTheme } from '@/themeDescriptions/base/paradigm'; +import { alias } from '@/build/helpers/tokenHelpers'; + +export const myCustomTheme: ParadigmThemeDescription = { + ...lightTheme, + sizeArrow: alias('sizeArrowPromo'), + sizeArrowPromo: { + regular: 8, + }, +}; +``` + +Итоговый файл с темой: + +```css +:root { + /* ... */ + --vkui--size_arrow--regular: 8px; + --vkui--size_arrow_promo--regular: 8px; + /* ... */ +} +``` + +  + +## `namedAlias` +Функция создаёт именованый алиас — runtime-ссылку на другой токен темы выполняет подстановку +fallback-значения этого токена. + +Будьте осторожны с указанием токенов, которые сами являются ссылками. +Неправильно указанный токен может привезти к переполнению стека и крешу сборки! + +### Интерфейс +```typescript +function namedAlias(token: string): NamedTokenFunction +``` + +### Параметры +* **token** — Имя токена. Можно использовать токены из текущей темы либо из всех тем, от которой наследуется текущая. + +### Пример +Исходный файл темы: + +```typescript +import { ParadigmThemeDescription } from '@/interfaces/namespaces/paradigm'; +import { lightTheme } from '@/themeDescriptions/base/paradigm'; +import { namedAlias } from '@/build/helpers/tokenHelpers'; + +export const myCustomTheme: ParadigmThemeDescription = { + ...lightTheme, + sizeArrow: namedAlias('sizeArrowPromo'), + sizeArrowPromo: { + regular: 8, + }, +}; +``` + +Итоговый файл с темой: + +```css +:root { + /* ... */ + --vkui--size_arrow--regular: var(--vkui--size_arrow_promo--regular, 8px); + --vkui--size_arrow_promo--regular: 8px; + /* ... */ +} +``` + +  + +## `staticRef` +Функция создаёт runtime-ссылку на другой токен темы. + +### Интерфейс +```typescript +function staticRef(value: Token): T; +``` + +### Параметры +* **token** — Имя токена. Можно использовать любые токены, которые находятся в контексте страницы. + +### Пример +Исходный файл темы: + +```typescript +import { ParadigmThemeDescription } from '@/interfaces/namespaces/paradigm'; +import { lightTheme } from '@/themeDescriptions/base/paradigm'; +import { staticRef } from '@/build/helpers/tokenHelpers'; + +export const myCustomTheme: ParadigmThemeDescription = { + ...lightTheme, + sizeArrow: staticRef('sizeArrowPromo'), + sizeArrowPromo: { + regular: 8, + }, +}; +``` + +Итоговый файл с темой: + +```css +:root { + /* ... */ + --vkui--size_arrow--regular: var(--vkui--size_arrow_promo--regular); + --vkui--size_arrow_promo--regular: 8px; + /* ... */ +} +``` + +  + +## `gradient` +Функция создаёт градиент из одного или нескольких цветов. + +Если передан один цвет, система сборки сгенериурет градиент из указанного цвета в прозрачный. При этом +градиент будет построен по точкам, указанным в файле `opacityMap.json`. + +Если передано два и более цветов, будет сгенерирован градиент между этими цветами с равномерной расстановкой точек. + +### Интерфейс +```typescript +export function gradient ( + ...stops: (Property.Color | NamedTokenFunction)[] +): TokenFunction; +``` + +### Параметры +* **stops** — Список точек градиента. Можно использовать цвета в строковом формате (rgba, hex) и именованые + алиасы, созданные с помощью хелпера `namedAlias`. + +### Пример +Исходный файл темы: + +```typescript +import { ParadigmThemeDescription } from '@/interfaces/namespaces/paradigm'; +import { lightTheme } from '@/themeDescriptions/base/paradigm'; +import { gradient, namedAlias } from '@/build/helpers/tokenHelpers'; + +export const myCustomTheme: ParadigmThemeDescription = { + ...lightTheme, + colorIconPrimary: 'rgba(64, 64, 64, 1)', + gradient: gradient(namedAlias('colorIconPrimary'), 'rgba(32, 32, 32, 1)'), +}; +``` + +Итоговый файл с темой: + +```css +:root { + /* ... */ + --vkui--color_icon_primary: rgba(64, 64, 64, 1); + --vkui--gradient: var(--vkui--color_icon_primary, rgba(64, 64, 64, 1)) 0%, rgba(32, 32, 32, 1) 100%; + /* ... */ +} +``` + +```json +{ + "gradient": { + "gradient": [ + { + "color": "rgba(64, 64, 64, 1)", + "token": "colorIconPrimary" + }, + { + "color": "rgba(32, 32, 32, 1)" + } + ] + }, + "other": { + "colorIconPrimary": { + "normal": "rgba(64, 64, 64, 1)" + } + } +} +``` \ No newline at end of file diff --git a/docs/src/pages/Articles.tsx b/docs/src/pages/Articles.tsx index a58860fab..998dde050 100644 --- a/docs/src/pages/Articles.tsx +++ b/docs/src/pages/Articles.tsx @@ -2,18 +2,116 @@ import * as React from 'react'; import hljs from 'highlight.js/lib/core'; import typescript from 'highlight.js/lib/languages/typescript'; import css from 'highlight.js/lib/languages/css'; +import json from 'highlight.js/lib/languages/json'; import 'highlight.js/styles/github.css'; + import { AsideMenu, AsideMenuItem } from '@/components/layouts/shared/AsideMenu/AsideMenu'; import { Spacing, useAdaptivityWithJSMediaQueries } from '@vkontakte/vkui'; hljs.registerLanguage('typescript', typescript); hljs.registerLanguage('css', css); +hljs.registerLanguage('json', json); export interface ArticlesProps { items?: AsideMenuItem[]; contentsHtml?: string; } +function forEachCodeBlock(parent: HTMLElement, callback: (codeBlock: HTMLElement, language: string) => void) { + for (let i = 0; i < parent.children.length; i++) { + const element = parent.children[i]; + const codeBlock = element.querySelector('code'); + + if (!codeBlock) { + continue; + } + + for (let j = 0; j < codeBlock.classList.length; j++) { + const className = codeBlock.classList[j]; + + if (className.startsWith('language-')) { + const language = className.slice('language-'.length); + + callback(codeBlock, language); + break; + } + } + } +} + +function switchLanguage(parent: HTMLElement, language: string) { + const allLanguageEls = parent.querySelectorAll('[data-language]'); + + for (let i = 0; i < allLanguageEls.length; i++) { + const element = allLanguageEls[i]; + + if (element.getAttribute('data-language') === language) { + element.classList.add('code-tab-selected'); + } else { + element.classList.remove('code-tab-selected'); + } + } +} + +function handleTogglerClick(event: MouseEvent) { + const language = (event.target as HTMLElement).getAttribute('data-language'); + + if (language) { + switchLanguage((event.target as HTMLElement).parentElement.parentElement, language); + } +} + +function makeLanguageToggler(...elements: HTMLElement[]) { + if (!elements.length) { + return; + } + + const parentDiv = document.createElement('DIV'); + + elements[0].parentElement.replaceChild(parentDiv, elements[0]); + + for (const element of elements) { + parentDiv.appendChild(element); + } + + const languageToggler = document.createElement('DIV'); + parentDiv.insertBefore(languageToggler, parentDiv.firstChild); + + let firstLanguage: string; + + forEachCodeBlock(parentDiv, (codeBlock, language) => { + if (!firstLanguage) { + firstLanguage = language; + } + + codeBlock.setAttribute('data-language', language); + + const codeParent = codeBlock.parentElement; + codeParent.classList.add('code-tab'); + + const languageButton = document.createElement('button'); + languageButton.innerText = language; + languageButton.classList.add('code-tab_button'); + languageButton.setAttribute('data-language', language); + + languageToggler.appendChild(languageButton); + }); + + languageToggler.addEventListener('click', handleTogglerClick); + + switchLanguage(parentDiv, firstLanguage); +} + +function findChildIndex(element: HTMLElement): number { + for (let i = 0; i < element.parentElement.children.length; i++) { + if (element.parentElement.children[i] === element) { + return i; + } + } + + return -1; +} + export function Articles(props: ArticlesProps) { let articleContent = props.contentsHtml ?? ''; const ref = React.useRef(undefined); @@ -26,11 +124,26 @@ export function Articles(props: ArticlesProps) { return; } - const codeBlocks = ref.current.querySelectorAll("code.language-typescript, code.language-css"); + const codeSelector = 'code.language-typescript, code.language-css, code.language-json'; + + const codeBlocks = ref.current.querySelectorAll(codeSelector); for (let i = 0; i < codeBlocks.length; i++) { const codeBlock = codeBlocks[i] as HTMLElement; + const codeParent = codeBlock.parentElement; + const codeParentIndex = findChildIndex(codeParent); + codeBlock.innerHTML = hljs.highlightAuto(codeBlock.innerText).value; + + const prevCodeParent = codeParent.parentElement.children[codeParentIndex - 1] as HTMLElement; + + if (prevCodeParent) { + const prevCodeBlock = prevCodeParent.querySelector(codeSelector) as HTMLElement; + + if (prevCodeBlock) { + makeLanguageToggler(prevCodeParent, codeParent); + } + } } const links = ref.current.querySelectorAll("a[href]"); diff --git a/docs/src/styles/articles.css b/docs/src/styles/articles.css index f5ce34304..a6a2a21ad 100644 --- a/docs/src/styles/articles.css +++ b/docs/src/styles/articles.css @@ -99,3 +99,36 @@ margin: var(--vkui--size_label_horizontal_margin--regular) 0; overflow: auto; } + +.code-tab [data-language] { + display: none; +} + +.code-tab [data-language].code-tab-selected { + display: block; +} + +.code-tab_button { + background: none; + border: 0 none; + cursor: pointer; + + color: var(--vkui--color_text_secondary); + + font-size: var(--vkui--font_text--font_size--regular); + line-height: var(--vkui--font_text--line_height--regular); + font-family: var(--vkui--font_text--font_family--regular); + font-weight: var(--vkui--font_text--font_weight--regular); +} + +.code-tab_button:hover { + color: var(--vkui--color_text_secondary--hover); +} + +.code-tab_button:active { + color: var(--vkui--color_text_secondary--active); +} + +.code-tab_button.code-tab-selected { + color: var(--vkui--color_text_primary); +} diff --git a/src/build/helpers/tokenHelpers.ts b/src/build/helpers/tokenHelpers.ts index 81a9a4623..4caa91281 100644 --- a/src/build/helpers/tokenHelpers.ts +++ b/src/build/helpers/tokenHelpers.ts @@ -21,14 +21,28 @@ function readThemeToken(theme: any, token: string): Token { return theme[token] ?? (theme['colors'] ?? {})[token]; } +/** + * Функция выполняет подстановку значения другого токена. + * @param token Имя токена. Можно использовать токены из текущей темы либо из всех тем, + * от которой наследуется текущая. + */ export function alias(token: string): TokenFunction { return (theme) => readThemeToken(theme, token); } +/** + * Функция создаёт runtime-ссылку на другой токен темы выполняет подстановку fallback-значения этого токена. + * @param token Имя токена. Можно использовать токены из текущей темы либо из всех тем, + * от которой наследуется текущая. + */ export function namedAlias(token: string): NamedTokenFunction { return (theme) => [token, readThemeToken(theme, token)]; } +/** + * Функция создаёт runtime-ссылку на другой токен темы. + * @param token Имя токена. Можно использовать любые токены, которые находятся в контексте страницы. + */ export function staticRef(value: Token): T { if (typeof value === 'function') { throw new Error('Cannot use callable token value in static ref'); @@ -48,7 +62,7 @@ function makeOpacityPoints(count: number): OpacityPoints { return result; } -export function gradient( +export function gradient ( ...stops: (Property.Color | NamedTokenFunction)[] ): TokenFunction { const opacityPoints = stops.length > 1 ? makeOpacityPoints(stops.length) : defaultOpacityPoints; From 01ee1347375e59e5cc708a385c17d295b35e71bc Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Wed, 25 Sep 2024 20:17:51 +0300 Subject: [PATCH 22/36] feat/tokenized-gradients: fix doc style --- docs/src/App.tsx | 4 ++++ .../components/layouts/shared/AsideMenu/AsideMenu.tsx | 6 +++--- docs/src/components/pages/Tokens/TokensHeader.tsx | 11 ++++++++++- docs/src/pages/Articles.tsx | 2 +- docs/src/styles/articles.css | 3 +++ src/build/helpers/tokenHelpers.ts | 2 +- 6 files changed, 22 insertions(+), 6 deletions(-) diff --git a/docs/src/App.tsx b/docs/src/App.tsx index b80ff206a..d18b3ec08 100644 --- a/docs/src/App.tsx +++ b/docs/src/App.tsx @@ -52,6 +52,10 @@ const router = createBrowserRouter([ )), ]); +router.subscribe(() => { + window.scrollTo(0, 0); +}); + const App: FC = () => (
diff --git a/docs/src/components/layouts/shared/AsideMenu/AsideMenu.tsx b/docs/src/components/layouts/shared/AsideMenu/AsideMenu.tsx index 504e8257a..eeb32d7c7 100644 --- a/docs/src/components/layouts/shared/AsideMenu/AsideMenu.tsx +++ b/docs/src/components/layouts/shared/AsideMenu/AsideMenu.tsx @@ -25,17 +25,17 @@ export function AsideMenu(props: AsideMenuProps) { {items.map((item) => { if (item.slug) { return ( -
+
{item.title}
); } else { return ( - <> + {item.title} - + ) } })} diff --git a/docs/src/components/pages/Tokens/TokensHeader.tsx b/docs/src/components/pages/Tokens/TokensHeader.tsx index 176087fa4..b5bd24766 100644 --- a/docs/src/components/pages/Tokens/TokensHeader.tsx +++ b/docs/src/components/pages/Tokens/TokensHeader.tsx @@ -1,5 +1,6 @@ -import { Icon16Linked } from '@vkontakte/icons'; +import { Icon16Linked, Icon16HelpOutline } from '@vkontakte/icons'; import { Link, Title, useAdaptivityWithJSMediaQueries } from '@vkontakte/vkui'; +import { Link as RouterLink } from 'react-router-dom'; import clsx from 'clsx'; import React, { FC } from 'react'; @@ -42,6 +43,14 @@ const TokensHeader: FC = () => { {version.text}
+
+ + + + Документация + + +
diff --git a/docs/src/pages/Articles.tsx b/docs/src/pages/Articles.tsx index 998dde050..bee30cd3f 100644 --- a/docs/src/pages/Articles.tsx +++ b/docs/src/pages/Articles.tsx @@ -152,7 +152,7 @@ export function Articles(props: ArticlesProps) { const link = links[i] as HTMLElement; link.setAttribute("target", "_blank"); } - }, [ref.current]); + }, [ref.current, articleContent]); return (
diff --git a/docs/src/styles/articles.css b/docs/src/styles/articles.css index a6a2a21ad..7d4b777d1 100644 --- a/docs/src/styles/articles.css +++ b/docs/src/styles/articles.css @@ -77,14 +77,17 @@ .articles a, .articles a:visited { color: var(--vkui--color_text_link); + text-decoration: none; } .articles a:hover { color: var(--vkui--color_text_link--hover); + text-decoration: underline; } .articles a:active { color: var(--vkui--color_text_link--active); + text-decoration: underline; } .articles-container code { diff --git a/src/build/helpers/tokenHelpers.ts b/src/build/helpers/tokenHelpers.ts index 4caa91281..e7b012b2d 100644 --- a/src/build/helpers/tokenHelpers.ts +++ b/src/build/helpers/tokenHelpers.ts @@ -62,7 +62,7 @@ function makeOpacityPoints(count: number): OpacityPoints { return result; } -export function gradient ( +export function gradient( ...stops: (Property.Color | NamedTokenFunction)[] ): TokenFunction { const opacityPoints = stops.length > 1 ? makeOpacityPoints(stops.length) : defaultOpacityPoints; From b0f6cec7e4c5b5bcf59a659629f77a7a81363d53 Mon Sep 17 00:00:00 2001 From: Kaibito Young <12988120+8coon@users.noreply.github.com> Date: Thu, 26 Sep 2024 02:12:04 +0300 Subject: [PATCH 23/36] feat/tokenized-gradients: refactor code highlight widget --- docs/src/highlight/codeWidget.ts | 116 ++++++++++++++++++++++++++ docs/src/highlight/config.ts | 22 +++++ docs/src/highlight/highlight.ts | 62 ++++++++++++++ docs/src/pages/Articles.tsx | 137 +------------------------------ 4 files changed, 202 insertions(+), 135 deletions(-) create mode 100644 docs/src/highlight/codeWidget.ts create mode 100644 docs/src/highlight/config.ts create mode 100644 docs/src/highlight/highlight.ts diff --git a/docs/src/highlight/codeWidget.ts b/docs/src/highlight/codeWidget.ts new file mode 100644 index 000000000..9247e72f9 --- /dev/null +++ b/docs/src/highlight/codeWidget.ts @@ -0,0 +1,116 @@ +import { highlightConfig } from "./config"; + +function forEachCodeBlock(parent: HTMLElement, callback: (codeBlock: HTMLElement, language: string) => void) { + const codeBlocks = Array.from(parent.querySelectorAll(highlightConfig().codeSelector)); + + codeBlocks.forEach((codeBlock) => { + if (!(codeBlock instanceof HTMLElement)) { + return; + } + + const langClassName = Array.from(codeBlock.classList).find((className) => className.startsWith('language-')); + + if (langClassName) { + const language = langClassName.slice('language-'.length); + callback(codeBlock, language); + } + }); +} + +function switchLanguage(parent: HTMLElement, language: string) { + const allLanguageEls = Array.from(parent.querySelectorAll('[data-language]')); + + allLanguageEls.forEach((element) => { + if (element.getAttribute('data-language') === language) { + element.classList.add('code-tab-selected'); + } else { + element.classList.remove('code-tab-selected'); + } + }); +} + +function findDomParent(element: HTMLElement, selector: string, maxDepth = 5): HTMLElement | undefined { + let current: HTMLElement | null = element; + let count = 0; + + while (current && !current.matches(selector) && count < maxDepth) { + current = current.parentElement; + count++; + } + + if (current && !current.matches(selector) || !current) { + return undefined; + } + + return current; +} + +function handleTogglerClick(event: MouseEvent) { + if (!(event.target instanceof HTMLElement)) { + return; + } + + const language = event.target.getAttribute('data-language'); + + if (!language) { + return; + } + + const codeWidgetRoot = findDomParent(event.target, '.code-widget'); + + if (codeWidgetRoot) { + switchLanguage(codeWidgetRoot, language); + } +} + +/** + * Создаёт блок с переключателем нескольких языков и подсветкой синтаксиса + */ +export function createCodeWidget(...elements: HTMLElement[]) { + if (!elements.length || !elements[0].parentElement) { + return; + } + + const parentDiv = document.createElement('DIV'); + parentDiv.classList.add('code-widget'); + + elements[0].parentElement.replaceChild(parentDiv, elements[0]); + + for (const element of elements) { + parentDiv.appendChild(element); + } + + const languageToggler = document.createElement('DIV'); + parentDiv.insertBefore(languageToggler, parentDiv.firstChild); + + let firstLanguage: string | undefined; + + forEachCodeBlock(parentDiv, (codeBlock, language) => { + if (!firstLanguage) { + firstLanguage = language; + } + + codeBlock.setAttribute('data-language', language); + + const codeParent = codeBlock.parentElement; + + if (!codeParent) { + return; + } + + codeParent.classList.add('code-tab'); + + const languageButton = document.createElement('button'); + languageButton.innerText = language; + languageButton.classList.add('code-tab_button'); + languageButton.setAttribute('data-language', language); + + languageToggler.appendChild(languageButton); + }); + + languageToggler.addEventListener('click', handleTogglerClick); + + if (firstLanguage) { + switchLanguage(parentDiv, firstLanguage); + } +} \ No newline at end of file diff --git a/docs/src/highlight/config.ts b/docs/src/highlight/config.ts new file mode 100644 index 000000000..4533e6968 --- /dev/null +++ b/docs/src/highlight/config.ts @@ -0,0 +1,22 @@ +import 'highlight.js/styles/github.css'; + +import typescript from 'highlight.js/lib/languages/typescript'; +import css from 'highlight.js/lib/languages/css'; +import json from 'highlight.js/lib/languages/json'; + +interface HighlightLanguage { + name: string; + lib: (...args: any) => any; +} + +const languages: HighlightLanguage[] = [ + { name: 'typescript', lib: typescript }, + { name: 'json', lib: json }, + { name: 'css', lib: css }, +] + +const codeSelector = languages.map((language) => `code.language-${language.name}`).join(', '); + +export function highlightConfig() { + return { languages, codeSelector } as const; +} diff --git a/docs/src/highlight/highlight.ts b/docs/src/highlight/highlight.ts new file mode 100644 index 000000000..52dd90f0b --- /dev/null +++ b/docs/src/highlight/highlight.ts @@ -0,0 +1,62 @@ +import hljs from 'highlight.js/lib/core'; + +import { highlightConfig } from './config'; +import { createCodeWidget } from './codeWidget'; + +let hljsInitialized = false; + +function findChildIndex(element: HTMLElement): number { + // Вызывается в цикле, поэтому не копируем элементы из NodeList в массив + for (let i = 0; i < element.parentElement.children.length; i++) { + if (element.parentElement.children[i] === element) { + return i; + } + } + + return -1; +} + +/** + * Подсвечивает синтаксис во всех блков кода в переданном элементе + * Если в исходнике встречаются несколько подряд идущих блоков кода на разных языках, они объединяются в виджет + * с табами (см. файл codeWidget.ts) + */ +export function highlightCodeInElement(element: HTMLElement) { + if (!hljsInitialized) { + highlightConfig().languages.forEach((language) => hljs.registerLanguage(language.name, language.lib)); + hljsInitialized = true; + } + + const codeBlocks = Array.from(element.querySelectorAll(highlightConfig().codeSelector)); + + for (const codeBlock of codeBlocks) { + if (!(codeBlock instanceof HTMLElement)) { + continue; + } + + const codeParent = codeBlock.parentElement; + const codeParentIndex = findChildIndex(codeParent); + + codeBlock.innerHTML = hljs.highlightAuto(codeBlock.innerText).value; + + const prevCodeParent = codeParent.parentElement.children[codeParentIndex - 1] as HTMLElement; + + if (!prevCodeParent) { + break; + } + + const prevCodeBlock = prevCodeParent.querySelector(highlightConfig().codeSelector); + + if (prevCodeBlock instanceof HTMLElement) { + createCodeWidget(prevCodeParent, codeParent); + } + } + + const links = Array.from(element.querySelectorAll("a[href]")); + + for (const link of links) { + link.setAttribute("target", "_blank"); + } +} + + diff --git a/docs/src/pages/Articles.tsx b/docs/src/pages/Articles.tsx index bee30cd3f..224c34f3c 100644 --- a/docs/src/pages/Articles.tsx +++ b/docs/src/pages/Articles.tsx @@ -1,117 +1,15 @@ import * as React from 'react'; -import hljs from 'highlight.js/lib/core'; -import typescript from 'highlight.js/lib/languages/typescript'; -import css from 'highlight.js/lib/languages/css'; -import json from 'highlight.js/lib/languages/json'; import 'highlight.js/styles/github.css'; import { AsideMenu, AsideMenuItem } from '@/components/layouts/shared/AsideMenu/AsideMenu'; import { Spacing, useAdaptivityWithJSMediaQueries } from '@vkontakte/vkui'; - -hljs.registerLanguage('typescript', typescript); -hljs.registerLanguage('css', css); -hljs.registerLanguage('json', json); +import { highlightCodeInElement } from '@/highlight/highlight'; export interface ArticlesProps { items?: AsideMenuItem[]; contentsHtml?: string; } -function forEachCodeBlock(parent: HTMLElement, callback: (codeBlock: HTMLElement, language: string) => void) { - for (let i = 0; i < parent.children.length; i++) { - const element = parent.children[i]; - const codeBlock = element.querySelector('code'); - - if (!codeBlock) { - continue; - } - - for (let j = 0; j < codeBlock.classList.length; j++) { - const className = codeBlock.classList[j]; - - if (className.startsWith('language-')) { - const language = className.slice('language-'.length); - - callback(codeBlock, language); - break; - } - } - } -} - -function switchLanguage(parent: HTMLElement, language: string) { - const allLanguageEls = parent.querySelectorAll('[data-language]'); - - for (let i = 0; i < allLanguageEls.length; i++) { - const element = allLanguageEls[i]; - - if (element.getAttribute('data-language') === language) { - element.classList.add('code-tab-selected'); - } else { - element.classList.remove('code-tab-selected'); - } - } -} - -function handleTogglerClick(event: MouseEvent) { - const language = (event.target as HTMLElement).getAttribute('data-language'); - - if (language) { - switchLanguage((event.target as HTMLElement).parentElement.parentElement, language); - } -} - -function makeLanguageToggler(...elements: HTMLElement[]) { - if (!elements.length) { - return; - } - - const parentDiv = document.createElement('DIV'); - - elements[0].parentElement.replaceChild(parentDiv, elements[0]); - - for (const element of elements) { - parentDiv.appendChild(element); - } - - const languageToggler = document.createElement('DIV'); - parentDiv.insertBefore(languageToggler, parentDiv.firstChild); - - let firstLanguage: string; - - forEachCodeBlock(parentDiv, (codeBlock, language) => { - if (!firstLanguage) { - firstLanguage = language; - } - - codeBlock.setAttribute('data-language', language); - - const codeParent = codeBlock.parentElement; - codeParent.classList.add('code-tab'); - - const languageButton = document.createElement('button'); - languageButton.innerText = language; - languageButton.classList.add('code-tab_button'); - languageButton.setAttribute('data-language', language); - - languageToggler.appendChild(languageButton); - }); - - languageToggler.addEventListener('click', handleTogglerClick); - - switchLanguage(parentDiv, firstLanguage); -} - -function findChildIndex(element: HTMLElement): number { - for (let i = 0; i < element.parentElement.children.length; i++) { - if (element.parentElement.children[i] === element) { - return i; - } - } - - return -1; -} - export function Articles(props: ArticlesProps) { let articleContent = props.contentsHtml ?? ''; const ref = React.useRef(undefined); @@ -120,38 +18,7 @@ export function Articles(props: ArticlesProps) { const isMobile = viewWidth <= 3; React.useEffect(() => { - if (!ref.current) { - return; - } - - const codeSelector = 'code.language-typescript, code.language-css, code.language-json'; - - const codeBlocks = ref.current.querySelectorAll(codeSelector); - - for (let i = 0; i < codeBlocks.length; i++) { - const codeBlock = codeBlocks[i] as HTMLElement; - const codeParent = codeBlock.parentElement; - const codeParentIndex = findChildIndex(codeParent); - - codeBlock.innerHTML = hljs.highlightAuto(codeBlock.innerText).value; - - const prevCodeParent = codeParent.parentElement.children[codeParentIndex - 1] as HTMLElement; - - if (prevCodeParent) { - const prevCodeBlock = prevCodeParent.querySelector(codeSelector) as HTMLElement; - - if (prevCodeBlock) { - makeLanguageToggler(prevCodeParent, codeParent); - } - } - } - - const links = ref.current.querySelectorAll("a[href]"); - - for (let i = 0; i < links.length; i++) { - const link = links[i] as HTMLElement; - link.setAttribute("target", "_blank"); - } + highlightCodeInElement(ref.current); }, [ref.current, articleContent]); return ( From 0775613b8d13f4c5482ced9072eebe82016d2fa5 Mon Sep 17 00:00:00 2001 From: Kaibito Young <12988120+8coon@users.noreply.github.com> Date: Thu, 26 Sep 2024 02:15:24 +0300 Subject: [PATCH 24/36] feat/tokenized-gradients: fix tab --- docs/src/pages/Articles.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/src/pages/Articles.tsx b/docs/src/pages/Articles.tsx index 224c34f3c..de75de50c 100644 --- a/docs/src/pages/Articles.tsx +++ b/docs/src/pages/Articles.tsx @@ -15,7 +15,7 @@ export function Articles(props: ArticlesProps) { const ref = React.useRef(undefined); const { viewWidth } = useAdaptivityWithJSMediaQueries(); - const isMobile = viewWidth <= 3; + const isMobile = viewWidth <= 3; React.useEffect(() => { highlightCodeInElement(ref.current); From 99c470a86407cf53114d0e7f8ab015bef02dabf1 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Thu, 26 Sep 2024 16:39:24 +0300 Subject: [PATCH 25/36] feat/tokenized-gradients: add more tests --- .../structJSON/compileStructJSON.test.ts | 28 +++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/src/build/compilers/structJSON/compileStructJSON.test.ts b/src/build/compilers/structJSON/compileStructJSON.test.ts index 324b3ee2c..f4a63feab 100644 --- a/src/build/compilers/structJSON/compileStructJSON.test.ts +++ b/src/build/compilers/structJSON/compileStructJSON.test.ts @@ -10,6 +10,14 @@ describe('compileJSON', () => { randomToken: 123, gradientTest: 'var(--vkui--color_background_content, rgba(255, 255, 255, 1)) 0%, rgba(0, 0, 0, 0) 100%', + gradientOneColor: [ + 'rgba(0, 0, 255, 0) 0%', + 'rgba(0, 0, 255, 0.05) 15%', + 'rgba(0, 0, 255, 0.2) 30%', + 'rgba(0, 0, 255, 0.8) 70%', + 'rgba(0, 0, 255, 0.95) 85%', + 'rgba(0, 0, 255, 1) 100%', + ].join(', '), }; expect(compileStructJSON(testData)).toBe( @@ -32,6 +40,26 @@ describe('compileJSON', () => { { "color": "rgba(0, 0, 0, 0)" } + ], + "gradientOneColor": [ + { + "color": "rgba(0, 0, 255, 0)" + }, + { + "color": "rgba(0, 0, 255, 0.05)" + }, + { + "color": "rgba(0, 0, 255, 0.2)" + }, + { + "color": "rgba(0, 0, 255, 0.8)" + }, + { + "color": "rgba(0, 0, 255, 0.95)" + }, + { + "color": "rgba(0, 0, 255, 1)" + } ] } }`, From dbca8c7cb4dca98eea22b235332bd2b651b1f015 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Wed, 9 Oct 2024 17:44:37 +0300 Subject: [PATCH 26/36] feat/tokenized-gradients: add more info to gradient step json struct --- .../structJSON/compileStructJSON.test.ts | 81 ++++++++++++++++--- .../compilers/structJSON/compileStructJSON.ts | 36 +++++++-- src/build/helpers/tokenHelpers.test.ts | 2 +- 3 files changed, 104 insertions(+), 15 deletions(-) diff --git a/src/build/compilers/structJSON/compileStructJSON.test.ts b/src/build/compilers/structJSON/compileStructJSON.test.ts index f4a63feab..86cd71c9b 100644 --- a/src/build/compilers/structJSON/compileStructJSON.test.ts +++ b/src/build/compilers/structJSON/compileStructJSON.test.ts @@ -3,7 +3,7 @@ import { describe, expect, it } from '@jest/globals'; import { compileStructJSON } from './compileStructJSON'; describe('compileJSON', () => { - it('should correct stringify', () => { + it('should stringify correctly', () => { const testData = { colorA: '#fff', colorsScheme: 'scheme', @@ -18,6 +18,14 @@ describe('compileJSON', () => { 'rgba(0, 0, 255, 0.95) 85%', 'rgba(0, 0, 255, 1) 100%', ].join(', '), + gradientOneVariable: [ + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0)) 0%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0.05)) 15%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0.2)) 30%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0.8)) 70%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 0.95)) 85%', + 'var(--vkui--color_icon_primary, rgba(0, 0, 255, 1)) 100%', + ].join(', '), }; expect(compileStructJSON(testData)).toBe( @@ -35,30 +43,85 @@ describe('compileJSON', () => { "gradientTest": [ { "color": "rgba(255, 255, 255, 1)", - "token": "colorBackgroundContent" + "token": "colorBackgroundContent", + "step": 0, + "alpha": 1 }, { - "color": "rgba(0, 0, 0, 0)" + "color": "rgba(0, 0, 0, 0)", + "step": 1, + "alpha": 0, + "token": "colorBackgroundContent" } ], "gradientOneColor": [ { - "color": "rgba(0, 0, 255, 0)" + "color": "rgba(0, 0, 255, 0)", + "step": 0, + "alpha": 0 + }, + { + "color": "rgba(0, 0, 255, 0.05)", + "step": 0.15, + "alpha": 0.05 + }, + { + "color": "rgba(0, 0, 255, 0.2)", + "step": 0.3, + "alpha": 0.2 + }, + { + "color": "rgba(0, 0, 255, 0.8)", + "step": 0.7, + "alpha": 0.8 + }, + { + "color": "rgba(0, 0, 255, 0.95)", + "step": 0.85, + "alpha": 0.95 + }, + { + "color": "rgba(0, 0, 255, 1)", + "step": 1, + "alpha": 1 + } + ], + "gradientOneVariable": [ + { + "color": "rgba(0, 0, 255, 0)", + "token": "colorIconPrimary", + "step": 0, + "alpha": 0 }, { - "color": "rgba(0, 0, 255, 0.05)" + "color": "rgba(0, 0, 255, 0.05)", + "token": "colorIconPrimary", + "step": 0.15, + "alpha": 0.05 }, { - "color": "rgba(0, 0, 255, 0.2)" + "color": "rgba(0, 0, 255, 0.2)", + "token": "colorIconPrimary", + "step": 0.3, + "alpha": 0.2 }, { - "color": "rgba(0, 0, 255, 0.8)" + "color": "rgba(0, 0, 255, 0.8)", + "token": "colorIconPrimary", + "step": 0.7, + "alpha": 0.8 }, { - "color": "rgba(0, 0, 255, 0.95)" + "color": "rgba(0, 0, 255, 0.95)", + "token": "colorIconPrimary", + "step": 0.85, + "alpha": 0.95 }, { - "color": "rgba(0, 0, 255, 1)" + "color": "rgba(0, 0, 255, 1)", + "token": "colorIconPrimary", + "step": 1, + "alpha": 1 } ] } diff --git a/src/build/compilers/structJSON/compileStructJSON.ts b/src/build/compilers/structJSON/compileStructJSON.ts index 77957d252..7b65b6725 100644 --- a/src/build/compilers/structJSON/compileStructJSON.ts +++ b/src/build/compilers/structJSON/compileStructJSON.ts @@ -1,3 +1,5 @@ +import Color from 'color'; + import { convertSnakeToCamel } from '@/build/helpers/convertSnakeToCamel'; import type { Theme } from '@/interfaces/general'; @@ -22,9 +24,16 @@ const groups = [ interface StructGradientPoint { color: string; token?: string; + step?: number; + alpha?: number; } function parseRawToken(rawToken: string): StructGradientPoint { + const percentMatch = rawToken.match(/\d+$/); + + const step = + percentMatch && percentMatch.length > 0 ? parseFloat(percentMatch[0]) / 100 : undefined; + rawToken = rawToken.replace(/^,\s/g, '').replace(/\d+$/g, '').trim(); if (rawToken.startsWith('var(')) { @@ -34,13 +43,20 @@ function parseRawToken(rawToken: string): StructGradientPoint { const varName = varNameRaw[1]; const varValue = rawToken.slice(varNameRaw[0].length, -1).trim().slice(1).trim(); - return { color: varValue, token: convertSnakeToCamel(varName) }; + return { + color: varValue, + token: convertSnakeToCamel(varName), + step, + alpha: new Color(varValue).alpha(), + }; } - - return { color: rawToken }; } - return { color: rawToken }; + return { + color: rawToken, + step, + alpha: new Color(rawToken).alpha(), + }; } function compileStructGradients( @@ -51,7 +67,17 @@ function compileStructGradients( for (const key of keys) { const rawPoints = cssGradients[key].split('%').slice(0, -1); - structGradients[key] = rawPoints.map(parseRawToken); + + structGradients[key] = rawPoints.map(parseRawToken).map((structToken, index, array) => { + if (index > 0 && !structToken.token) { + return { + ...structToken, + token: structToken.token ?? array[0].token, + }; + } + + return structToken; + }); } return structGradients; diff --git a/src/build/helpers/tokenHelpers.test.ts b/src/build/helpers/tokenHelpers.test.ts index 7c7e53f50..14b8da1cc 100644 --- a/src/build/helpers/tokenHelpers.test.ts +++ b/src/build/helpers/tokenHelpers.test.ts @@ -35,7 +35,7 @@ describe('tokenHelpers', () => { }); describe('gradient', () => { - test('calculates gradient string from 1 color with variable', () => { + test('calculates gradient string from 1 color with value', () => { const gradientToken = gradient('blue'); const gradientValue = gradientToken({}); From 25380a8c43c4208fc6ff65d85e42c6ade4f287f1 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Wed, 9 Oct 2024 17:48:34 +0300 Subject: [PATCH 27/36] feat/tokenized-gradients: fix docs --- docs/src/articles/TokenHelpers.md | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/docs/src/articles/TokenHelpers.md b/docs/src/articles/TokenHelpers.md index bbfd08e6e..7bf468a7d 100644 --- a/docs/src/articles/TokenHelpers.md +++ b/docs/src/articles/TokenHelpers.md @@ -190,10 +190,15 @@ export const myCustomTheme: ParadigmThemeDescription = { "gradient": [ { "color": "rgba(64, 64, 64, 1)", - "token": "colorIconPrimary" + "token": "colorIconPrimary", + "step": 0, + "alpha": 1 }, { - "color": "rgba(32, 32, 32, 1)" + "color": "rgba(32, 32, 32, 1)", + "token": "colorIconPrimary", + "step": 1, + "alpha": 1 } ] }, From 825aec97224c944bef648789ca8cd3555a6cb3f4 Mon Sep 17 00:00:00 2001 From: nick Date: Fri, 11 Oct 2024 18:59:22 +0300 Subject: [PATCH 28/36] fix(vkCom): Desaturated and transparent backgroundSecondaryAlpha --- .../__snapshots__/snapthots.test.ts.snap | 80 +++++++++---------- src/themeDescriptions/themes/vkCom/index.ts | 12 +-- 2 files changed, 42 insertions(+), 50 deletions(-) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index b79959f27..661baa1b5 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -392288,15 +392288,15 @@ exports[`shapshots vkCom theme should match cssVars snapshot 1`] = ` "colorBackgroundSecondaryAlpha": { "active": { "name": "--vkui--color_background_secondary_alpha--active", - "value": "var(--vkui--color_background_secondary_alpha--active, rgba(213, 226, 241, 0.99))", + "value": "var(--vkui--color_background_secondary_alpha--active, rgba(39, 63, 92, 0.15))", }, "hover": { "name": "--vkui--color_background_secondary_alpha--hover", - "value": "var(--vkui--color_background_secondary_alpha--hover, rgba(223, 234, 246, 0.99))", + "value": "var(--vkui--color_background_secondary_alpha--hover, rgba(39, 63, 92, 0.11))", }, "normal": { "name": "--vkui--color_background_secondary_alpha", - "value": "var(--vkui--color_background_secondary_alpha, rgba(235, 242, 250, 0.99))", + "value": "var(--vkui--color_background_secondary_alpha, rgba(39, 63, 92, 0.07))", }, }, "colorBackgroundTertiary": { @@ -395274,9 +395274,9 @@ exports[`shapshots vkCom theme should match pixelify theme snapshot 1`] = ` "normal": "#F0F2F5", }, "colorBackgroundSecondaryAlpha": { - "active": "rgba(213, 226, 241, 0.99)", - "hover": "rgba(223, 234, 246, 0.99)", - "normal": "rgba(235, 242, 250, 0.99)", + "active": "rgba(39, 63, 92, 0.15)", + "hover": "rgba(39, 63, 92, 0.11)", + "normal": "rgba(39, 63, 92, 0.07)", }, "colorBackgroundTertiary": { "active": "#E6E8ED", @@ -396285,9 +396285,9 @@ exports[`shapshots vkCom theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_background_secondary, #F0F2F5)", }, "colorBackgroundSecondaryAlpha": { - "active": "var(--vkui--color_background_secondary_alpha--active, rgba(213, 226, 241, 0.99))", - "hover": "var(--vkui--color_background_secondary_alpha--hover, rgba(223, 234, 246, 0.99))", - "normal": "var(--vkui--color_background_secondary_alpha, rgba(235, 242, 250, 0.99))", + "active": "var(--vkui--color_background_secondary_alpha--active, rgba(39, 63, 92, 0.15))", + "hover": "var(--vkui--color_background_secondary_alpha--hover, rgba(39, 63, 92, 0.11))", + "normal": "var(--vkui--color_background_secondary_alpha, rgba(39, 63, 92, 0.07))", }, "colorBackgroundTertiary": { "active": "var(--vkui--color_background_tertiary--active, #E6E8ED)", @@ -397296,9 +397296,9 @@ exports[`shapshots vkCom theme should match root theme snapshot 1`] = ` "normal": "#F0F2F5", }, "colorBackgroundSecondaryAlpha": { - "active": "rgba(213, 226, 241, 0.99)", - "hover": "rgba(223, 234, 246, 0.99)", - "normal": "rgba(235, 242, 250, 0.99)", + "active": "rgba(39, 63, 92, 0.15)", + "hover": "rgba(39, 63, 92, 0.11)", + "normal": "rgba(39, 63, 92, 0.07)", }, "colorBackgroundTertiary": { "active": "#E6E8ED", @@ -398657,7 +398657,7 @@ exports[`shapshots vkComDark theme should match cssVars snapshot 1`] = ` "colorBackgroundSecondaryAlpha": { "active": { "name": "--vkui--color_background_secondary_alpha--active", - "value": "var(--vkui--color_background_secondary_alpha--active, rgba(255, 255, 255, 0.14))", + "value": "var(--vkui--color_background_secondary_alpha--active, rgba(255, 255, 255, 0.16))", }, "hover": { "name": "--vkui--color_background_secondary_alpha--hover", @@ -398665,7 +398665,7 @@ exports[`shapshots vkComDark theme should match cssVars snapshot 1`] = ` }, "normal": { "name": "--vkui--color_background_secondary_alpha", - "value": "var(--vkui--color_background_secondary_alpha, rgba(255, 255, 255, 0.10))", + "value": "var(--vkui--color_background_secondary_alpha, rgba(255, 255, 255, 0.08))", }, }, "colorBackgroundTertiary": { @@ -401643,9 +401643,9 @@ exports[`shapshots vkComDark theme should match pixelify theme snapshot 1`] = ` "normal": "#333333", }, "colorBackgroundSecondaryAlpha": { - "active": "rgba(255, 255, 255, 0.14)", + "active": "rgba(255, 255, 255, 0.16)", "hover": "rgba(255, 255, 255, 0.12)", - "normal": "rgba(255, 255, 255, 0.10)", + "normal": "rgba(255, 255, 255, 0.08)", }, "colorBackgroundTertiary": { "active": "#3A3A3A", @@ -402654,9 +402654,9 @@ exports[`shapshots vkComDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_background_secondary, #333333)", }, "colorBackgroundSecondaryAlpha": { - "active": "var(--vkui--color_background_secondary_alpha--active, rgba(255, 255, 255, 0.14))", + "active": "var(--vkui--color_background_secondary_alpha--active, rgba(255, 255, 255, 0.16))", "hover": "var(--vkui--color_background_secondary_alpha--hover, rgba(255, 255, 255, 0.12))", - "normal": "var(--vkui--color_background_secondary_alpha, rgba(255, 255, 255, 0.10))", + "normal": "var(--vkui--color_background_secondary_alpha, rgba(255, 255, 255, 0.08))", }, "colorBackgroundTertiary": { "active": "var(--vkui--color_background_tertiary--active, #3A3A3A)", @@ -403665,9 +403665,9 @@ exports[`shapshots vkComDark theme should match root theme snapshot 1`] = ` "normal": "#333333", }, "colorBackgroundSecondaryAlpha": { - "active": "rgba(255, 255, 255, 0.14)", + "active": "rgba(255, 255, 255, 0.16)", "hover": "rgba(255, 255, 255, 0.12)", - "normal": "rgba(255, 255, 255, 0.10)", + "normal": "rgba(255, 255, 255, 0.08)", }, "colorBackgroundTertiary": { "active": "#3A3A3A", @@ -460943,15 +460943,15 @@ exports[`shapshots vkontakteCom theme should match cssVars snapshot 1`] = ` "colorBackgroundSecondaryAlpha": { "active": { "name": "--vkui--color_background_secondary_alpha--active", - "value": "var(--vkui--color_background_secondary_alpha--active, rgba(213, 226, 241, 0.99))", + "value": "var(--vkui--color_background_secondary_alpha--active, rgba(39, 63, 92, 0.15))", }, "hover": { "name": "--vkui--color_background_secondary_alpha--hover", - "value": "var(--vkui--color_background_secondary_alpha--hover, rgba(223, 234, 246, 0.99))", + "value": "var(--vkui--color_background_secondary_alpha--hover, rgba(39, 63, 92, 0.11))", }, "normal": { "name": "--vkui--color_background_secondary_alpha", - "value": "var(--vkui--color_background_secondary_alpha, rgba(235, 242, 250, 0.99))", + "value": "var(--vkui--color_background_secondary_alpha, rgba(39, 63, 92, 0.07))", }, }, "colorBackgroundTertiary": { @@ -465073,9 +465073,9 @@ exports[`shapshots vkontakteCom theme should match pixelify theme snapshot 1`] = "normal": "#F0F2F5", }, "colorBackgroundSecondaryAlpha": { - "active": "rgba(213, 226, 241, 0.99)", - "hover": "rgba(223, 234, 246, 0.99)", - "normal": "rgba(235, 242, 250, 0.99)", + "active": "rgba(39, 63, 92, 0.15)", + "hover": "rgba(39, 63, 92, 0.11)", + "normal": "rgba(39, 63, 92, 0.07)", }, "colorBackgroundTertiary": { "active": "#E6E8ED", @@ -466478,9 +466478,9 @@ exports[`shapshots vkontakteCom theme should match pseudo theme from CssVars 1`] "normal": "var(--vkui--color_background_secondary, #F0F2F5)", }, "colorBackgroundSecondaryAlpha": { - "active": "var(--vkui--color_background_secondary_alpha--active, rgba(213, 226, 241, 0.99))", - "hover": "var(--vkui--color_background_secondary_alpha--hover, rgba(223, 234, 246, 0.99))", - "normal": "var(--vkui--color_background_secondary_alpha, rgba(235, 242, 250, 0.99))", + "active": "var(--vkui--color_background_secondary_alpha--active, rgba(39, 63, 92, 0.15))", + "hover": "var(--vkui--color_background_secondary_alpha--hover, rgba(39, 63, 92, 0.11))", + "normal": "var(--vkui--color_background_secondary_alpha, rgba(39, 63, 92, 0.07))", }, "colorBackgroundTertiary": { "active": "var(--vkui--color_background_tertiary--active, #E6E8ED)", @@ -467883,9 +467883,9 @@ exports[`shapshots vkontakteCom theme should match root theme snapshot 1`] = ` "normal": "#F0F2F5", }, "colorBackgroundSecondaryAlpha": { - "active": "rgba(213, 226, 241, 0.99)", - "hover": "rgba(223, 234, 246, 0.99)", - "normal": "rgba(235, 242, 250, 0.99)", + "active": "rgba(39, 63, 92, 0.15)", + "hover": "rgba(39, 63, 92, 0.11)", + "normal": "rgba(39, 63, 92, 0.07)", }, "colorBackgroundTertiary": { "active": "#E6E8ED", @@ -469638,7 +469638,7 @@ exports[`shapshots vkontakteComDark theme should match cssVars snapshot 1`] = ` "colorBackgroundSecondaryAlpha": { "active": { "name": "--vkui--color_background_secondary_alpha--active", - "value": "var(--vkui--color_background_secondary_alpha--active, rgba(255, 255, 255, 0.14))", + "value": "var(--vkui--color_background_secondary_alpha--active, rgba(255, 255, 255, 0.16))", }, "hover": { "name": "--vkui--color_background_secondary_alpha--hover", @@ -469646,7 +469646,7 @@ exports[`shapshots vkontakteComDark theme should match cssVars snapshot 1`] = ` }, "normal": { "name": "--vkui--color_background_secondary_alpha", - "value": "var(--vkui--color_background_secondary_alpha, rgba(255, 255, 255, 0.10))", + "value": "var(--vkui--color_background_secondary_alpha, rgba(255, 255, 255, 0.08))", }, }, "colorBackgroundTertiary": { @@ -473768,9 +473768,9 @@ exports[`shapshots vkontakteComDark theme should match pixelify theme snapshot 1 "normal": "#333333", }, "colorBackgroundSecondaryAlpha": { - "active": "rgba(255, 255, 255, 0.14)", + "active": "rgba(255, 255, 255, 0.16)", "hover": "rgba(255, 255, 255, 0.12)", - "normal": "rgba(255, 255, 255, 0.10)", + "normal": "rgba(255, 255, 255, 0.08)", }, "colorBackgroundTertiary": { "active": "#3A3A3A", @@ -475173,9 +475173,9 @@ exports[`shapshots vkontakteComDark theme should match pseudo theme from CssVars "normal": "var(--vkui--color_background_secondary, #333333)", }, "colorBackgroundSecondaryAlpha": { - "active": "var(--vkui--color_background_secondary_alpha--active, rgba(255, 255, 255, 0.14))", + "active": "var(--vkui--color_background_secondary_alpha--active, rgba(255, 255, 255, 0.16))", "hover": "var(--vkui--color_background_secondary_alpha--hover, rgba(255, 255, 255, 0.12))", - "normal": "var(--vkui--color_background_secondary_alpha, rgba(255, 255, 255, 0.10))", + "normal": "var(--vkui--color_background_secondary_alpha, rgba(255, 255, 255, 0.08))", }, "colorBackgroundTertiary": { "active": "var(--vkui--color_background_tertiary--active, #3A3A3A)", @@ -476578,9 +476578,9 @@ exports[`shapshots vkontakteComDark theme should match root theme snapshot 1`] = "normal": "#333333", }, "colorBackgroundSecondaryAlpha": { - "active": "rgba(255, 255, 255, 0.14)", + "active": "rgba(255, 255, 255, 0.16)", "hover": "rgba(255, 255, 255, 0.12)", - "normal": "rgba(255, 255, 255, 0.10)", + "normal": "rgba(255, 255, 255, 0.08)", }, "colorBackgroundTertiary": { "active": "#3A3A3A", diff --git a/src/themeDescriptions/themes/vkCom/index.ts b/src/themeDescriptions/themes/vkCom/index.ts index b8a9475bb..39483b29f 100644 --- a/src/themeDescriptions/themes/vkCom/index.ts +++ b/src/themeDescriptions/themes/vkCom/index.ts @@ -32,11 +32,7 @@ const vkComColors = (theme: typeof vkcom_light) => ({ colorBackground: resolveColor(theme.colors.background_page), colorBackgroundContent: resolveColor(theme.colors.background_content), colorBackgroundSecondary: resolveColor(theme.colors.content_tint_background), - colorBackgroundSecondaryAlpha: { - normal: 'rgba(235, 242, 250, 0.99)', - hover: 'rgba(223, 234, 246, 0.99)', - active: 'rgba(213, 226, 241, 0.99)', - }, + colorBackgroundSecondaryAlpha: 'rgba(39, 63, 92, 0.07)', colorBackgroundTertiary: resolveColor(theme.colors.background_light), colorBackgroundContrast: resolveColor(theme.colors.media_overlay_button_background), // colorBackgroundContrastSecondaryAlpha: 'rgba(255, 255, 255, 0.20)', @@ -355,11 +351,7 @@ const vkComDarkColor: ColorsDescription = { active: '#CFD2D8', }, colorBackgroundAccentThemedAlpha: 'rgba(255, 255, 255, 0.2)', - colorBackgroundSecondaryAlpha: { - normal: 'rgba(255, 255, 255, 0.10)', - hover: 'rgba(255, 255, 255, 0.12)', - active: 'rgba(255, 255, 255, 0.14)', - }, + colorBackgroundSecondaryAlpha: 'rgba(255, 255, 255, 0.08)', colorBackgroundContrastThemed: '#323232', colorBackgroundModalInverse: '#FFFFFF', From d63f38236d06d310700e776e340bb7a434fccfc9 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 15 Oct 2024 19:20:01 +0300 Subject: [PATCH 29/36] qurle/feat/android-tokenized-gradients: fix deps and resolve conflicts --- package.json | 8 +- yarn.lock | 214 +++++++-------------------------------------------- 2 files changed, 34 insertions(+), 188 deletions(-) diff --git a/package.json b/package.json index 14306a369..be5cd5aba 100644 --- a/package.json +++ b/package.json @@ -51,7 +51,7 @@ "@types/fs-extra": "11.0.4", "@types/lodash": "4.17.7", "@types/node": "18.11.10", - "@types/react": "18.3.5", + "@types/react": "18.3.3", "@types/react-dom": "18.3.0", "@vkontakte/appearance": "https://github.com/VKCOM/Appearance#v10.2.0", "@vkontakte/icons": "2.124.0", @@ -118,5 +118,9 @@ "npm": ">=9.3.1", "yarn": ">=1.21.1 <2" }, - "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e" + "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e", + "resolutions": { + "@types/node": "18.11.10", + "@types/react": "18.3.3" + } } diff --git a/yarn.lock b/yarn.lock index c5560c792..f81c7c128 100644 --- a/yarn.lock +++ b/yarn.lock @@ -23,12 +23,7 @@ "@babel/highlight" "^7.24.7" picocolors "^1.0.0" -"@babel/compat-data@^7.22.6", "@babel/compat-data@^7.23.3", "@babel/compat-data@^7.23.5": - version "7.23.5" - resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.23.5.tgz#ffb878728bb6bdcb6f4510aa51b1be9afb8cfd98" - integrity sha512-uU27kfDRlhfKl+w1U6vp16IuvSLtjAxdArVXPa9BvLkrr7CYIsxH5adpHObeAGY/41+syctUWOZ140a2Rvkgjw== - -"@babel/compat-data@^7.25.2": +"@babel/compat-data@^7.22.6", "@babel/compat-data@^7.23.3", "@babel/compat-data@^7.23.5", "@babel/compat-data@^7.25.2": version "7.25.2" resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.25.2.tgz#e41928bd33475305c586f6acbbb7e3ade7a6f7f5" integrity sha512-bYcppcpKBvX4znYaPEeFau03bp89ShqNMLs+rmdptMw+heSZh9+z84d2YG+K7cYLbWwzdjtDoW/uqZmPjulClQ== @@ -151,14 +146,7 @@ dependencies: "@babel/types" "^7.23.0" -"@babel/helper-module-imports@^7.22.15": - version "7.22.15" - resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz#16146307acdc40cc00c3b2c647713076464bdbf0" - integrity sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w== - dependencies: - "@babel/types" "^7.22.15" - -"@babel/helper-module-imports@^7.24.7": +"@babel/helper-module-imports@^7.22.15", "@babel/helper-module-imports@^7.24.7": version "7.24.7" resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.24.7.tgz#f2f980392de5b84c3328fc71d38bd81bbb83042b" integrity sha512-8AyH3C+74cgCVVXow/myrynrAGv+nTVg5vKu2nZph9x7RcRwzmh0VFallJuFTZ9mx6u4eSdXZfcOzSqTUm0HCA== @@ -206,14 +194,7 @@ "@babel/helper-member-expression-to-functions" "^7.22.15" "@babel/helper-optimise-call-expression" "^7.22.5" -"@babel/helper-simple-access@^7.22.5": - version "7.22.5" - resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.22.5.tgz#4938357dc7d782b80ed6dbb03a0fba3d22b1d5de" - integrity sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w== - dependencies: - "@babel/types" "^7.22.5" - -"@babel/helper-simple-access@^7.24.7": +"@babel/helper-simple-access@^7.22.5", "@babel/helper-simple-access@^7.24.7": version "7.24.7" resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.24.7.tgz#bcade8da3aec8ed16b9c4953b74e506b51b5edb3" integrity sha512-zBAIvbCMh5Ts+b86r/CjU+4XGYIs+R1j951gxI3KmmxBMhCg4oQMsv6ZXQ64XOm/cvzfU1FmoCyt6+owc5QMYg== @@ -240,22 +221,12 @@ resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.24.8.tgz#5b3329c9a58803d5df425e5785865881a81ca48d" integrity sha512-pO9KhhRcuUyGnJWwyEgnRJTSIZHiT+vMD0kPeD+so0l7mxkMT19g3pjY9GTnHySck/hDzq+dtW/4VgnMkippsQ== -"@babel/helper-validator-identifier@^7.22.20": - version "7.22.20" - resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz#c4ae002c61d2879e724581d96665583dbc1dc0e0" - integrity sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A== - -"@babel/helper-validator-identifier@^7.24.7": +"@babel/helper-validator-identifier@^7.22.20", "@babel/helper-validator-identifier@^7.24.7": version "7.24.7" resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.24.7.tgz#75b889cfaf9e35c2aaf42cf0d72c8e91719251db" integrity sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w== -"@babel/helper-validator-option@^7.22.15", "@babel/helper-validator-option@^7.23.5": - version "7.23.5" - resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.23.5.tgz#907a3fbd4523426285365d1206c423c4c5520307" - integrity sha512-85ttAOMLsr53VgXkTbkx8oA6YTfT4q7/HzXSLEYmjcSTJPMPQtvq1BD79Byep5xMUYbGRzEpDsjUf3dyp54IKw== - -"@babel/helper-validator-option@^7.24.8": +"@babel/helper-validator-option@^7.22.15", "@babel/helper-validator-option@^7.23.5", "@babel/helper-validator-option@^7.24.8": version "7.24.8" resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.24.8.tgz#3725cdeea8b480e86d34df15304806a06975e33d" integrity sha512-xb8t9tD1MHLungh/AIoWYN+gVHaB9kwlu8gffXGSt3FFEIT7RjS+xWbc2vUD1UTZdIpKj/ab3rdqJ7ufngyi2Q== @@ -1385,16 +1356,7 @@ "@types/yargs" "^17.0.8" chalk "^4.0.0" -"@jridgewell/gen-mapping@^0.3.0": - version "0.3.3" - resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz#7e02e6eb5df901aaedb08514203b096614024098" - integrity sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ== - dependencies: - "@jridgewell/set-array" "^1.0.1" - "@jridgewell/sourcemap-codec" "^1.4.10" - "@jridgewell/trace-mapping" "^0.3.9" - -"@jridgewell/gen-mapping@^0.3.5": +"@jridgewell/gen-mapping@^0.3.0", "@jridgewell/gen-mapping@^0.3.5": version "0.3.5" resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz#dcce6aff74bdf6dad1a95802b69b04a2fcb1fb36" integrity sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg== @@ -1408,11 +1370,6 @@ resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz#c08679063f279615a3326583ba3a90d1d82cc721" integrity sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA== -"@jridgewell/set-array@^1.0.1": - version "1.1.2" - resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.1.2.tgz#7c6cf998d6d20b914c0a55a91ae928ff25965e72" - integrity sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw== - "@jridgewell/set-array@^1.2.1": version "1.2.1" resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.2.1.tgz#558fb6472ed16a4c850b889530e6b36438c49280" @@ -1439,15 +1396,7 @@ "@jridgewell/resolve-uri" "^3.0.3" "@jridgewell/sourcemap-codec" "^1.4.10" -"@jridgewell/trace-mapping@^0.3.12", "@jridgewell/trace-mapping@^0.3.18", "@jridgewell/trace-mapping@^0.3.20", "@jridgewell/trace-mapping@^0.3.9": - version "0.3.22" - resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.22.tgz#72a621e5de59f5f1ef792d0793a82ee20f645e4c" - integrity sha512-Wf963MzWtA2sjrNt+g18IAln9lKnlRp+K2eH4jjIoF1wYeq3aMREpG09xhlhdzS0EjwU7qmUJYangWa+151vZw== - dependencies: - "@jridgewell/resolve-uri" "^3.1.0" - "@jridgewell/sourcemap-codec" "^1.4.14" - -"@jridgewell/trace-mapping@^0.3.24", "@jridgewell/trace-mapping@^0.3.25": +"@jridgewell/trace-mapping@^0.3.12", "@jridgewell/trace-mapping@^0.3.18", "@jridgewell/trace-mapping@^0.3.20", "@jridgewell/trace-mapping@^0.3.24", "@jridgewell/trace-mapping@^0.3.25", "@jridgewell/trace-mapping@^0.3.9": version "0.3.25" resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz#15f190e98895f3fc23276ee14bc76b675c2e50f0" integrity sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ== @@ -1927,14 +1876,7 @@ dependencies: "@types/node" "*" -"@types/node@*": - version "20.11.17" - resolved "https://registry.yarnpkg.com/@types/node/-/node-20.11.17.tgz#cdd642d0e62ef3a861f88ddbc2b61e32578a9292" - integrity sha512-QmgQZGWu1Yw9TDyAP9ZzpFJKynYNeOvwMJmaxABfieQoVoiVOS6MN1WSpqpRcbeA5+RW82kraAVxCCJg+780Qw== - dependencies: - undici-types "~5.26.4" - -"@types/node@18.11.10": +"@types/node@*", "@types/node@18.11.10": version "18.11.10" resolved "https://registry.yarnpkg.com/@types/node/-/node-18.11.10.tgz#4c64759f3c2343b7e6c4b9caf761c7a3a05cee34" integrity sha512-juG3RWMBOqcOuXC643OAdSA525V44cVgGV6dUDuiFtss+8Fk5x1hI93Rsld43VeJVIeqlP9I7Fn9/qaVqoEAuQ== @@ -1966,7 +1908,7 @@ dependencies: "@types/react" "*" -"@types/react@*": +"@types/react@*", "@types/react@18.3.3": version "18.3.3" resolved "https://registry.yarnpkg.com/@types/react/-/react-18.3.3.tgz#9679020895318b0915d7a3ab004d92d33375c45f" integrity sha512-hti/R0pS0q1/xx+TsI73XIqk26eBsISZ2R0wUijXIngRK9R/e7Xw/cXVxQK7R5JjW+SV4zGcn5hXjudkN/pLIw== @@ -1974,14 +1916,6 @@ "@types/prop-types" "*" csstype "^3.0.2" -"@types/react@18.3.5": - version "18.3.5" - resolved "https://registry.yarnpkg.com/@types/react/-/react-18.3.5.tgz#5f524c2ad2089c0ff372bbdabc77ca2c4dbadf8f" - integrity sha512-WeqMfGJLGuLCqHGYRGHxnKrXcTitc6L/nBUWfWPcTarG3t9PsquqUMuVeXZeca+mglY4Vo5GZjCi0A3Or2lnxA== - dependencies: - "@types/prop-types" "*" - csstype "^3.0.2" - "@types/retry@0.12.2": version "0.12.2" resolved "https://registry.yarnpkg.com/@types/retry/-/retry-0.12.2.tgz#ed279a64fa438bb69f2480eda44937912bb7480a" @@ -2821,31 +2755,14 @@ braces@^2.3.1: split-string "^3.0.2" to-regex "^3.0.1" -braces@^3.0.3: +braces@^3.0.3, braces@~3.0.2: version "3.0.3" resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.3.tgz#490332f40919452272d55a8480adc0c441358789" integrity sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA== dependencies: fill-range "^7.1.1" -braces@~3.0.2: - version "3.0.2" - resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107" - integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A== - dependencies: - fill-range "^7.0.1" - -browserslist@^4.21.10, browserslist@^4.22.3: - version "4.22.3" - resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.22.3.tgz#299d11b7e947a6b843981392721169e27d60c5a6" - integrity sha512-UAp55yfwNv0klWNapjs/ktHoguxuQNGnOzxYmfnXIS+8AsRDZkSDxg7R1AX3GKzn078SBI5dzwzj/Yx0Or0e3A== - dependencies: - caniuse-lite "^1.0.30001580" - electron-to-chromium "^1.4.648" - node-releases "^2.0.14" - update-browserslist-db "^1.0.13" - -browserslist@^4.23.1: +browserslist@^4.21.10, browserslist@^4.22.3, browserslist@^4.23.1: version "4.23.3" resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.23.3.tgz#debb029d3c93ebc97ffbc8d9cbb03403e227c800" integrity sha512-btwCFJVjI4YWDNfau8RhZ+B1Q/VLoUITrm3RlP6y1tYGWIOa+InuYiRGXUBXo8nA1qKmHMyLB/iVQg5TT4eFoA== @@ -2950,12 +2867,7 @@ camelcase@^6.2.0: resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a" integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA== -caniuse-lite@^1.0.30001524, caniuse-lite@^1.0.30001580: - version "1.0.30001587" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001587.tgz#a0bce920155fa56a1885a69c74e1163fc34b4881" - integrity sha512-HMFNotUmLXn71BQxg8cijvqxnIAofforZOwGsxyXJ0qugTdspUF4sPSJ2vhgprHCB996tIDzEq1ubumPDV8ULA== - -caniuse-lite@^1.0.30001646: +caniuse-lite@^1.0.30001524, caniuse-lite@^1.0.30001646: version "1.0.30001649" resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001649.tgz#3ec700309ca0da2b0d3d5fb03c411b191761c992" integrity sha512-fJegqZZ0ZX8HOWr6rcafGr72+xcgJKI9oWfDW5DrD7ExUtgZC7a7R7ZYmZqplh7XDocFdGeIFn7roAxhOeYrPQ== @@ -3445,20 +3357,13 @@ debug@^3.2.7: dependencies: ms "^2.1.1" -debug@^4.0.0: +debug@^4.0.0, debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.6: version "4.3.7" resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.7.tgz#87945b4151a011d76d95a198d7111c865c360a52" integrity sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ== dependencies: ms "^2.1.3" -debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.6: - version "4.3.6" - resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.6.tgz#2ab2c38fbaffebf8aa95fdfe6d88438c7a13c52b" - integrity sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg== - dependencies: - ms "2.1.2" - decode-named-character-reference@^1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/decode-named-character-reference/-/decode-named-character-reference-1.0.2.tgz#daabac9690874c394c81e4162a0304b35d824f0e" @@ -3733,11 +3638,6 @@ ejs@^3.1.10: dependencies: jake "^10.8.5" -electron-to-chromium@^1.4.648: - version "1.4.668" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.668.tgz#5cfed14f3240cdc70a359a49790cb295b1f097f1" - integrity sha512-ZOBocMYCehr9W31+GpMclR+KBaDZOoAEabLdhpZ8oU1JFDwIaFY0UDbpXVEUFc0BIP2O2Qn3rkfCjQmMR4T/bQ== - electron-to-chromium@^1.5.4: version "1.5.4" resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.5.4.tgz#cd477c830dd6fca41fbd5465c1ff6ce08ac22343" @@ -3768,15 +3668,7 @@ encodeurl@~1.0.2: resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59" integrity sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w== -enhanced-resolve@^5.0.0: - version "5.17.0" - resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.17.0.tgz#d037603789dd9555b89aaec7eb78845c49089bc5" - integrity sha512-dwDPwZL0dmye8Txp2gzFmA6sxALaSvdRDjPH0viLcKrtlOL3tw62nWWweVD1SdILDTJrbrL6tdWVN58Wo6U3eA== - dependencies: - graceful-fs "^4.2.4" - tapable "^2.2.0" - -enhanced-resolve@^5.17.1: +enhanced-resolve@^5.0.0, enhanced-resolve@^5.17.1: version "5.17.1" resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.17.1.tgz#67bfbbcc2f81d511be77d686a90267ef7f898a15" integrity sha512-LMHl3dXhTcfv8gM4kEzIUeTQ+7fpdA0l2tUf34BddXPkz2A5xJ5L/Pchd5BL6rdccM9QGvu0sWZzK1Z1t4wwyg== @@ -3789,7 +3681,7 @@ entities@^2.0.0: resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55" integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A== -entities@^4.2.0, entities@^4.4.0: +entities@^4.2.0, entities@^4.4.0, entities@^4.5.0: version "4.5.0" resolved "https://registry.yarnpkg.com/entities/-/entities-4.5.0.tgz#5d268ea5e7113ec74c4d033b79ea5a35a488fb48" integrity sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw== @@ -4425,13 +4317,6 @@ fill-range@^4.0.0: repeat-string "^1.6.1" to-regex-range "^2.1.0" -fill-range@^7.0.1: - version "7.0.1" - resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40" - integrity sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ== - dependencies: - to-regex-range "^5.0.1" - fill-range@^7.1.1: version "7.1.1" resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.1.1.tgz#44265d3cac07e3ea7dc247516380643754a05292" @@ -6676,11 +6561,6 @@ ms@2.0.0: resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8" integrity sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A== -ms@2.1.2: - version "2.1.2" - resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009" - integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w== - ms@2.1.3, ms@^2.1.1, ms@^2.1.3: version "2.1.3" resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2" @@ -6740,9 +6620,9 @@ no-case@^3.0.4: tslib "^2.0.3" node-addon-api@^8.0.0: - version "8.1.0" - resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-8.1.0.tgz#55a573685dd4bd053f189cffa4e6332d2b1f1645" - integrity sha512-yBY+qqWSv3dWKGODD6OGE6GnTX7Q2r+4+DfpqxHSHh8x0B4EKP9+wVGLS6U/AM1vxSNNmUEuIV5EGhYwPpfOwQ== + version "8.2.1" + resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-8.2.1.tgz#43a993f110b88e22ba48bcd65e16b92165a6b002" + integrity sha512-vmEOvxwiH8tlOcv4SyE8RH34rI5/nWVaigUeAUPawC6f0+HoDthwI0vkMu4tbtsZrXq6QXFfrkhjofzKEs5tpA== node-forge@^1: version "1.3.1" @@ -6771,11 +6651,6 @@ node-notifier@^9.0.0: uuid "^8.3.0" which "^2.0.2" -node-releases@^2.0.14: - version "2.0.14" - resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.14.tgz#2ffb053bceb8b2be8495ece1ab6ce600c4461b0b" - integrity sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw== - node-releases@^2.0.18: version "2.0.18" resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.18.tgz#f010e8d35e2fe8d6b2944f03f70213ecedc4ca3f" @@ -7048,11 +6923,11 @@ parse-json@^5.0.0, parse-json@^5.2.0: lines-and-columns "^1.1.6" parse5@^7.1.2: - version "7.1.2" - resolved "https://registry.yarnpkg.com/parse5/-/parse5-7.1.2.tgz#0736bebbfd77793823240a23b7fc5e010b7f8e32" - integrity sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw== + version "7.2.0" + resolved "https://registry.yarnpkg.com/parse5/-/parse5-7.2.0.tgz#8a0591ce9b7c5e2027173ab737d4d3fc3d826fab" + integrity sha512-ZkDsAOcxsUMZ4Lz5fVciOehNcJ+Gb8gTzcA4yl3wnc273BAybYWrQ+Ks/OjCjSEpjvQkDSeZbybK9qj2VHHdGA== dependencies: - entities "^4.4.0" + entities "^4.5.0" parseurl@~1.3.2, parseurl@~1.3.3: version "1.3.3" @@ -7147,12 +7022,7 @@ path-type@^5.0.0: resolved "https://registry.yarnpkg.com/path-type/-/path-type-5.0.0.tgz#14b01ed7aea7ddf9c7c3f46181d4d04f9c785bb8" integrity sha512-5HviZNaZcfqP95rwpv+1HDgUamezbqdSYTyzjTvwtJSnIH+3vnbmWsItli8OFEndS984VT55M3jduxZbX351gg== -picocolors@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c" - integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ== - -picocolors@^1.0.1: +picocolors@^1.0.0, picocolors@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.1.tgz#a8ad579b571952f0e5d25892de5445bcfe25aaa1" integrity sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew== @@ -8056,12 +7926,7 @@ sockjs@^0.3.24: uuid "^8.3.2" websocket-driver "^0.7.4" -source-map-js@^1.0.1: - version "1.0.2" - resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c" - integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw== - -source-map-js@^1.2.0: +source-map-js@^1.0.1, source-map-js@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.2.0.tgz#16b809c162517b5b8c3e7dcd315a2a5c2612b2af" integrity sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg== @@ -8412,20 +8277,10 @@ terser-webpack-plugin@5.3.10, terser-webpack-plugin@^5.3.10: serialize-javascript "^6.0.1" terser "^5.26.0" -terser@^5.10.0, terser@^5.26.0: - version "5.27.0" - resolved "https://registry.yarnpkg.com/terser/-/terser-5.27.0.tgz#70108689d9ab25fef61c4e93e808e9fd092bf20c" - integrity sha512-bi1HRwVRskAjheeYl291n3JC4GgO/Ty4z1nVs5AAsmonJulGxpSektecnNedrwK9C7vpvVtcX3cw00VSLt7U2A== - dependencies: - "@jridgewell/source-map" "^0.3.3" - acorn "^8.8.2" - commander "^2.20.0" - source-map-support "~0.5.20" - -terser@^5.15.1: - version "5.33.0" - resolved "https://registry.yarnpkg.com/terser/-/terser-5.33.0.tgz#8f9149538c7468ffcb1246cfec603c16720d2db1" - integrity sha512-JuPVaB7s1gdFKPKTelwUyRq5Sid2A3Gko2S0PncwdBq7kN9Ti9HPWDQ06MPsEDGsZeVESjKEnyGy68quBk1w6g== +terser@^5.10.0, terser@^5.15.1, terser@^5.26.0: + version "5.34.1" + resolved "https://registry.yarnpkg.com/terser/-/terser-5.34.1.tgz#af40386bdbe54af0d063e0670afd55c3105abeb6" + integrity sha512-FsJZ7iZLd/BXkz+4xrRTGJ26o/6VTjQytUk8b8OxkwcD2I+79VPJlz7qss1+zE7h8GNIScFqXcDyJ/KqBYZFVA== dependencies: "@jridgewell/source-map" "^0.3.3" acorn "^8.8.2" @@ -8713,11 +8568,6 @@ unbox-primitive@^1.0.2: has-symbols "^1.0.3" which-boxed-primitive "^1.0.2" -undici-types@~5.26.4: - version "5.26.5" - resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-5.26.5.tgz#bcd539893d00b56e964fd2657a4866b221a65617" - integrity sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA== - unicode-canonical-property-names-ecmascript@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz#301acdc525631670d39f6146e0e77ff6bbdebddc" @@ -8825,14 +8675,6 @@ unset-value@^1.0.0: has-value "^0.3.1" isobject "^3.0.0" -update-browserslist-db@^1.0.13: - version "1.0.13" - resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz#3c5e4f5c083661bd38ef64b6328c26ed6c8248c4" - integrity sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg== - dependencies: - escalade "^3.1.1" - picocolors "^1.0.0" - update-browserslist-db@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.1.0.tgz#7ca61c0d8650766090728046e416a8cde682859e" From a6936b84a4630d238bb9079c4797eb1f3066272b Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 15 Oct 2024 19:23:00 +0300 Subject: [PATCH 30/36] qurle/feat/android-tokenized-gradients: fix linter --- src/build/helpers/getGradientPointsFromColor.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/build/helpers/getGradientPointsFromColor.ts b/src/build/helpers/getGradientPointsFromColor.ts index 5716796ad..81d6cc88f 100644 --- a/src/build/helpers/getGradientPointsFromColor.ts +++ b/src/build/helpers/getGradientPointsFromColor.ts @@ -4,7 +4,6 @@ import type { Property } from 'csstype'; import { GradientPoints } from '@/interfaces/general/gradients'; import { getVariableName } from '../themeProcessors/extractVarsNames/extractVarsNames'; - import opacityMap from './opacityMap.json'; export type OpacityPoints = [number, number][]; From 5d79b5d486368471aa396089187d738386476b2f Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 15 Oct 2024 19:40:52 +0300 Subject: [PATCH 31/36] next: update linter --- package.json | 2 +- yarn.lock | 203 ++++++++++++++++++++++++++++----------------------- 2 files changed, 114 insertions(+), 91 deletions(-) diff --git a/package.json b/package.json index be5cd5aba..b84c658f9 100644 --- a/package.json +++ b/package.json @@ -108,7 +108,7 @@ "tscpaths": "0.0.9", "type-fest": "4.26.1", "typescript": "5.2.2", - "typescript-eslint": "7.0.1", + "typescript-eslint": "7.7.1", "webpack": "5.94.0", "webpack-cli": "5.1.4", "webpack-dev-server": "5.0.4", diff --git a/yarn.lock b/yarn.lock index f81c7c128..8cfd92814 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1065,7 +1065,12 @@ dependencies: eslint-visitor-keys "^3.3.0" -"@eslint-community/regexpp@^4.5.1", "@eslint-community/regexpp@^4.6.1": +"@eslint-community/regexpp@^4.10.0": + version "4.11.1" + resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.11.1.tgz#a547badfc719eb3e5f4b556325e542fbe9d7a18f" + integrity sha512-m4DVN9ZqskZoLU5GlWZadwDnYo3vAEydiUayB9widCl9ffWx2IvPnp6n3on5rJmziJSw9Bv+Z3ChDVdMwXCY8Q== + +"@eslint-community/regexpp@^4.6.1": version "4.10.0" resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.10.0.tgz#548f6de556857c8bb73bbee70c35dc82a2e74d63" integrity sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA== @@ -1820,7 +1825,7 @@ dependencies: "@types/istanbul-lib-report" "*" -"@types/json-schema@^7.0.12", "@types/json-schema@^7.0.8", "@types/json-schema@^7.0.9": +"@types/json-schema@^7.0.15", "@types/json-schema@^7.0.8", "@types/json-schema@^7.0.9": version "7.0.15" resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.15.tgz#596a1747233694d50f6ad8a7869fcb6f56cf5841" integrity sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA== @@ -1921,10 +1926,10 @@ resolved "https://registry.yarnpkg.com/@types/retry/-/retry-0.12.2.tgz#ed279a64fa438bb69f2480eda44937912bb7480a" integrity sha512-XISRgDJ2Tc5q4TRqvgJtzsRkFYNJzZrhTdtMoGVBttwzzQJkPnS3WWTFc7kuDRoPtPakl+T+OfdEUjYJj7Jbow== -"@types/semver@^7.5.0": - version "7.5.7" - resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.7.tgz#326f5fdda70d13580777bcaa1bc6fa772a5aef0e" - integrity sha512-/wdoPq1QqkSj9/QOeKkFquEuPzQbHTWAMPH/PaUMB+JuR31lXhlWXRZ52IpfDYVlDOUBvX09uBrPwxGT1hjNBg== +"@types/semver@^7.5.8": + version "7.5.8" + resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.8.tgz#8268a8c57a3e4abd25c165ecd36237db7948a55e" + integrity sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ== "@types/send@*": version "0.17.4" @@ -1986,91 +1991,91 @@ dependencies: "@types/yargs-parser" "*" -"@typescript-eslint/eslint-plugin@7.0.1": - version "7.0.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.0.1.tgz#407daffe09d964d57aceaf3ac51846359fbe61b0" - integrity sha512-OLvgeBv3vXlnnJGIAgCLYKjgMEU+wBGj07MQ/nxAaON+3mLzX7mJbhRYrVGiVvFiXtwFlkcBa/TtmglHy0UbzQ== - dependencies: - "@eslint-community/regexpp" "^4.5.1" - "@typescript-eslint/scope-manager" "7.0.1" - "@typescript-eslint/type-utils" "7.0.1" - "@typescript-eslint/utils" "7.0.1" - "@typescript-eslint/visitor-keys" "7.0.1" +"@typescript-eslint/eslint-plugin@7.7.1": + version "7.7.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.7.1.tgz#50a9044e3e5fe76b22caf64fb7fc1f97614bdbfd" + integrity sha512-KwfdWXJBOviaBVhxO3p5TJiLpNuh2iyXyjmWN0f1nU87pwyvfS0EmjC6ukQVYVFJd/K1+0NWGPDXiyEyQorn0Q== + dependencies: + "@eslint-community/regexpp" "^4.10.0" + "@typescript-eslint/scope-manager" "7.7.1" + "@typescript-eslint/type-utils" "7.7.1" + "@typescript-eslint/utils" "7.7.1" + "@typescript-eslint/visitor-keys" "7.7.1" debug "^4.3.4" graphemer "^1.4.0" - ignore "^5.2.4" + ignore "^5.3.1" natural-compare "^1.4.0" - semver "^7.5.4" - ts-api-utils "^1.0.1" - -"@typescript-eslint/parser@7.0.1": - version "7.0.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-7.0.1.tgz#e9c61d9a5e32242477d92756d36086dc40322eed" - integrity sha512-8GcRRZNzaHxKzBPU3tKtFNing571/GwPBeCvmAUw0yBtfE2XVd0zFKJIMSWkHJcPQi0ekxjIts6L/rrZq5cxGQ== - dependencies: - "@typescript-eslint/scope-manager" "7.0.1" - "@typescript-eslint/types" "7.0.1" - "@typescript-eslint/typescript-estree" "7.0.1" - "@typescript-eslint/visitor-keys" "7.0.1" + semver "^7.6.0" + ts-api-utils "^1.3.0" + +"@typescript-eslint/parser@7.7.1": + version "7.7.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-7.7.1.tgz#f940e9f291cdca40c46cb75916217d3a42d6ceea" + integrity sha512-vmPzBOOtz48F6JAGVS/kZYk4EkXao6iGrD838sp1w3NQQC0W8ry/q641KU4PrG7AKNAf56NOcR8GOpH8l9FPCw== + dependencies: + "@typescript-eslint/scope-manager" "7.7.1" + "@typescript-eslint/types" "7.7.1" + "@typescript-eslint/typescript-estree" "7.7.1" + "@typescript-eslint/visitor-keys" "7.7.1" debug "^4.3.4" -"@typescript-eslint/scope-manager@7.0.1": - version "7.0.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-7.0.1.tgz#611ec8e78c70439b152a805e1b10aaac36de7c00" - integrity sha512-v7/T7As10g3bcWOOPAcbnMDuvctHzCFYCG/8R4bK4iYzdFqsZTbXGln0cZNVcwQcwewsYU2BJLay8j0/4zOk4w== +"@typescript-eslint/scope-manager@7.7.1": + version "7.7.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-7.7.1.tgz#07fe59686ca843f66e3e2b5c151522bc38effab2" + integrity sha512-PytBif2SF+9SpEUKynYn5g1RHFddJUcyynGpztX3l/ik7KmZEv19WCMhUBkHXPU9es/VWGD3/zg3wg90+Dh2rA== dependencies: - "@typescript-eslint/types" "7.0.1" - "@typescript-eslint/visitor-keys" "7.0.1" + "@typescript-eslint/types" "7.7.1" + "@typescript-eslint/visitor-keys" "7.7.1" -"@typescript-eslint/type-utils@7.0.1": - version "7.0.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-7.0.1.tgz#0fba92c1f81cad561d7b3adc812aa1cc0e35cdae" - integrity sha512-YtT9UcstTG5Yqy4xtLiClm1ZpM/pWVGFnkAa90UfdkkZsR1eP2mR/1jbHeYp8Ay1l1JHPyGvoUYR6o3On5Nhmw== +"@typescript-eslint/type-utils@7.7.1": + version "7.7.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-7.7.1.tgz#2f8094edca3bebdaad009008929df645ed9c8743" + integrity sha512-ZksJLW3WF7o75zaBPScdW1Gbkwhd/lyeXGf1kQCxJaOeITscoSl0MjynVvCzuV5boUz/3fOI06Lz8La55mu29Q== dependencies: - "@typescript-eslint/typescript-estree" "7.0.1" - "@typescript-eslint/utils" "7.0.1" + "@typescript-eslint/typescript-estree" "7.7.1" + "@typescript-eslint/utils" "7.7.1" debug "^4.3.4" - ts-api-utils "^1.0.1" + ts-api-utils "^1.3.0" -"@typescript-eslint/types@7.0.1": - version "7.0.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-7.0.1.tgz#dcfabce192db5b8bf77ea3c82cfaabe6e6a3c901" - integrity sha512-uJDfmirz4FHib6ENju/7cz9SdMSkeVvJDK3VcMFvf/hAShg8C74FW+06MaQPODHfDJp/z/zHfgawIJRjlu0RLg== +"@typescript-eslint/types@7.7.1": + version "7.7.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-7.7.1.tgz#f903a651fb004c75add08e4e9e207f169d4b98d7" + integrity sha512-AmPmnGW1ZLTpWa+/2omPrPfR7BcbUU4oha5VIbSbS1a1Tv966bklvLNXxp3mrbc+P2j4MNOTfDffNsk4o0c6/w== -"@typescript-eslint/typescript-estree@7.0.1": - version "7.0.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-7.0.1.tgz#1d52ac03da541693fa5bcdc13ad655def5046faf" - integrity sha512-SO9wHb6ph0/FN5OJxH4MiPscGah5wjOd0RRpaLvuBv9g8565Fgu0uMySFEPqwPHiQU90yzJ2FjRYKGrAhS1xig== +"@typescript-eslint/typescript-estree@7.7.1": + version "7.7.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-7.7.1.tgz#5cafde48fe390fe1c1b329b2ce0ba8a73c1e87b2" + integrity sha512-CXe0JHCXru8Fa36dteXqmH2YxngKJjkQLjxzoj6LYwzZ7qZvgsLSc+eqItCrqIop8Vl2UKoAi0StVWu97FQZIQ== dependencies: - "@typescript-eslint/types" "7.0.1" - "@typescript-eslint/visitor-keys" "7.0.1" + "@typescript-eslint/types" "7.7.1" + "@typescript-eslint/visitor-keys" "7.7.1" debug "^4.3.4" globby "^11.1.0" is-glob "^4.0.3" - minimatch "9.0.3" - semver "^7.5.4" - ts-api-utils "^1.0.1" + minimatch "^9.0.4" + semver "^7.6.0" + ts-api-utils "^1.3.0" -"@typescript-eslint/utils@7.0.1": - version "7.0.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-7.0.1.tgz#b8ceac0ba5fef362b4a03a33c0e1fedeea3734ed" - integrity sha512-oe4his30JgPbnv+9Vef1h48jm0S6ft4mNwi9wj7bX10joGn07QRfqIqFHoMiajrtoU88cIhXf8ahwgrcbNLgPA== +"@typescript-eslint/utils@7.7.1": + version "7.7.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-7.7.1.tgz#5d161f2b4a55e1bc38b634bebb921e4bd4e4a16e" + integrity sha512-QUvBxPEaBXf41ZBbaidKICgVL8Hin0p6prQDu6bbetWo39BKbWJxRsErOzMNT1rXvTll+J7ChrbmMCXM9rsvOQ== dependencies: "@eslint-community/eslint-utils" "^4.4.0" - "@types/json-schema" "^7.0.12" - "@types/semver" "^7.5.0" - "@typescript-eslint/scope-manager" "7.0.1" - "@typescript-eslint/types" "7.0.1" - "@typescript-eslint/typescript-estree" "7.0.1" - semver "^7.5.4" - -"@typescript-eslint/visitor-keys@7.0.1": - version "7.0.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-7.0.1.tgz#864680ac5a8010ec4814f8a818e57595f79f464e" - integrity sha512-hwAgrOyk++RTXrP4KzCg7zB2U0xt7RUU0ZdMSCsqF3eKUwkdXUMyTb0qdCuji7VIbcpG62kKTU9M1J1c9UpFBw== - dependencies: - "@typescript-eslint/types" "7.0.1" - eslint-visitor-keys "^3.4.1" + "@types/json-schema" "^7.0.15" + "@types/semver" "^7.5.8" + "@typescript-eslint/scope-manager" "7.7.1" + "@typescript-eslint/types" "7.7.1" + "@typescript-eslint/typescript-estree" "7.7.1" + semver "^7.6.0" + +"@typescript-eslint/visitor-keys@7.7.1": + version "7.7.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-7.7.1.tgz#da2294796220bb0f3b4add5ecbb1b9c3f4f65798" + integrity sha512-gBL3Eq25uADw1LQ9kVpf3hRM+DWzs0uZknHYK3hq4jcTPqVCClHGDnB6UUUV2SFeBeA4KWHWbbLqmbGcZ4FYbw== + dependencies: + "@typescript-eslint/types" "7.7.1" + eslint-visitor-keys "^3.4.3" "@ungap/structured-clone@^1.0.0", "@ungap/structured-clone@^1.2.0": version "1.2.0" @@ -4974,6 +4979,11 @@ ignore@^5.1.1, ignore@^5.2.0, ignore@^5.2.4: resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.3.1.tgz#5073e554cd42c5b33b394375f538b8593e34d4ef" integrity sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw== +ignore@^5.3.1: + version "5.3.2" + resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.3.2.tgz#3cd40e729f3643fd87cb04e50bf0eb722bc596f5" + integrity sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g== + import-fresh@^3.2.1, import-fresh@^3.3.0: version "3.3.0" resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b" @@ -6495,13 +6505,6 @@ minimalistic-assert@^1.0.0: resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7" integrity sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A== -minimatch@9.0.3, minimatch@^9.0.1: - version "9.0.3" - resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-9.0.3.tgz#a6e00c3de44c3a542bfaae70abfc22420a6da825" - integrity sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg== - dependencies: - brace-expansion "^2.0.1" - minimatch@^3.0.4, minimatch@^3.0.5, minimatch@^3.1.1, minimatch@^3.1.2: version "3.1.2" resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.1.2.tgz#19cd194bfd3e428f049a70817c038d89ab4be35b" @@ -6523,6 +6526,20 @@ minimatch@^7.4.3: dependencies: brace-expansion "^2.0.1" +minimatch@^9.0.1: + version "9.0.3" + resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-9.0.3.tgz#a6e00c3de44c3a542bfaae70abfc22420a6da825" + integrity sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg== + dependencies: + brace-expansion "^2.0.1" + +minimatch@^9.0.4: + version "9.0.5" + resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-9.0.5.tgz#d74f9dd6b57d83d8e98cfb82133b03978bc929e5" + integrity sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow== + dependencies: + brace-expansion "^2.0.1" + minimist@^1.2.0, minimist@^1.2.6: version "1.2.8" resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c" @@ -7697,6 +7714,11 @@ semver@^7.3.2, semver@^7.3.4, semver@^7.5.3, semver@^7.5.4: dependencies: lru-cache "^6.0.0" +semver@^7.6.0: + version "7.6.3" + resolved "https://registry.yarnpkg.com/semver/-/semver-7.6.3.tgz#980f7b5550bc175fb4dc09403085627f9eb33143" + integrity sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A== + send@0.18.0: version "0.18.0" resolved "https://registry.yarnpkg.com/send/-/send-0.18.0.tgz#670167cc654b05f5aa4a767f9113bb371bc706be" @@ -8371,10 +8393,10 @@ trough@^2.0.0: resolved "https://registry.yarnpkg.com/trough/-/trough-2.2.0.tgz#94a60bd6bd375c152c1df911a4b11d5b0256f50f" integrity sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw== -ts-api-utils@^1.0.1: - version "1.2.1" - resolved "https://registry.yarnpkg.com/ts-api-utils/-/ts-api-utils-1.2.1.tgz#f716c7e027494629485b21c0df6180f4d08f5e8b" - integrity sha512-RIYA36cJn2WiH9Hy77hdF9r7oEwxAtB/TS9/S4Qd90Ap4z5FSiin5zEiTL44OII1Y3IIlEvxwxFUVgrHSZ/UpA== +ts-api-utils@^1.3.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/ts-api-utils/-/ts-api-utils-1.3.0.tgz#4b490e27129f1e8e686b45cc4ab63714dc60eea1" + integrity sha512-UQMIo7pb8WRomKR1/+MFVLTroIvDVtMX3K6OUir8ynLyzB8Jeriont2bTAtmNPa1ekAgN7YPDyf6V+ygrdU+eQ== ts-jest@29.2.4: version "29.2.4" @@ -8545,13 +8567,14 @@ typed-array-length@^1.0.4: for-each "^0.3.3" is-typed-array "^1.1.9" -typescript-eslint@7.0.1: - version "7.0.1" - resolved "https://registry.yarnpkg.com/typescript-eslint/-/typescript-eslint-7.0.1.tgz#b5b960b07f8be39015f3ec8b9ebd4f35679af901" - integrity sha512-aIquOfwHkGHrMSH57HxLT+1Qzp99YtGxEHXMRD+BXOc8fkuFBbA5BXsMYnoVXFuXOWBdXg8U2rN9Xe4p7LrPSQ== +typescript-eslint@7.7.1: + version "7.7.1" + resolved "https://registry.yarnpkg.com/typescript-eslint/-/typescript-eslint-7.7.1.tgz#16f82e83bb0955af02f258cb7a9de59e1bfb8706" + integrity sha512-ykEBfa3xx3odjZy6GRED4SCPrjo0rgHwstLlEgLX4EMEuv7QeIDSmfV+S6Kk+XkbsYn4BDEcPvsci1X26lRpMQ== dependencies: - "@typescript-eslint/eslint-plugin" "7.0.1" - "@typescript-eslint/parser" "7.0.1" + "@typescript-eslint/eslint-plugin" "7.7.1" + "@typescript-eslint/parser" "7.7.1" + "@typescript-eslint/utils" "7.7.1" typescript@5.2.2: version "5.2.2" From f1134fef72bb9ac63ca6c4fedbc6a2994ea83a86 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 15 Oct 2024 20:09:06 +0300 Subject: [PATCH 32/36] fix/overlay-secondary: fix base vk color overlay states --- src/themeDescriptions/base/vk.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/themeDescriptions/base/vk.ts b/src/themeDescriptions/base/vk.ts index f8443fc3a..80330ce45 100644 --- a/src/themeDescriptions/base/vk.ts +++ b/src/themeDescriptions/base/vk.ts @@ -222,7 +222,11 @@ export const colorFromFigma = (colorsScheme: 'light' | 'dark'): ColorsDescriptio // Other colorOverlayPrimary: other.overlay_primary, - colorOverlaySecondary: 'rgba(0, 0, 0, 0.27)', + colorOverlaySecondary: { + normal: 'rgba(0, 0, 0, 0.27)', + hover: 'rgba(0, 0, 0, 0.31)', + active: 'rgba(0, 0, 0, 0.35)', + }, colorAvatarOverlay: other.avatar_overlay_alpha, colorAvatarOverlayInverseAlpha: other.avatar_overlay_inverse_alpha, colorActionSheetText: other.action_sheet_text, From 63f6b4af21da40db0699b5c474102a69871a76f4 Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Tue, 15 Oct 2024 20:09:58 +0300 Subject: [PATCH 33/36] fix/overlay-secondary: fix snapshots --- .../__snapshots__/snapthots.test.ts.snap | 176 +++++++++--------- 1 file changed, 88 insertions(+), 88 deletions(-) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index a4b05e398..88518e0e3 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -58377,7 +58377,7 @@ exports[`shapshots dobro theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -61166,7 +61166,7 @@ exports[`shapshots dobro theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -62211,7 +62211,7 @@ exports[`shapshots dobro theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -63256,7 +63256,7 @@ exports[`shapshots dobro theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -64930,7 +64930,7 @@ exports[`shapshots dobroDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -67723,7 +67723,7 @@ exports[`shapshots dobroDark theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -68769,7 +68769,7 @@ exports[`shapshots dobroDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -69815,7 +69815,7 @@ exports[`shapshots dobroDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -180416,7 +180416,7 @@ exports[`shapshots octaviusVK theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -186585,7 +186585,7 @@ exports[`shapshots octaviusVK theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -188825,7 +188825,7 @@ exports[`shapshots octaviusVK theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -191065,7 +191065,7 @@ exports[`shapshots octaviusVK theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -194114,7 +194114,7 @@ exports[`shapshots octaviusVKDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -200283,7 +200283,7 @@ exports[`shapshots octaviusVKDark theme should match pixelify theme snapshot 1`] "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -202523,7 +202523,7 @@ exports[`shapshots octaviusVKDark theme should match pseudo theme from CssVars 1 "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -204763,7 +204763,7 @@ exports[`shapshots octaviusVKDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -339414,7 +339414,7 @@ exports[`shapshots tutoria theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -342723,7 +342723,7 @@ exports[`shapshots tutoria theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -343926,7 +343926,7 @@ exports[`shapshots tutoria theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -345129,7 +345129,7 @@ exports[`shapshots tutoria theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -346961,7 +346961,7 @@ exports[`shapshots tutoriaDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -350274,7 +350274,7 @@ exports[`shapshots tutoriaDark theme should match pixelify theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -351478,7 +351478,7 @@ exports[`shapshots tutoriaDark theme should match pseudo theme from CssVars 1`] "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -352682,7 +352682,7 @@ exports[`shapshots tutoriaDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -354515,7 +354515,7 @@ exports[`shapshots vkAccessibility theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -357222,7 +357222,7 @@ exports[`shapshots vkAccessibility theme should match pixelify theme snapshot 1` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -358233,7 +358233,7 @@ exports[`shapshots vkAccessibility theme should match pseudo theme from CssVars "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -359244,7 +359244,7 @@ exports[`shapshots vkAccessibility theme should match root theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -360884,7 +360884,7 @@ exports[`shapshots vkAccessibilityDark theme should match cssVars snapshot 1`] = "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -363591,7 +363591,7 @@ exports[`shapshots vkAccessibilityDark theme should match pixelify theme snapsho "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -364602,7 +364602,7 @@ exports[`shapshots vkAccessibilityDark theme should match pseudo theme from CssV "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -365613,7 +365613,7 @@ exports[`shapshots vkAccessibilityDark theme should match root theme snapshot 1` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -367253,7 +367253,7 @@ exports[`shapshots vkAccessibilityIOS theme should match cssVars snapshot 1`] = "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -369960,7 +369960,7 @@ exports[`shapshots vkAccessibilityIOS theme should match pixelify theme snapshot "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -370971,7 +370971,7 @@ exports[`shapshots vkAccessibilityIOS theme should match pseudo theme from CssVa "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -371982,7 +371982,7 @@ exports[`shapshots vkAccessibilityIOS theme should match root theme snapshot 1`] "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -373622,7 +373622,7 @@ exports[`shapshots vkAccessibilityIOSDark theme should match cssVars snapshot 1` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -376329,7 +376329,7 @@ exports[`shapshots vkAccessibilityIOSDark theme should match pixelify theme snap "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -377340,7 +377340,7 @@ exports[`shapshots vkAccessibilityIOSDark theme should match pseudo theme from C "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -378351,7 +378351,7 @@ exports[`shapshots vkAccessibilityIOSDark theme should match root theme snapshot "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -379991,7 +379991,7 @@ exports[`shapshots vkBase theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -382694,7 +382694,7 @@ exports[`shapshots vkBase theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -383704,7 +383704,7 @@ exports[`shapshots vkBase theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -384714,7 +384714,7 @@ exports[`shapshots vkBase theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -386353,7 +386353,7 @@ exports[`shapshots vkBaseDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -389060,7 +389060,7 @@ exports[`shapshots vkBaseDark theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -390071,7 +390071,7 @@ exports[`shapshots vkBaseDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -391082,7 +391082,7 @@ exports[`shapshots vkBaseDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -405460,7 +405460,7 @@ exports[`shapshots vkIOS theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -408167,7 +408167,7 @@ exports[`shapshots vkIOS theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -409178,7 +409178,7 @@ exports[`shapshots vkIOS theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -410189,7 +410189,7 @@ exports[`shapshots vkIOS theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -411829,7 +411829,7 @@ exports[`shapshots vkIOSDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -414536,7 +414536,7 @@ exports[`shapshots vkIOSDark theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -415547,7 +415547,7 @@ exports[`shapshots vkIOSDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -416558,7 +416558,7 @@ exports[`shapshots vkIOSDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -418198,7 +418198,7 @@ exports[`shapshots vkIdOk theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -420901,7 +420901,7 @@ exports[`shapshots vkIdOk theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -421911,7 +421911,7 @@ exports[`shapshots vkIdOk theme should match pseudo theme from CssVars 1`] = ` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -422921,7 +422921,7 @@ exports[`shapshots vkIdOk theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -424560,7 +424560,7 @@ exports[`shapshots vkIdOkDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -427267,7 +427267,7 @@ exports[`shapshots vkIdOkDark theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -428278,7 +428278,7 @@ exports[`shapshots vkIdOkDark theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -429289,7 +429289,7 @@ exports[`shapshots vkIdOkDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -430929,7 +430929,7 @@ exports[`shapshots vkIdOkIOS theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -433636,7 +433636,7 @@ exports[`shapshots vkIdOkIOS theme should match pixelify theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -434647,7 +434647,7 @@ exports[`shapshots vkIdOkIOS theme should match pseudo theme from CssVars 1`] = "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -435658,7 +435658,7 @@ exports[`shapshots vkIdOkIOS theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -437298,7 +437298,7 @@ exports[`shapshots vkIdOkIOSDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -440005,7 +440005,7 @@ exports[`shapshots vkIdOkIOSDark theme should match pixelify theme snapshot 1`] "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -441016,7 +441016,7 @@ exports[`shapshots vkIdOkIOSDark theme should match pseudo theme from CssVars 1` "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -442027,7 +442027,7 @@ exports[`shapshots vkIdOkIOSDark theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -443667,7 +443667,7 @@ exports[`shapshots vkontakteAndroid theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -447630,7 +447630,7 @@ exports[`shapshots vkontakteAndroid theme should match pixelify theme snapshot 1 "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -449051,7 +449051,7 @@ exports[`shapshots vkontakteAndroid theme should match pseudo theme from CssVars "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -450472,7 +450472,7 @@ exports[`shapshots vkontakteAndroid theme should match root theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -452522,7 +452522,7 @@ exports[`shapshots vkontakteAndroidDark theme should match cssVars snapshot 1`] "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -456485,7 +456485,7 @@ exports[`shapshots vkontakteAndroidDark theme should match pixelify theme snapsh "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -457906,7 +457906,7 @@ exports[`shapshots vkontakteAndroidDark theme should match pseudo theme from Css "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -459327,7 +459327,7 @@ exports[`shapshots vkontakteAndroidDark theme should match root theme snapshot 1 "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -478767,7 +478767,7 @@ exports[`shapshots vkontakteIOS theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -482618,7 +482618,7 @@ exports[`shapshots vkontakteIOS theme should match pixelify theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -484023,7 +484023,7 @@ exports[`shapshots vkontakteIOS theme should match pseudo theme from CssVars 1`] "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -485428,7 +485428,7 @@ exports[`shapshots vkontakteIOS theme should match root theme snapshot 1`] = ` "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -487462,7 +487462,7 @@ exports[`shapshots vkontakteIOSDark theme should match cssVars snapshot 1`] = ` "colorOverlaySecondary": { "active": { "name": "--vkui--color_overlay_secondary--active", - "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "value": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", }, "hover": { "name": "--vkui--color_overlay_secondary--hover", @@ -491313,7 +491313,7 @@ exports[`shapshots vkontakteIOSDark theme should match pixelify theme snapshot 1 "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, @@ -492718,7 +492718,7 @@ exports[`shapshots vkontakteIOSDark theme should match pseudo theme from CssVars "normal": "var(--vkui--color_overlay_primary, rgba(0, 0, 0, 0.40))", }, "colorOverlaySecondary": { - "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35000000000000003))", + "active": "var(--vkui--color_overlay_secondary--active, rgba(0, 0, 0, 0.35))", "hover": "var(--vkui--color_overlay_secondary--hover, rgba(0, 0, 0, 0.31))", "normal": "var(--vkui--color_overlay_secondary, rgba(0, 0, 0, 0.27))", }, @@ -494123,7 +494123,7 @@ exports[`shapshots vkontakteIOSDark theme should match root theme snapshot 1`] = "normal": "rgba(0, 0, 0, 0.40)", }, "colorOverlaySecondary": { - "active": "rgba(0, 0, 0, 0.35000000000000003)", + "active": "rgba(0, 0, 0, 0.35)", "hover": "rgba(0, 0, 0, 0.31)", "normal": "rgba(0, 0, 0, 0.27)", }, From eee387081533ff66fbb2511773d8d08efb4fe9fb Mon Sep 17 00:00:00 2001 From: nick Date: Tue, 15 Oct 2024 20:57:28 +0300 Subject: [PATCH 34/36] feat(vkBase, Paradigm): Added colorBackgroundContentInverse --- src/interfaces/general/colors/index.ts | 6 ++++++ src/themeDescriptions/base/paradigm.ts | 2 ++ src/themeDescriptions/base/vk.ts | 4 ++++ 3 files changed, 12 insertions(+) diff --git a/src/interfaces/general/colors/index.ts b/src/interfaces/general/colors/index.ts index 720e29ead..6c664acf9 100644 --- a/src/interfaces/general/colors/index.ts +++ b/src/interfaces/general/colors/index.ts @@ -75,6 +75,12 @@ export interface ColorsDescriptionStruct { */ colorBackgroundContent: ColorDescription; + /** + * @desc Цвет фона, противоположный фону контента. + * @tags color, background + */ + colorBackgroundContentInverse: ColorDescription; + /** * @desc Второстепенный цвет фона * @tags color, background diff --git a/src/themeDescriptions/base/paradigm.ts b/src/themeDescriptions/base/paradigm.ts index ba265a6fa..9786b2d61 100644 --- a/src/themeDescriptions/base/paradigm.ts +++ b/src/themeDescriptions/base/paradigm.ts @@ -31,6 +31,7 @@ export const lightColors: ColorsDescription = { colorBackgroundAccentThemedAlpha: 'rgba(0, 119, 255, 0.2)', colorBackgroundAccentAlternative: '#FF9E00', colorBackgroundContent: '#FFFFFF', + colorBackgroundContentInverse: colorBackgroundContentDark, colorBackgroundSecondary: '#F0F1F3', colorBackgroundSecondaryAlpha: { normal: 'rgba(0, 16, 61, 0.06)', @@ -170,6 +171,7 @@ export const darkColors: ColorsDescription = { colorBackgroundAccentThemedAlpha: 'rgba(255, 255, 255, 0.2)', colorBackgroundAccentAlternative: '#FF9E00', colorBackgroundContent: colorBackgroundContentDark, + colorBackgroundContentInverse: '#FFFFFF', colorBackgroundSecondary: '#2A2A2B', colorBackgroundSecondaryAlpha: { normal: 'rgba(255, 255, 255, 0.12)', diff --git a/src/themeDescriptions/base/vk.ts b/src/themeDescriptions/base/vk.ts index e5096aa50..06f4fb07f 100644 --- a/src/themeDescriptions/base/vk.ts +++ b/src/themeDescriptions/base/vk.ts @@ -37,6 +37,10 @@ export const colorFromFigma = (colorsScheme: 'light' | 'dark'): ColorsDescriptio }[colorsScheme], colorBackground: background.background, colorBackgroundContent: background.background_content, + colorBackgroundContentInverse: { + light: '#19191A', + dark: '#FFFFFF', + }[colorsScheme], colorBackgroundSecondary: background.background_secondary, colorBackgroundSecondaryAlpha: { light: { From c7e45300bdff03fe1d59dee0e752c01c38f960ab Mon Sep 17 00:00:00 2001 From: nick Date: Tue, 15 Oct 2024 21:01:47 +0300 Subject: [PATCH 35/36] snapshots and tests --- .../__snapshots__/snapthots.test.ts.snap | 1653 +++++++++++++++++ 1 file changed, 1653 insertions(+) diff --git a/src/build/__snapshots__/snapthots.test.ts.snap b/src/build/__snapshots__/snapthots.test.ts.snap index b79959f27..be2c2e6be 100644 --- a/src/build/__snapshots__/snapthots.test.ts.snap +++ b/src/build/__snapshots__/snapthots.test.ts.snap @@ -2174,6 +2174,20 @@ exports[`shapshots calendar theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -7361,6 +7375,11 @@ exports[`shapshots calendar theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -9447,6 +9466,11 @@ exports[`shapshots calendar theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -11533,6 +11557,11 @@ exports[`shapshots calendar theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -15026,6 +15055,20 @@ exports[`shapshots calendarDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -20213,6 +20256,11 @@ exports[`shapshots calendarDark theme should match pixelify theme snapshot 1`] = "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -22299,6 +22347,11 @@ exports[`shapshots calendarDark theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -24385,6 +24438,11 @@ exports[`shapshots calendarDark theme should match root theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -26128,6 +26186,20 @@ exports[`shapshots calls theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -30389,6 +30461,11 @@ exports[`shapshots calls theme should match pixelify theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -31762,6 +31839,11 @@ exports[`shapshots calls theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -33135,6 +33217,11 @@ exports[`shapshots calls theme should match root theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -35783,6 +35870,20 @@ exports[`shapshots cloud theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -40904,6 +41005,11 @@ exports[`shapshots cloud theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -42771,6 +42877,11 @@ exports[`shapshots cloud theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -44638,6 +44749,11 @@ exports[`shapshots cloud theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -47420,6 +47536,20 @@ exports[`shapshots cloudDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -52415,6 +52545,11 @@ exports[`shapshots cloudDark theme should match pixelify theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -54243,6 +54378,11 @@ exports[`shapshots cloudDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -56071,6 +56211,11 @@ exports[`shapshots cloudDark theme should match root theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -57772,6 +57917,20 @@ exports[`shapshots dobro theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -60950,6 +61109,11 @@ exports[`shapshots dobro theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -61995,6 +62159,11 @@ exports[`shapshots dobro theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -63040,6 +63209,11 @@ exports[`shapshots dobro theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -64325,6 +64499,20 @@ exports[`shapshots dobroDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -67507,6 +67695,11 @@ exports[`shapshots dobroDark theme should match pixelify theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -68553,6 +68746,11 @@ exports[`shapshots dobroDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -69599,6 +69797,11 @@ exports[`shapshots dobroDark theme should match root theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -70919,6 +71122,20 @@ exports[`shapshots home theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -75294,6 +75511,11 @@ exports[`shapshots home theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -76709,6 +76931,11 @@ exports[`shapshots home theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -78124,6 +78351,11 @@ exports[`shapshots home theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -79806,6 +80038,20 @@ exports[`shapshots homeDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -84177,6 +84423,11 @@ exports[`shapshots homeDark theme should match pixelify theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -85591,6 +85842,11 @@ exports[`shapshots homeDark theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -87005,6 +87261,11 @@ exports[`shapshots homeDark theme should match root theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -88694,6 +88955,20 @@ exports[`shapshots media theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -94755,6 +95030,11 @@ exports[`shapshots media theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -96609,6 +96889,11 @@ exports[`shapshots media theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -98463,6 +98748,11 @@ exports[`shapshots media theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -100584,6 +100874,20 @@ exports[`shapshots mediaDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -106645,6 +106949,11 @@ exports[`shapshots mediaDark theme should match pixelify theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -108499,6 +108808,11 @@ exports[`shapshots mediaDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -110353,6 +110667,11 @@ exports[`shapshots mediaDark theme should match root theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -112474,6 +112793,20 @@ exports[`shapshots mycom theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -118541,6 +118874,11 @@ exports[`shapshots mycom theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -120398,6 +120736,11 @@ exports[`shapshots mycom theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -122255,6 +122598,11 @@ exports[`shapshots mycom theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -124385,6 +124733,20 @@ exports[`shapshots octavius theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -131135,6 +131497,11 @@ exports[`shapshots octavius theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -133392,6 +133759,11 @@ exports[`shapshots octavius theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -135649,6 +136021,11 @@ exports[`shapshots octavius theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -138182,6 +138559,20 @@ exports[`shapshots octaviusCompact theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -144936,6 +145327,11 @@ exports[`shapshots octaviusCompact theme should match pixelify theme snapshot 1` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -147194,6 +147590,11 @@ exports[`shapshots octaviusCompact theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -149452,6 +149853,11 @@ exports[`shapshots octaviusCompact theme should match root theme snapshot 1`] = "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -151986,6 +152392,20 @@ exports[`shapshots octaviusCompactDark theme should match cssVars snapshot 1`] = "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -158740,6 +159160,11 @@ exports[`shapshots octaviusCompactDark theme should match pixelify theme snapsho "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -160998,6 +161423,11 @@ exports[`shapshots octaviusCompactDark theme should match pseudo theme from CssV "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -163256,6 +163686,11 @@ exports[`shapshots octaviusCompactDark theme should match root theme snapshot 1` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -165790,6 +166225,20 @@ exports[`shapshots octaviusDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -172540,6 +172989,11 @@ exports[`shapshots octaviusDark theme should match pixelify theme snapshot 1`] = "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -174797,6 +175251,11 @@ exports[`shapshots octaviusDark theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -177054,6 +177513,11 @@ exports[`shapshots octaviusDark theme should match root theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -179587,6 +180051,20 @@ exports[`shapshots octaviusVK theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -186289,6 +186767,11 @@ exports[`shapshots octaviusVK theme should match pixelify theme snapshot 1`] = ` "hover": "#E4E5E9", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -188529,6 +189012,11 @@ exports[`shapshots octaviusVK theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #E4E5E9)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -190769,6 +191257,11 @@ exports[`shapshots octaviusVK theme should match root theme snapshot 1`] = ` "hover": "#E4E5E9", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -193285,6 +193778,20 @@ exports[`shapshots octaviusVKDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #19191A)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -199987,6 +200494,11 @@ exports[`shapshots octaviusVKDark theme should match pixelify theme snapshot 1`] "hover": "#2B2B2C", "normal": "#19191A", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -202227,6 +202739,11 @@ exports[`shapshots octaviusVKDark theme should match pseudo theme from CssVars 1 "hover": "var(--vkui--color_background_content--hover, #2B2B2C)", "normal": "var(--vkui--color_background_content, #19191A)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -204467,6 +204984,11 @@ exports[`shapshots octaviusVKDark theme should match root theme snapshot 1`] = ` "hover": "#2B2B2C", "normal": "#19191A", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -206983,6 +207505,20 @@ exports[`shapshots octaviusWhite theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -213733,6 +214269,11 @@ exports[`shapshots octaviusWhite theme should match pixelify theme snapshot 1`] "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -215990,6 +216531,11 @@ exports[`shapshots octaviusWhite theme should match pseudo theme from CssVars 1` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -218247,6 +218793,11 @@ exports[`shapshots octaviusWhite theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -220780,6 +221331,20 @@ exports[`shapshots octaviusWhiteDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -227530,6 +228095,11 @@ exports[`shapshots octaviusWhiteDark theme should match pixelify theme snapshot "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -229787,6 +230357,11 @@ exports[`shapshots octaviusWhiteDark theme should match pseudo theme from CssVar "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -232044,6 +232619,11 @@ exports[`shapshots octaviusWhiteDark theme should match root theme snapshot 1`] "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -234559,6 +235139,20 @@ exports[`shapshots otvet theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -238694,6 +239288,11 @@ exports[`shapshots otvet theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -240020,6 +240619,11 @@ exports[`shapshots otvet theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -241346,6 +241950,11 @@ exports[`shapshots otvet theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -242939,6 +243548,20 @@ exports[`shapshots otvetDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #191919)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -247074,6 +247697,11 @@ exports[`shapshots otvetDark theme should match pixelify theme snapshot 1`] = ` "hover": "#2B2B2B", "normal": "#191919", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -248400,6 +249028,11 @@ exports[`shapshots otvetDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #2B2B2B)", "normal": "var(--vkui--color_background_content, #191919)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -249726,6 +250359,11 @@ exports[`shapshots otvetDark theme should match root theme snapshot 1`] = ` "hover": "#2B2B2B", "normal": "#191919", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -251323,6 +251961,20 @@ exports[`shapshots paradigmBase theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -255612,6 +256264,11 @@ exports[`shapshots paradigmBase theme should match pixelify theme snapshot 1`] = "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -256998,6 +257655,11 @@ exports[`shapshots paradigmBase theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -258384,6 +259046,11 @@ exports[`shapshots paradigmBase theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -260037,6 +260704,20 @@ exports[`shapshots paradigmBaseDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -264330,6 +265011,11 @@ exports[`shapshots paradigmBaseDark theme should match pixelify theme snapshot 1 "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -265717,6 +266403,11 @@ exports[`shapshots paradigmBaseDark theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -267104,6 +267795,11 @@ exports[`shapshots paradigmBaseDark theme should match root theme snapshot 1`] = "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -268766,6 +269462,20 @@ exports[`shapshots pharma theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -274841,6 +275551,11 @@ exports[`shapshots pharma theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -276700,6 +277415,11 @@ exports[`shapshots pharma theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -278559,6 +279279,11 @@ exports[`shapshots pharma theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -280677,6 +281402,20 @@ exports[`shapshots portalUI theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -285286,6 +286025,11 @@ exports[`shapshots portalUI theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -286779,6 +287523,11 @@ exports[`shapshots portalUI theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -288272,6 +289021,11 @@ exports[`shapshots portalUI theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -290032,6 +290786,20 @@ exports[`shapshots portalUIDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -294637,6 +295405,11 @@ exports[`shapshots portalUIDark theme should match pixelify theme snapshot 1`] = "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -296129,6 +296902,11 @@ exports[`shapshots portalUIDark theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -297621,6 +298399,11 @@ exports[`shapshots portalUIDark theme should match root theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -299396,6 +300179,20 @@ exports[`shapshots promo theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -304485,6 +305282,11 @@ exports[`shapshots promo theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -306111,6 +306913,11 @@ exports[`shapshots promo theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -307737,6 +308544,11 @@ exports[`shapshots promo theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -319652,6 +320464,20 @@ exports[`shapshots search theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -324947,6 +325773,11 @@ exports[`shapshots search theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -326589,6 +327420,11 @@ exports[`shapshots search theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -328231,6 +329067,11 @@ exports[`shapshots search theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -330140,6 +330981,20 @@ exports[`shapshots todo theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -334433,6 +335288,11 @@ exports[`shapshots todo theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -335820,6 +336680,11 @@ exports[`shapshots todo theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -337207,6 +338072,11 @@ exports[`shapshots todo theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -338809,6 +339679,20 @@ exports[`shapshots tutoria theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -342507,6 +343391,11 @@ exports[`shapshots tutoria theme should match pixelify theme snapshot 1`] = ` "hover": "#F4F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#E9ECEF", "hover": "#F4F5F7", @@ -343710,6 +344599,11 @@ exports[`shapshots tutoria theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F4F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #E9ECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F4F5F7)", @@ -344913,6 +345807,11 @@ exports[`shapshots tutoria theme should match root theme snapshot 1`] = ` "hover": "#F4F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#E9ECEF", "hover": "#F4F5F7", @@ -346356,6 +347255,20 @@ exports[`shapshots tutoriaDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #EBECEF)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #F5F5F7)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -350058,6 +350971,11 @@ exports[`shapshots tutoriaDark theme should match pixelify theme snapshot 1`] = "hover": "#18191B", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#EBECEF", + "hover": "#F5F5F7", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -351262,6 +352180,11 @@ exports[`shapshots tutoriaDark theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_content--hover, #18191B)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #EBECEF)", + "hover": "var(--vkui--color_background_content_inverse--hover, #F5F5F7)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -352466,6 +353389,11 @@ exports[`shapshots tutoriaDark theme should match root theme snapshot 1`] = ` "hover": "#18191B", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#EBECEF", + "hover": "#F5F5F7", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -353910,6 +354838,20 @@ exports[`shapshots vkAccessibility theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -357006,6 +357948,11 @@ exports[`shapshots vkAccessibility theme should match pixelify theme snapshot 1` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -358017,6 +358964,11 @@ exports[`shapshots vkAccessibility theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -359028,6 +359980,11 @@ exports[`shapshots vkAccessibility theme should match root theme snapshot 1`] = "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -360279,6 +361236,20 @@ exports[`shapshots vkAccessibilityDark theme should match cssVars snapshot 1`] = "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -363375,6 +364346,11 @@ exports[`shapshots vkAccessibilityDark theme should match pixelify theme snapsho "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -364386,6 +365362,11 @@ exports[`shapshots vkAccessibilityDark theme should match pseudo theme from CssV "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -365397,6 +366378,11 @@ exports[`shapshots vkAccessibilityDark theme should match root theme snapshot 1` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -366648,6 +367634,20 @@ exports[`shapshots vkAccessibilityIOS theme should match cssVars snapshot 1`] = "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -369744,6 +370744,11 @@ exports[`shapshots vkAccessibilityIOS theme should match pixelify theme snapshot "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -370755,6 +371760,11 @@ exports[`shapshots vkAccessibilityIOS theme should match pseudo theme from CssVa "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -371766,6 +372776,11 @@ exports[`shapshots vkAccessibilityIOS theme should match root theme snapshot 1`] "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -373017,6 +374032,20 @@ exports[`shapshots vkAccessibilityIOSDark theme should match cssVars snapshot 1` "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -376113,6 +377142,11 @@ exports[`shapshots vkAccessibilityIOSDark theme should match pixelify theme snap "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -377124,6 +378158,11 @@ exports[`shapshots vkAccessibilityIOSDark theme should match pseudo theme from C "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -378135,6 +379174,11 @@ exports[`shapshots vkAccessibilityIOSDark theme should match root theme snapshot "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -379386,6 +380430,20 @@ exports[`shapshots vkBase theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -382478,6 +383536,11 @@ exports[`shapshots vkBase theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -383488,6 +384551,11 @@ exports[`shapshots vkBase theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -384498,6 +385566,11 @@ exports[`shapshots vkBase theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -385748,6 +386821,20 @@ exports[`shapshots vkBaseDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -388844,6 +389931,11 @@ exports[`shapshots vkBaseDark theme should match pixelify theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -389855,6 +390947,11 @@ exports[`shapshots vkBaseDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -390866,6 +391963,11 @@ exports[`shapshots vkBaseDark theme should match root theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -392117,6 +393219,20 @@ exports[`shapshots vkCom theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -395213,6 +396329,11 @@ exports[`shapshots vkCom theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -396224,6 +397345,11 @@ exports[`shapshots vkCom theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -397235,6 +398361,11 @@ exports[`shapshots vkCom theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -398486,6 +399617,20 @@ exports[`shapshots vkComDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #222222)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -401582,6 +402727,11 @@ exports[`shapshots vkComDark theme should match pixelify theme snapshot 1`] = ` "hover": "#2B2B2B", "normal": "#222222", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -402593,6 +403743,11 @@ exports[`shapshots vkComDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #2B2B2B)", "normal": "var(--vkui--color_background_content, #222222)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -403604,6 +404759,11 @@ exports[`shapshots vkComDark theme should match root theme snapshot 1`] = ` "hover": "#2B2B2B", "normal": "#222222", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -404855,6 +406015,20 @@ exports[`shapshots vkIOS theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -407951,6 +409125,11 @@ exports[`shapshots vkIOS theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -408962,6 +410141,11 @@ exports[`shapshots vkIOS theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -409973,6 +411157,11 @@ exports[`shapshots vkIOS theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -411224,6 +412413,20 @@ exports[`shapshots vkIOSDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -414320,6 +415523,11 @@ exports[`shapshots vkIOSDark theme should match pixelify theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -415331,6 +416539,11 @@ exports[`shapshots vkIOSDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -416342,6 +417555,11 @@ exports[`shapshots vkIOSDark theme should match root theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -417593,6 +418811,20 @@ exports[`shapshots vkIdOk theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -420685,6 +421917,11 @@ exports[`shapshots vkIdOk theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -421695,6 +422932,11 @@ exports[`shapshots vkIdOk theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -422705,6 +423947,11 @@ exports[`shapshots vkIdOk theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -423955,6 +425202,20 @@ exports[`shapshots vkIdOkDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -427051,6 +428312,11 @@ exports[`shapshots vkIdOkDark theme should match pixelify theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -428062,6 +429328,11 @@ exports[`shapshots vkIdOkDark theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -429073,6 +430344,11 @@ exports[`shapshots vkIdOkDark theme should match root theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -430324,6 +431600,20 @@ exports[`shapshots vkIdOkIOS theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -433420,6 +434710,11 @@ exports[`shapshots vkIdOkIOS theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -434431,6 +435726,11 @@ exports[`shapshots vkIdOkIOS theme should match pseudo theme from CssVars 1`] = "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -435442,6 +436742,11 @@ exports[`shapshots vkIdOkIOS theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -436693,6 +437998,20 @@ exports[`shapshots vkIdOkIOSDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -439789,6 +441108,11 @@ exports[`shapshots vkIdOkIOSDark theme should match pixelify theme snapshot 1`] "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -440800,6 +442124,11 @@ exports[`shapshots vkIdOkIOSDark theme should match pseudo theme from CssVars 1` "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -441811,6 +443140,11 @@ exports[`shapshots vkIdOkIOSDark theme should match root theme snapshot 1`] = ` "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -443062,6 +444396,20 @@ exports[`shapshots vkontakteAndroid theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -447414,6 +448762,11 @@ exports[`shapshots vkontakteAndroid theme should match pixelify theme snapshot 1 "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -448835,6 +450188,11 @@ exports[`shapshots vkontakteAndroid theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -450256,6 +451614,11 @@ exports[`shapshots vkontakteAndroid theme should match root theme snapshot 1`] = "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -451917,6 +453280,20 @@ exports[`shapshots vkontakteAndroidDark theme should match cssVars snapshot 1`] "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -456269,6 +457646,11 @@ exports[`shapshots vkontakteAndroidDark theme should match pixelify theme snapsh "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -457690,6 +459072,11 @@ exports[`shapshots vkontakteAndroidDark theme should match pseudo theme from Css "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -459111,6 +460498,11 @@ exports[`shapshots vkontakteAndroidDark theme should match root theme snapshot 1 "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -460772,6 +462164,20 @@ exports[`shapshots vkontakteCom theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -465012,6 +466418,11 @@ exports[`shapshots vkontakteCom theme should match pixelify theme snapshot 1`] = "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -466417,6 +467828,11 @@ exports[`shapshots vkontakteCom theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -467822,6 +469238,11 @@ exports[`shapshots vkontakteCom theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -469467,6 +470888,20 @@ exports[`shapshots vkontakteComDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #222222)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -473707,6 +475142,11 @@ exports[`shapshots vkontakteComDark theme should match pixelify theme snapshot 1 "hover": "#2B2B2B", "normal": "#222222", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -475112,6 +476552,11 @@ exports[`shapshots vkontakteComDark theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_content--hover, #2B2B2B)", "normal": "var(--vkui--color_background_content, #222222)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -476517,6 +477962,11 @@ exports[`shapshots vkontakteComDark theme should match root theme snapshot 1`] = "hover": "#2B2B2B", "normal": "#222222", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -478162,6 +479612,20 @@ exports[`shapshots vkontakteIOS theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #ffffff)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #17181D)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #18191B)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #19191A)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -482402,6 +483866,11 @@ exports[`shapshots vkontakteIOS theme should match pixelify theme snapshot 1`] = "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -483807,6 +485276,11 @@ exports[`shapshots vkontakteIOS theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #ffffff)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #17181D)", + "hover": "var(--vkui--color_background_content_inverse--hover, #18191B)", + "normal": "var(--vkui--color_background_content_inverse, #19191A)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -485212,6 +486686,11 @@ exports[`shapshots vkontakteIOS theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#ffffff", }, + "colorBackgroundContentInverse": { + "active": "#17181D", + "hover": "#18191B", + "normal": "#19191A", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -486857,6 +488336,20 @@ exports[`shapshots vkontakteIOSDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #19191a)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -491097,6 +492590,11 @@ exports[`shapshots vkontakteIOSDark theme should match pixelify theme snapshot 1 "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -492502,6 +494000,11 @@ exports[`shapshots vkontakteIOSDark theme should match pseudo theme from CssVars "hover": "var(--vkui--color_background_content--hover, #222223)", "normal": "var(--vkui--color_background_content, #19191a)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -493907,6 +495410,11 @@ exports[`shapshots vkontakteIOSDark theme should match root theme snapshot 1`] = "hover": "#222223", "normal": "#19191a", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -495604,6 +497112,20 @@ exports[`shapshots widgets theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -499897,6 +501419,11 @@ exports[`shapshots widgets theme should match pixelify theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -501284,6 +502811,11 @@ exports[`shapshots widgets theme should match pseudo theme from CssVars 1`] = ` "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -502671,6 +504203,11 @@ exports[`shapshots widgets theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -504325,6 +505862,20 @@ exports[`shapshots widgetsDark theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -508618,6 +510169,11 @@ exports[`shapshots widgetsDark theme should match pixelify theme snapshot 1`] = "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -510005,6 +511561,11 @@ exports[`shapshots widgetsDark theme should match pseudo theme from CssVars 1`] "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -511392,6 +512953,11 @@ exports[`shapshots widgetsDark theme should match root theme snapshot 1`] = ` "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -513256,6 +514822,20 @@ exports[`shapshots workspaceAdmin theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #FFFFFF)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #202126)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #222225)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #232324)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -517688,6 +519268,11 @@ exports[`shapshots workspaceAdmin theme should match pixelify theme snapshot 1`] "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -519172,6 +520757,11 @@ exports[`shapshots workspaceAdmin theme should match pseudo theme from CssVars 1 "hover": "var(--vkui--color_background_content--hover, #F5F5F7)", "normal": "var(--vkui--color_background_content, #FFFFFF)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #202126)", + "hover": "var(--vkui--color_background_content_inverse--hover, #222225)", + "normal": "var(--vkui--color_background_content_inverse, #232324)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #EBECEF)", "hover": "var(--vkui--color_background_contrast--hover, #F5F5F7)", @@ -520656,6 +522246,11 @@ exports[`shapshots workspaceAdmin theme should match root theme snapshot 1`] = ` "hover": "#F5F5F7", "normal": "#FFFFFF", }, + "colorBackgroundContentInverse": { + "active": "#202126", + "hover": "#222225", + "normal": "#232324", + }, "colorBackgroundContrast": { "active": "#EBECEF", "hover": "#F5F5F7", @@ -522542,6 +524137,20 @@ exports[`shapshots workspaceAdminDark theme should match cssVars snapshot 1`] = "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -526974,6 +528583,11 @@ exports[`shapshots workspaceAdminDark theme should match pixelify theme snapshot "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -528458,6 +530072,11 @@ exports[`shapshots workspaceAdminDark theme should match pseudo theme from CssVa "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -529942,6 +531561,11 @@ exports[`shapshots workspaceAdminDark theme should match root theme snapshot 1`] "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -531618,6 +533242,20 @@ exports[`shapshots workspaceLandings theme should match cssVars snapshot 1`] = ` "value": "var(--vkui--color_background_content, #232324)", }, }, + "colorBackgroundContentInverse": { + "active": { + "name": "--vkui--color_background_content_inverse--active", + "value": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + }, + "hover": { + "name": "--vkui--color_background_content_inverse--hover", + "value": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + }, + "normal": { + "name": "--vkui--color_background_content_inverse", + "value": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, + }, "colorBackgroundContrast": { "active": { "name": "--vkui--color_background_contrast--active", @@ -535981,6 +537619,11 @@ exports[`shapshots workspaceLandings theme should match pixelify theme snapshot "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", @@ -537393,6 +539036,11 @@ exports[`shapshots workspaceLandings theme should match pseudo theme from CssVar "hover": "var(--vkui--color_background_content--hover, #2C2C2D)", "normal": "var(--vkui--color_background_content, #232324)", }, + "colorBackgroundContentInverse": { + "active": "var(--vkui--color_background_content_inverse--active, #D7D8DB)", + "hover": "var(--vkui--color_background_content_inverse--hover, #EBEDF0)", + "normal": "var(--vkui--color_background_content_inverse, #FFFFFF)", + }, "colorBackgroundContrast": { "active": "var(--vkui--color_background_contrast--active, #D7D8DB)", "hover": "var(--vkui--color_background_contrast--hover, #EBEDF0)", @@ -538805,6 +540453,11 @@ exports[`shapshots workspaceLandings theme should match root theme snapshot 1`] "hover": "#2C2C2D", "normal": "#232324", }, + "colorBackgroundContentInverse": { + "active": "#D7D8DB", + "hover": "#EBEDF0", + "normal": "#FFFFFF", + }, "colorBackgroundContrast": { "active": "#D7D8DB", "hover": "#EBEDF0", From 69d6f1cb90ecbea52ed5566ec606796fff70d1ce Mon Sep 17 00:00:00 2001 From: "s.peshkov" Date: Wed, 16 Oct 2024 14:19:59 +0300 Subject: [PATCH 36/36] 4.55.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index dcc1f8855..2e8b8c4c9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@vkontakte/vkui-tokens", - "version": "4.54.0", + "version": "4.55.0", "description": "Репозиторий, который содержит в себе дизайн-токены и другие инструменты объединенной дизайн-системы VKUI и Paradigm", "license": "MIT", "homepage": "https://vkcom.github.io/vkui-tokens",