@ui5/webcomponents-theming 0.0.0-81513ce21 → 0.0.0-87ff7523a

package/README.md

@@ -1,6 +1,4 @@
-![UI5 icon](https://raw.githubusercontent.com/SAP/ui5-webcomponents/main/docs/images/UI5_logo_wide.png)
-
-# UI5 Web Components - Theming
+# ![UI5 icon](https://raw.githubusercontent.com/SAP/ui5-webcomponents/main/docs/images/UI5_logo_water.png)UI5 Web Components - Theming
 
 [![npm Package Version](https://badge.fury.io/js/%40ui5%2Fwebcomponents.svg)](https://www.npmjs.com/package/@ui5/webcomponents)
 
@@ -19,10 +17,10 @@ The assets, provided by this package, are additional themes:
 ## Resources
 - [UI5 Web Components - README.md](https://github.com/SAP/ui5-webcomponents/blob/main/README.md)
 - [UI5 Web Components - Home Page](https://sap.github.io/ui5-webcomponents)
-- [UI5 Web Components - Playground and API Reference](https://sap.github.io/ui5-webcomponents/playground/)
+- [UI5 Web Components - Playground and API Reference](https://sap.github.io/ui5-webcomponents/play/)
 
 ## Support
-We welcome all comments, suggestions, questions, and bug reports. Please follow our [Support Guidelines](https://github.com/SAP/ui5-webcomponents/blob/main/SUPPORT.md#-content) on how to report an issue, or chat with us in the `#webcomponents` channel of the [OpenUI5 Community Slack](https://join-ui5-slack.herokuapp.com/).
+We welcome all comments, suggestions, questions, and bug reports. Please follow our [Support Guidelines](https://github.com/SAP/ui5-webcomponents/blob/main/SUPPORT.md#-content) on how to report an issue, or chat with us in the `#webcomponents` channel of the [OpenUI5 Community Slack](https://ui5-slack-invite.cfapps.eu10.hana.ondemand.com/).
 
 ## Contribute
 Please check our [Contribution Guidelines](https://github.com/SAP/ui5-webcomponents/blob/main/docs/6-contributing/02-conventions-and-guidelines.md).

package/css-vars-usage.json

@@ -12,34 +12,46 @@
   "--sapActiveColor",
   "--sapAvatar_1_Background",
   "--sapAvatar_1_BorderColor",
+  "--sapAvatar_1_Hover_Background",
   "--sapAvatar_1_TextColor",
   "--sapAvatar_2_Background",
   "--sapAvatar_2_BorderColor",
+  "--sapAvatar_2_Hover_Background",
   "--sapAvatar_2_TextColor",
   "--sapAvatar_3_Background",
   "--sapAvatar_3_BorderColor",
+  "--sapAvatar_3_Hover_Background",
   "--sapAvatar_3_TextColor",
   "--sapAvatar_4_Background",
   "--sapAvatar_4_BorderColor",
+  "--sapAvatar_4_Hover_Background",
   "--sapAvatar_4_TextColor",
   "--sapAvatar_5_Background",
   "--sapAvatar_5_BorderColor",
+  "--sapAvatar_5_Hover_Background",
   "--sapAvatar_5_TextColor",
   "--sapAvatar_6_Background",
   "--sapAvatar_6_BorderColor",
+  "--sapAvatar_6_Hover_Background",
   "--sapAvatar_6_TextColor",
   "--sapAvatar_7_Background",
   "--sapAvatar_7_BorderColor",
+  "--sapAvatar_7_Hover_Background",
   "--sapAvatar_7_TextColor",
   "--sapAvatar_8_Background",
   "--sapAvatar_8_BorderColor",
+  "--sapAvatar_8_Hover_Background",
   "--sapAvatar_8_TextColor",
   "--sapAvatar_9_Background",
   "--sapAvatar_9_BorderColor",
+  "--sapAvatar_9_Hover_Background",
   "--sapAvatar_9_TextColor",
   "--sapAvatar_10_Background",
   "--sapAvatar_10_BorderColor",
+  "--sapAvatar_10_Hover_Background",
   "--sapAvatar_10_TextColor",
+  "--sapAvatar_Lite_Background",
+  "--sapAvatar_Lite_BorderColor",
   "--sapBackgroundColor",
   "--sapBaseColor",
   "--sapBlockLayer_Background",
@@ -78,6 +90,14 @@
   "--sapButton_BorderColor",
   "--sapButton_BorderCornerRadius",
   "--sapButton_BorderWidth",
+  "--sapButton_Critical_Active_Background",
+  "--sapButton_Critical_Active_BorderColor",
+  "--sapButton_Critical_Background",
+  "--sapButton_Critical_BorderColor",
+  "--sapButton_Critical_Hover_Background",
+  "--sapButton_Critical_Hover_BorderColor",
+  "--sapButton_Critical_Hover_TextColor",
+  "--sapButton_Critical_TextColor",
   "--sapButton_Emphasized_Active_Background",
   "--sapButton_Emphasized_Active_BorderColor",
   "--sapButton_Emphasized_Active_TextColor",
@@ -110,6 +130,14 @@
   "--sapButton_Hover_Background",
   "--sapButton_Hover_BorderColor",
   "--sapButton_Hover_TextColor",
+  "--sapButton_Information_Active_Background",
+  "--sapButton_Information_Active_BorderColor",
+  "--sapButton_Information_Background",
+  "--sapButton_Information_BorderColor",
+  "--sapButton_Information_Hover_Background",
+  "--sapButton_Information_Hover_BorderColor",
+  "--sapButton_Information_Hover_TextColor",
+  "--sapButton_Information_TextColor",
   "--sapButton_Lite_Active_Background",
   "--sapButton_Lite_Active_BorderColor",
   "--sapButton_Lite_Background",
@@ -118,8 +146,20 @@
   "--sapButton_Lite_Hover_BorderColor",
   "--sapButton_Lite_Hover_TextColor",
   "--sapButton_Lite_TextColor",
+  "--sapButton_Negative_Active_Background",
+  "--sapButton_Negative_Active_BorderColor",
+  "--sapButton_Negative_Background",
   "--sapButton_Negative_BorderColor",
+  "--sapButton_Negative_Hover_Background",
+  "--sapButton_Negative_Hover_BorderColor",
+  "--sapButton_Negative_Hover_TextColor",
+  "--sapButton_Negative_TextColor",
+  "--sapButton_Neutral_Active_Background",
+  "--sapButton_Neutral_Active_BorderColor",
   "--sapButton_Neutral_Background",
+  "--sapButton_Neutral_Hover_Background",
+  "--sapButton_Neutral_Hover_BorderColor",
+  "--sapButton_Neutral_Hover_TextColor",
   "--sapButton_Reject_Active_Background",
   "--sapButton_Reject_Active_BorderColor",
   "--sapButton_Reject_Active_TextColor",
@@ -134,11 +174,20 @@
   "--sapButton_Reject_Selected_Hover_BorderColor",
   "--sapButton_Reject_Selected_TextColor",
   "--sapButton_Reject_TextColor",
+  "--sapButton_Segment_BorderCornerRadius",
   "--sapButton_Selected_Background",
   "--sapButton_Selected_BorderColor",
   "--sapButton_Selected_Hover_Background",
   "--sapButton_Selected_Hover_BorderColor",
   "--sapButton_Selected_TextColor",
+  "--sapButton_Success_Active_Background",
+  "--sapButton_Success_Active_BorderColor",
+  "--sapButton_Success_Background",
+  "--sapButton_Success_BorderColor",
+  "--sapButton_Success_Hover_Background",
+  "--sapButton_Success_Hover_BorderColor",
+  "--sapButton_Success_Hover_TextColor",
+  "--sapButton_Success_TextColor",
   "--sapButton_TextColor",
   "--sapButton_TokenBackground",
   "--sapButton_TokenBorderColor",
@@ -159,15 +208,16 @@
   "--sapButton_Track_Selected_Hover_Background",
   "--sapButton_Track_Selected_Hover_BorderColor",
   "--sapButton_Track_Selected_TextColor",
-  "--sapChart_Good",
-  "--sapChart_Sequence_6",
   "--sapContent_BadgeBackground",
+  "--sapContent_BadgeBorderColor",
   "--sapContent_BadgeTextColor",
   "--sapContent_BusyColor",
+  "--sapContent_ContentColor",
   "--sapContent_ContrastFocusColor",
   "--sapContent_ContrastIconColor",
   "--sapContent_ContrastShadowColor",
   "--sapContent_ContrastTextColor",
+  "--sapContent_ContrastTextShadow",
   "--sapContent_Critical_Shadow",
   "--sapContent_DisabledOpacity",
   "--sapContent_DisabledTextColor",
@@ -177,7 +227,6 @@
   "--sapContent_FocusWidth",
   "--sapContent_ForegroundBorderColor",
   "--sapContent_ForegroundColor",
-  "--sapContent_ForegroundTextColor",
   "--sapContent_HeaderShadow",
   "--sapContent_HelpColor",
   "--sapContent_IconColor",
@@ -195,6 +244,7 @@
   "--sapContent_Informative_Shadow",
   "--sapContent_Interaction_Shadow",
   "--sapContent_LabelColor",
+  "--sapContent_Lite_Shadow",
   "--sapContent_MeasureIndicatorColor",
   "--sapContent_Negative_Shadow",
   "--sapContent_NonInteractiveIconColor",
@@ -204,7 +254,6 @@
   "--sapContent_Selected_ForegroundColor",
   "--sapContent_Selected_Hover_Background",
   "--sapContent_Selected_MeasureIndicatorColor",
-  "--sapContent_Selected_Shadow",
   "--sapContent_Selected_TextColor",
   "--sapContent_Shadow0",
   "--sapContent_Shadow1",
@@ -220,6 +269,7 @@
   "--sapElement_BorderWidth",
   "--sapElement_Compact_Height",
   "--sapElement_Height",
+  "--sapElement_LineHeight",
   "--sapErrorBackground",
   "--sapErrorBorderColor",
   "--sapField_Active_BorderColor",
@@ -249,11 +299,17 @@
   "--sapField_InvalidBorderWidth",
   "--sapField_InvalidColor",
   "--sapField_InvalidShadow",
+  "--sapField_Picker_BorderWidth",
   "--sapField_PlaceholderTextColor",
   "--sapField_ReadOnly_Background",
   "--sapField_ReadOnly_BackgroundStyle",
   "--sapField_ReadOnly_BorderColor",
   "--sapField_RequiredColor",
+  "--sapField_Selector_Hover_Background",
+  "--sapField_Selector_Hover_InformationBackground",
+  "--sapField_Selector_Hover_InvalidBackground",
+  "--sapField_Selector_Hover_SuccessBackground",
+  "--sapField_Selector_Hover_WarningBackground",
   "--sapField_Shadow",
   "--sapField_SuccessBackground",
   "--sapField_SuccessBackgroundStyle",
@@ -277,18 +333,19 @@
   "--sapFontHeaderFamily",
   "--sapFontLargeSize",
   "--sapFontMediumSize",
+  "--sapFontSemiboldDuplexFamily",
+  "--sapFontSemiboldFamily",
   "--sapFontSize",
   "--sapFontSmallSize",
+  "--sapGroup_BorderCornerRadius",
   "--sapGroup_ContentBackground",
   "--sapGroup_ContentBorderColor",
   "--sapGroup_Title_FontSize",
   "--sapGroup_TitleBackground",
   "--sapGroup_TitleBorderColor",
+  "--sapGroup_TitleBorderWidth",
   "--sapGroup_TitleTextColor",
-  "--sapHC_ReducedBackground",
-  "--sapHC_ReducedForeground",
   "--sapHighlightColor",
-  "--sapHighlightTextColor",
   "--sapIllus_AccentColor",
   "--sapIllus_BackgroundColor",
   "--sapIllus_BrandColorPrimary",
@@ -300,6 +357,116 @@
   "--sapIllus_PatternHighlight",
   "--sapIllus_PatternShadow",
   "--sapIllus_StrokeDetailColor",
+  "--sapIndicationColor_1",
+  "--sapIndicationColor_1_Active_Background",
+  "--sapIndicationColor_1_Active_BorderColor",
+  "--sapIndicationColor_1_Active_TextColor",
+  "--sapIndicationColor_1_Background",
+  "--sapIndicationColor_1_BorderColor",
+  "--sapIndicationColor_1_Hover_Background",
+  "--sapIndicationColor_1_TextColor",
+  "--sapIndicationColor_1b",
+  "--sapIndicationColor_1b_BorderColor",
+  "--sapIndicationColor_1b_Hover_Background",
+  "--sapIndicationColor_2",
+  "--sapIndicationColor_2_Active_Background",
+  "--sapIndicationColor_2_Active_BorderColor",
+  "--sapIndicationColor_2_Active_TextColor",
+  "--sapIndicationColor_2_Background",
+  "--sapIndicationColor_2_BorderColor",
+  "--sapIndicationColor_2_Hover_Background",
+  "--sapIndicationColor_2_TextColor",
+  "--sapIndicationColor_2b",
+  "--sapIndicationColor_2b_BorderColor",
+  "--sapIndicationColor_2b_Hover_Background",
+  "--sapIndicationColor_3",
+  "--sapIndicationColor_3_Active_Background",
+  "--sapIndicationColor_3_Active_BorderColor",
+  "--sapIndicationColor_3_Active_TextColor",
+  "--sapIndicationColor_3_Background",
+  "--sapIndicationColor_3_BorderColor",
+  "--sapIndicationColor_3_Hover_Background",
+  "--sapIndicationColor_3_TextColor",
+  "--sapIndicationColor_3b",
+  "--sapIndicationColor_3b_BorderColor",
+  "--sapIndicationColor_3b_Hover_Background",
+  "--sapIndicationColor_4",
+  "--sapIndicationColor_4_Active_Background",
+  "--sapIndicationColor_4_Active_BorderColor",
+  "--sapIndicationColor_4_Active_TextColor",
+  "--sapIndicationColor_4_Background",
+  "--sapIndicationColor_4_BorderColor",
+  "--sapIndicationColor_4_Hover_Background",
+  "--sapIndicationColor_4_TextColor",
+  "--sapIndicationColor_4b",
+  "--sapIndicationColor_4b_BorderColor",
+  "--sapIndicationColor_4b_Hover_Background",
+  "--sapIndicationColor_5",
+  "--sapIndicationColor_5_Active_Background",
+  "--sapIndicationColor_5_Active_BorderColor",
+  "--sapIndicationColor_5_Active_TextColor",
+  "--sapIndicationColor_5_Background",
+  "--sapIndicationColor_5_BorderColor",
+  "--sapIndicationColor_5_Hover_Background",
+  "--sapIndicationColor_5_TextColor",
+  "--sapIndicationColor_5b",
+  "--sapIndicationColor_5b_BorderColor",
+  "--sapIndicationColor_5b_Hover_Background",
+  "--sapIndicationColor_6",
+  "--sapIndicationColor_6_Active_Background",
+  "--sapIndicationColor_6_Active_BorderColor",
+  "--sapIndicationColor_6_Active_TextColor",
+  "--sapIndicationColor_6_Background",
+  "--sapIndicationColor_6_BorderColor",
+  "--sapIndicationColor_6_Hover_Background",
+  "--sapIndicationColor_6_TextColor",
+  "--sapIndicationColor_6b",
+  "--sapIndicationColor_6b_BorderColor",
+  "--sapIndicationColor_6b_Hover_Background",
+  "--sapIndicationColor_7",
+  "--sapIndicationColor_7_Active_Background",
+  "--sapIndicationColor_7_Active_BorderColor",
+  "--sapIndicationColor_7_Active_TextColor",
+  "--sapIndicationColor_7_Background",
+  "--sapIndicationColor_7_BorderColor",
+  "--sapIndicationColor_7_Hover_Background",
+  "--sapIndicationColor_7_TextColor",
+  "--sapIndicationColor_7b",
+  "--sapIndicationColor_7b_BorderColor",
+  "--sapIndicationColor_7b_Hover_Background",
+  "--sapIndicationColor_8",
+  "--sapIndicationColor_8_Active_Background",
+  "--sapIndicationColor_8_Active_BorderColor",
+  "--sapIndicationColor_8_Active_TextColor",
+  "--sapIndicationColor_8_Background",
+  "--sapIndicationColor_8_BorderColor",
+  "--sapIndicationColor_8_Hover_Background",
+  "--sapIndicationColor_8_TextColor",
+  "--sapIndicationColor_8b",
+  "--sapIndicationColor_8b_BorderColor",
+  "--sapIndicationColor_8b_Hover_Background",
+  "--sapIndicationColor_9",
+  "--sapIndicationColor_9_Active_Background",
+  "--sapIndicationColor_9_Active_BorderColor",
+  "--sapIndicationColor_9_Active_TextColor",
+  "--sapIndicationColor_9_Background",
+  "--sapIndicationColor_9_BorderColor",
+  "--sapIndicationColor_9_Hover_Background",
+  "--sapIndicationColor_9_TextColor",
+  "--sapIndicationColor_9b",
+  "--sapIndicationColor_9b_BorderColor",
+  "--sapIndicationColor_9b_Hover_Background",
+  "--sapIndicationColor_10",
+  "--sapIndicationColor_10_Active_Background",
+  "--sapIndicationColor_10_Active_BorderColor",
+  "--sapIndicationColor_10_Active_TextColor",
+  "--sapIndicationColor_10_Background",
+  "--sapIndicationColor_10_BorderColor",
+  "--sapIndicationColor_10_Hover_Background",
+  "--sapIndicationColor_10_TextColor",
+  "--sapIndicationColor_10b",
+  "--sapIndicationColor_10b_BorderColor",
+  "--sapIndicationColor_10b_Hover_Background",
   "--sapInformationBackground",
   "--sapInformationBorderColor",
   "--sapInformativeElementColor",
@@ -307,20 +474,32 @@
   "--sapLegend_CurrentDateTime",
   "--sapLegend_NonWorkingBackground",
   "--sapLegend_WorkingBackground",
-  "--sapLegendBackgroundColor1",
-  "--sapLegendBackgroundColor2",
-  "--sapLegendBackgroundColor3",
-  "--sapLegendBackgroundColor5",
-  "--sapLegendBackgroundColor6",
-  "--sapLegendBackgroundColor7",
-  "--sapLegendBackgroundColor9",
-  "--sapLegendBackgroundColor10",
-  "--sapLegendBackgroundColor18",
-  "--sapLegendBackgroundColor20",
+  "--sapLegendColor1",
+  "--sapLegendColor2",
+  "--sapLegendColor3",
+  "--sapLegendColor4",
+  "--sapLegendColor5",
+  "--sapLegendColor6",
+  "--sapLegendColor7",
+  "--sapLegendColor8",
+  "--sapLegendColor9",
+  "--sapLegendColor10",
+  "--sapLegendColor11",
+  "--sapLegendColor12",
+  "--sapLegendColor13",
+  "--sapLegendColor14",
+  "--sapLegendColor15",
+  "--sapLegendColor16",
+  "--sapLegendColor17",
   "--sapLegendColor18",
+  "--sapLegendColor19",
+  "--sapLegendColor20",
   "--sapLink_Active_Color",
+  "--sapLink_Active_TextDecoration",
   "--sapLink_Hover_Color",
+  "--sapLink_Hover_TextDecoration",
   "--sapLink_SubtleColor",
+  "--sapLink_TextDecoration",
   "--sapLinkColor",
   "--sapList_Active_Background",
   "--sapList_Active_TextColor",
@@ -339,10 +518,10 @@
   "--sapList_Hover_SelectionBackground",
   "--sapList_SelectionBackgroundColor",
   "--sapList_SelectionBorderColor",
-  "--sapList_TableGroupHeaderBackground",
-  "--sapList_TableGroupHeaderBorderColor",
   "--sapList_TableGroupHeaderTextColor",
   "--sapList_TextColor",
+  "--sapMessage_BorderWidth",
+  "--sapMessage_Button_Hover_Background",
   "--sapMessage_ErrorBorderColor",
   "--sapMessage_InformationBorderColor",
   "--sapMessage_SuccessBorderColor",
@@ -351,11 +530,18 @@
   "--sapNegativeElementColor",
   "--sapNegativeTextColor",
   "--sapNeutralBackground",
+  "--sapNeutralBorderColor",
   "--sapNeutralColor",
   "--sapNeutralElementColor",
   "--sapNeutralTextColor",
   "--sapObjectHeader_Background",
   "--sapObjectHeader_BorderColor",
+  "--sapObjectHeader_Hover_Background",
+  "--sapObjectHeader_Subtitle_TextColor",
+  "--sapObjectHeader_Title_FontFamily",
+  "--sapObjectHeader_Title_FontSize",
+  "--sapObjectHeader_Title_SnappedFontSize",
+  "--sapObjectHeader_Title_TextColor",
   "--sapPageFooter_Background",
   "--sapPageFooter_BorderColor",
   "--sapPageFooter_TextColor",
@@ -374,18 +560,13 @@
   "--sapProgress_PositiveBackground",
   "--sapProgress_TextColor",
   "--sapProgress_Value_Background",
-  "--sapProgress_Value_BorderColor",
   "--sapProgress_Value_CriticalBackground",
-  "--sapProgress_Value_CriticalBorderColor",
   "--sapProgress_Value_CriticalTextColor",
   "--sapProgress_Value_InformationBackground",
-  "--sapProgress_Value_InformationBorderColor",
   "--sapProgress_Value_InformationTextColor",
   "--sapProgress_Value_NegativeBackground",
-  "--sapProgress_Value_NegativeBorderColor",
   "--sapProgress_Value_NegativeTextColor",
   "--sapProgress_Value_PositiveBackground",
-  "--sapProgress_Value_PositiveBorderColor",
   "--sapProgress_Value_PositiveTextColor",
   "--sapScrollBar_Dimension",
   "--sapScrollBar_FaceColor",
@@ -394,14 +575,16 @@
   "--sapSelectedColor",
   "--sapShell_Active_Background",
   "--sapShell_Active_TextColor",
+  "--sapShell_Assistant_ForegroundColor",
   "--sapShell_Background",
   "--sapShell_Hover_Background",
   "--sapShell_InteractiveBackground",
   "--sapShell_InteractiveBorderColor",
   "--sapShell_InteractiveTextColor",
+  "--sapShell_Shadow",
+  "--sapShell_SubBrand_TextColor",
   "--sapShell_TextColor",
   "--sapShellColor",
-  "--sapSlider_Active_HandleBackground",
   "--sapSlider_Active_RangeHandleBackground",
   "--sapSlider_Background",
   "--sapSlider_HandleBackground",
@@ -413,6 +596,38 @@
   "--sapSlider_Selected_BorderColor",
   "--sapSuccessBackground",
   "--sapSuccessBorderColor",
+  "--sapTab_Background",
+  "--sapTab_Critical_ForegroundColor",
+  "--sapTab_Critical_IconColor",
+  "--sapTab_Critical_Selected_Background",
+  "--sapTab_Critical_Selected_IconColor",
+  "--sapTab_Critical_Selected_TextColor",
+  "--sapTab_Critical_TextColor",
+  "--sapTab_ForegroundColor",
+  "--sapTab_IconColor",
+  "--sapTab_Negative_ForegroundColor",
+  "--sapTab_Negative_IconColor",
+  "--sapTab_Negative_Selected_Background",
+  "--sapTab_Negative_Selected_IconColor",
+  "--sapTab_Negative_Selected_TextColor",
+  "--sapTab_Negative_TextColor",
+  "--sapTab_Neutral_ForegroundColor",
+  "--sapTab_Neutral_IconColor",
+  "--sapTab_Neutral_Selected_Background",
+  "--sapTab_Neutral_Selected_IconColor",
+  "--sapTab_Neutral_Selected_TextColor",
+  "--sapTab_Neutral_TextColor",
+  "--sapTab_Positive_ForegroundColor",
+  "--sapTab_Positive_IconColor",
+  "--sapTab_Positive_Selected_Background",
+  "--sapTab_Positive_Selected_IconColor",
+  "--sapTab_Positive_Selected_TextColor",
+  "--sapTab_Positive_TextColor",
+  "--sapTab_Selected_Background",
+  "--sapTab_Selected_IconColor",
+  "--sapTab_Selected_Indicator_Dimension",
+  "--sapTab_Selected_TextColor",
+  "--sapTab_TextColor",
   "--sapTextColor",
   "--sapTile_Active_Background",
   "--sapTile_Background",
@@ -424,7 +639,6 @@
   "--sapTile_SeparatorColor",
   "--sapTile_TextColor",
   "--sapTile_TitleTextColor",
-  "--sapTitleColor",
   "--sapToolbar_SeparatorColor",
   "--sapWarningBackground",
   "--sapWarningBorderColor"