@ui5/webcomponents-theming 0.0.0-1929d08ff

package/dist/themes/sap_horizon_exp/css_variables.css

@@ -0,0 +1,584 @@
+/**
+* Copyright (c) 2012-2020 SAP SE or an SAP affiliate company and Theming Base Content contributors. Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+*
+* Theming Engine 1.51.0
+* data:{"Path": "Base.baseLib.sap_horizon.css_variables", "PathPattern": "/%frameworkId%/%libId%/%themeId%/%fileId%.css", "Extends": ["baseTheme"], "Tags": ["Fiori_3","LightColorScheme"], "FallbackThemeId": "sap_fiori_3", "Version": { "Build":"11.1.34.20211012133552", "Source": "11.1.34", "Engine": "1.51.0"}}
+*/
+
+.sapThemeMetaData-Base-baseLib{background-image: url('data:text/plain;utf-8,{"Path": "Base.baseLib.sap_horizon.css_variables", "PathPattern": "/%frameworkId%/%libId%/%themeId%/%fileId%.css", "Extends": ["baseTheme"], "Tags": ["Fiori_3","LightColorScheme"], "FallbackThemeId": "sap_fiori_3", "Version": { "Build":"11.1.34.20211012133552", "Source": "11.1.34", "Engine": "1.51.0"}}');}
+:root {
+  --sapBrandColor: #0070f2;
+  --sapHighlightColor: #0070f2;
+  --sapBaseColor: #fff;
+  --sapShellColor: #fff;
+  --sapBackgroundColor: #f5f6f7;
+  --sapFontFamily: "72", "72full", Arial, Helvetica, sans-serif;
+  --sapFontLightFamily: "72-Light", "72-Lightfull", "72", "72full", Arial, Helvetica, sans-serif;
+  --sapFontBoldFamily: "72-Bold", "72-Boldfull", "72", "72full", Arial, Helvetica, sans-serif;
+  --sapFontBlackFamily: "72Black", "72", "72full", Arial, Helvetica, sans-serif;
+  --sapFontHeaderFamily: "72-Bold", "72-Boldfull", "72", "72full", Arial, Helvetica, sans-serif;
+  --sapFontSize: .875rem;
+  --sapFontSmallSize: .75rem;
+  --sapFontLargeSize: 1rem;
+  --sapFontHeader1Size: 3rem;
+  --sapFontHeader2Size: 2rem;
+  --sapFontHeader3Size: 1.5rem;
+  --sapFontHeader4Size: 1.25rem;
+  --sapFontHeader5Size: 1rem;
+  --sapFontHeader6Size: .875rem;
+  --sapTextColor: #223548;
+  --sapLinkColor: #0064d9;
+  --sapLink_Hover_Color: #005fce;
+  --sapLink_Active_Color: #0064d9;
+  --sapLink_Visited_Color: #0064d9;
+  --sapLink_InvertedColor: #a6cfff;
+  --sapLink_SubtleColor: #00418d;
+  --sapCompanyLogo: none;
+  --sapBackgroundImage: none;
+  --sapBackgroundImageOpacity: 1.0;
+  --sapBackgroundImageRepeat: false;
+  --sapSelectedColor: #0070f2;
+  --sapActiveColor: #dee2e5;
+  --sapHighlightTextColor: #fff;
+  --sapTitleColor: #223548;
+  --sapNegativeColor: #aa0808;
+  --sapCriticalColor: #e76500;
+  --sapPositiveColor: #256f3a;
+  --sapInformativeColor: #0070f2;
+  --sapNeutralColor: #5b738b;
+  --sapNegativeElementColor: #f53232;
+  --sapCriticalElementColor: #e76500;
+  --sapPositiveElementColor: #30914c;
+  --sapInformativeElementColor: #0070f2;
+  --sapNeutralElementColor: #6e87a0;
+  --sapNegativeTextColor: #aa0808;
+  --sapPositiveTextColor: #256f3a;
+  --sapCriticalTextColor: #b95100;
+  --sapInformativeTextColor: #0070f2;
+  --sapNeutralTextColor: #5b738b;
+  --sapNeutralBorderColor: #6e87a0;
+  --sapErrorColor: #aa0808;
+  --sapErrorBorderColor: #f53232;
+  --sapWarningColor: #e76500;
+  --sapWarningBorderColor: #e76500;
+  --sapSuccessColor: #256f3a;
+  --sapSuccessBorderColor: #30914c;
+  --sapInformationColor: #0070f2;
+  --sapInformationBorderColor: #0070f2;
+  --sapErrorBackground: #ffeaf4;
+  --sapWarningBackground: #fff8d6;
+  --sapSuccessBackground: #f5fae5;
+  --sapInformationBackground: #e1f4ff;
+  --sapNeutralBackground: #f5f6f7;
+  --sapIndicationColor_1: #840606;
+  --sapIndicationColor_1_Hover_Background: #6c0505;
+  --sapIndicationColor_1_Active_Background: #530404;
+  --sapIndicationColor_1_TextColor: #fff;
+  --sapIndicationColor_2: #aa0808;
+  --sapIndicationColor_2_Hover_Background: #920707;
+  --sapIndicationColor_2_Active_Background: #790606;
+  --sapIndicationColor_2_TextColor: #fff;
+  --sapIndicationColor_3: #e76500;
+  --sapIndicationColor_3_Hover_Background: #d85e00;
+  --sapIndicationColor_3_Active_Background: #c85800;
+  --sapIndicationColor_3_TextColor: #fff;
+  --sapIndicationColor_4: #256f3a;
+  --sapIndicationColor_4_Hover_Background: #1f5c30;
+  --sapIndicationColor_4_Active_Background: #184926;
+  --sapIndicationColor_4_TextColor: #fff;
+  --sapIndicationColor_5: #0070f2;
+  --sapIndicationColor_5_Hover_Background: #0064d9;
+  --sapIndicationColor_5_Active_Background: #0058bf;
+  --sapIndicationColor_5_TextColor: #fff;
+  --sapIndicationColor_6: #046c7a;
+  --sapIndicationColor_6_Hover_Background: #035661;
+  --sapIndicationColor_6_Active_Background: #024049;
+  --sapIndicationColor_6_TextColor: #fff;
+  --sapIndicationColor_7: #5d36ff;
+  --sapIndicationColor_7_Hover_Background: #481cff;
+  --sapIndicationColor_7_Active_Background: #3403ff;
+  --sapIndicationColor_7_TextColor: #fff;
+  --sapIndicationColor_8: #a100c2;
+  --sapIndicationColor_8_Hover_Background: #8c00a9;
+  --sapIndicationColor_8_Active_Background: #77008f;
+  --sapIndicationColor_8_TextColor: #fff;
+  --sapElement_LineHeight: 2.75rem;
+  --sapElement_Height: 2.25rem;
+  --sapElement_BorderWidth: .0625rem;
+  --sapElement_BorderCornerRadius: .75rem;
+  --sapElement_Compact_LineHeight: 2rem;
+  --sapElement_Compact_Height: 1.625rem;
+  --sapElement_Condensed_LineHeight: 1.5rem;
+  --sapElement_Condensed_Height: 1.375rem;
+  --sapContent_LineHeight: 1.5;
+  --sapContent_IconHeight: 1rem;
+  --sapContent_IconColor: #223548;
+  --sapContent_ContrastIconColor: #fff;
+  --sapContent_NonInteractiveIconColor: #223548;
+  --sapContent_MarkerIconColor: #5d36ff;
+  --sapContent_MarkerTextColor: #046c7a;
+  --sapContent_ImagePlaceholderBackground: #eaecee;
+  --sapContent_ImagePlaceholderForegroundColor: #5b738b;
+  --sapContent_RatedColor: #5d36ff;
+  --sapContent_UnratedColor: #788fa6;
+  --sapContent_FocusColor: #0070f2;
+  --sapContent_FocusStyle: solid;
+  --sapContent_FocusWidth: .125rem;
+  --sapContent_ContrastFocusColor: #fff;
+  --sapContent_ShadowColor: #556b82;
+  --sapContent_ContrastShadowColor: #fff;
+  --sapContent_Shadow0: 0 0 0.125rem 0 rgba(85,107,130,0.16), 0 0.125rem 0.25rem 0 rgba(85,107,130,0.16);
+  --sapContent_Shadow1: 0 0 0 0.0625rem rgba(85,107,130,0.42), 0 0.125rem 0.5rem 0 rgba(85,107,130,0.3);
+  --sapContent_Shadow2: 0 0 0 0.0625rem rgba(85,107,130,0.42), 0 0.625rem 1.875rem 0 rgba(85,107,130,0.3);
+  --sapContent_Shadow3: 0 0 0 0.0625rem rgba(85,107,130,0.42), 0 1.25rem 5rem 0 rgba(85,107,130,0.3);
+  --sapContent_TextShadow: 0 0 0.125rem #fff;
+  --sapContent_ContrastTextShadow: 0 0 0.0625rem rgba(0,0,0,0.7);
+  --sapContent_HeaderShadow: 0 0 0.25rem 0 rgba(85,107,130,0.16), inset 0 -0.0625rem 0 0 #d9d9d9;
+  --sapContent_Interaction_Shadow: 0 0 0.125rem 0 rgba(85,107,130,0.72);
+  --sapContent_Selected_Shadow: 0 0 0.125rem 0 rgba(0,112,242,0.72);
+  --sapContent_Negative_Shadow: 0 0 0.125rem 0 rgba(170,8,8,0.72);
+  --sapContent_Critical_Shadow: 0 0 0.125rem 0 rgba(231,101,0,0.72);
+  --sapContent_Positive_Shadow: 0 0 0.125rem 0 rgba(37,111,58,0.72);
+  --sapContent_Informative_Shadow: 0 0 0.125rem 0 rgba(0,112,242,0.72);
+  --sapContent_Neutral_Shadow: 0 0 0.125rem 0 rgba(91,115,139,0.72);
+  --sapContent_SearchHighlightColor: #dafdf5;
+  --sapContent_HelpColor: #188918;
+  --sapContent_LabelColor: #556b82;
+  --sapContent_MonospaceFontFamily: "72Mono", "72Monofull", lucida console, monospace;
+  --sapContent_MonospaceBoldFontFamily: "72Mono-Bold", "72Mono-Boldfull", lucida console, monospace;
+  --sapContent_IconFontFamily: "SAP-icons";
+  --sapContent_DisabledTextColor: rgba(34,53,72,0.6);
+  --sapContent_DisabledOpacity: 0.4;
+  --sapContent_ContrastTextThreshold: 0.65;
+  --sapContent_ContrastTextColor: #fff;
+  --sapContent_ForegroundColor: #efefef;
+  --sapContent_ForegroundBorderColor: #788fa6;
+  --sapContent_ForegroundTextColor: #223548;
+  --sapContent_BadgeBackground: #aa0808;
+  --sapContent_BadgeTextColor: #fff;
+  --sapContent_Placeholderloading_Background: #ccc;
+  --sapContent_Placeholderloading_Gradient: linear-gradient(to right, #ccc 0%, #ccc 20%, #999 50%, #ccc 80%, #ccc 100%);
+  --sapContent_DragAndDropActiveColor: #0070f2;
+  --sapContent_Selected_Background: #fff;
+  --sapContent_Selected_TextColor: #0070f2;
+  --sapContent_Selected_Hover_Background: #fff;
+  --sapContent_Selected_ForegroundColor: #0070f2;
+  --sapContent_Illustrative_Color1: #5d36ff;
+  --sapContent_Illustrative_Color2: #0070f2;
+  --sapContent_Illustrative_Color3: #f58b00;
+  --sapContent_Illustrative_Color4: #00144a;
+  --sapContent_Illustrative_Color5: #a9b4be;
+  --sapContent_Illustrative_Color6: #d5dadd;
+  --sapContent_Illustrative_Color7: #ebf8ff;
+  --sapContent_Illustrative_Color8: #fff;
+  --sapContent_Illustrative_Color9: #64edd2;
+  --sapContent_Illustrative_Color10: #ebf8ff;
+  --sapContent_Illustrative_Color11: #f31ded;
+  --sapContent_Illustrative_Color12: #5dc122;
+  --sapContent_Illustrative_Color13: #005dc9;
+  --sapContent_Illustrative_Color14: #004da5;
+  --sapContent_Illustrative_Color15: #cc7400;
+  --sapContent_Illustrative_Color16: #3b0ac6;
+  --sapContent_Illustrative_Color17: #00a58a;
+  --sapContent_Illustrative_Color18: #d1efff;
+  --sapContent_Illustrative_Color19: #b8e6ff;
+  --sapContent_Illustrative_Color20: #9eddff;
+  --sapShell_Background: #f5f6f7;
+  --sapShell_BackgroundImage: linear-gradient(to bottom, #f5f6f7, #f5f6f7);
+  --sapShell_BackgroundGradient: linear-gradient(to bottom, #f5f6f7, #f5f6f7);
+  --sapShell_BackgroundImageOpacity: 1.0;
+  --sapShell_BackgroundImageRepeat: false;
+  --sapShell_BorderColor: #fff;
+  --sapShell_TextColor: #223548;
+  --sapShell_InteractiveBackground: #eff1f2;
+  --sapShell_InteractiveTextColor: #223548;
+  --sapShell_InteractiveBorderColor: #788fa6;
+  --sapShell_GroupTitleTextColor: #223548;
+  --sapShell_GroupTitleTextShadow: 0 0 0.125rem #fff;
+  --sapShell_Hover_Background: #fff;
+  --sapShell_Active_Background: #fff;
+  --sapShell_Active_TextColor: #0070f2;
+  --sapShell_Selected_Background: #fff;
+  --sapShell_Selected_TextColor: #0070f2;
+  --sapShell_Selected_Hover_Background: #fff;
+  --sapShell_Favicon: none;
+  --sapShell_Navigation_Background: #fff;
+  --sapShell_Navigation_SelectedColor: #223548;
+  --sapShell_Navigation_Selected_TextColor: #223548;
+  --sapShell_Navigation_TextColor: #223548;
+  --sapShell_Navigation_Hover_Background: #fff;
+  --sapShell_Navigation_Active_Background: #fff;
+  --sapShell_Navigation_Active_TextColor: #0070f2;
+  --sapShell_Shadow: 0 0 0.5rem 0 rgba(85,107,130,0.2), inset 0 -0.0625rem 0 0 rgba(85,107,130,0.1);
+  --sapShell_NegativeColor: #aa0808;
+  --sapShell_CriticalColor: #e76500;
+  --sapShell_PositiveColor: #256f3a;
+  --sapShell_InformativeColor: #0070f2;
+  --sapShell_NeutralColor: #5b738b;
+  --sapButton_BorderWidth: .0625rem;
+  --sapButton_BorderCornerRadius: .5rem;
+  --sapButton_Background: #eaecee;
+  --sapButton_BorderColor: #eaecee;
+  --sapButton_TextColor: #223548;
+  --sapButton_Hover_Background: #fff;
+  --sapButton_Hover_BorderColor: #fff;
+  --sapButton_Hover_TextColor: #223548;
+  --sapButton_IconColor: #223548;
+  --sapButton_Active_Background: #fff;
+  --sapButton_Active_BorderColor: #0070f2;
+  --sapButton_Active_TextColor: #0070f2;
+  --sapButton_Emphasized_Background: #0070f2;
+  --sapButton_Emphasized_BorderColor: #0070f2;
+  --sapButton_Emphasized_TextColor: #fff;
+  --sapButton_Emphasized_Hover_Background: #0064d9;
+  --sapButton_Emphasized_Hover_BorderColor: #0064d9;
+  --sapButton_Emphasized_Hover_TextColor: #fff;
+  --sapButton_Emphasized_Active_Background: #fff;
+  --sapButton_Emphasized_Active_BorderColor: #0070f2;
+  --sapButton_Emphasized_Active_TextColor: #0070f2;
+  --sapButton_Emphasized_TextShadow: transparent;
+  --sapButton_Reject_Background: #ffd6e9;
+  --sapButton_Reject_BorderColor: #ffd6e9;
+  --sapButton_Reject_Hover_Background: #fff;
+  --sapButton_Reject_Hover_BorderColor: #fff;
+  --sapButton_Reject_Hover_TextColor: #aa0808;
+  --sapButton_Reject_Active_Background: #fff;
+  --sapButton_Reject_Active_BorderColor: #f53232;
+  --sapButton_Reject_Active_TextColor: #aa0808;
+  --sapButton_Reject_TextColor: #aa0808;
+  --sapButton_Reject_Selected_Background: #fff;
+  --sapButton_Reject_Selected_BorderColor: #f53232;
+  --sapButton_Reject_Selected_TextColor: #aa0808;
+  --sapButton_Reject_Selected_Hover_Background: #fff;
+  --sapButton_Reject_Selected_Hover_BorderColor: #f53232;
+  --sapButton_Accept_Background: #ebf5cb;
+  --sapButton_Accept_BorderColor: #ebf5cb;
+  --sapButton_Accept_Hover_Background: #fff;
+  --sapButton_Accept_Hover_BorderColor: #fff;
+  --sapButton_Accept_Hover_TextColor: #256f3a;
+  --sapButton_Accept_Active_Background: #fff;
+  --sapButton_Accept_Active_BorderColor: #30914c;
+  --sapButton_Accept_Active_TextColor: #256f3a;
+  --sapButton_Accept_TextColor: #256f3a;
+  --sapButton_Accept_Selected_Background: #fff;
+  --sapButton_Accept_Selected_BorderColor: #30914c;
+  --sapButton_Accept_Selected_TextColor: #256f3a;
+  --sapButton_Accept_Selected_Hover_Background: #fff;
+  --sapButton_Accept_Selected_Hover_BorderColor: #30914c;
+  --sapButton_Lite_Background: transparent;
+  --sapButton_Lite_BorderColor: transparent;
+  --sapButton_Lite_TextColor: #223548;
+  --sapButton_Lite_Hover_Background: #fff;
+  --sapButton_Lite_Hover_BorderColor: #fff;
+  --sapButton_Lite_Hover_TextColor: #223548;
+  --sapButton_Lite_Active_Background: #fff;
+  --sapButton_Lite_Active_BorderColor: #0070f2;
+  --sapButton_Selected_Background: #fff;
+  --sapButton_Selected_BorderColor: #0070f2;
+  --sapButton_Selected_TextColor: #0070f2;
+  --sapButton_Selected_Hover_Background: #fff;
+  --sapButton_Selected_Hover_BorderColor: #0070f2;
+  --sapButton_Attention_Background: #fff3b7;
+  --sapButton_Attention_BorderColor: #fff3b7;
+  --sapButton_Attention_TextColor: #b95100;
+  --sapButton_Attention_Hover_Background: #fff;
+  --sapButton_Attention_Hover_BorderColor: #fff;
+  --sapButton_Attention_Hover_TextColor: #b95100;
+  --sapButton_Attention_Active_Background: #fff;
+  --sapButton_Attention_Active_BorderColor: #ffa158;
+  --sapButton_Attention_Active_TextColor: #b95100;
+  --sapButton_Attention_Selected_Background: #fff;
+  --sapButton_Attention_Selected_BorderColor: #ffa158;
+  --sapButton_Attention_Selected_TextColor: #b95100;
+  --sapButton_Attention_Selected_Hover_Background: #fff;
+  --sapButton_Attention_Selected_Hover_BorderColor: #ffa158;
+  --sapButton_Negative_Background: #f53232;
+  --sapButton_Negative_BorderColor: #f53232;
+  --sapButton_Negative_TextColor: #fff;
+  --sapButton_Negative_Hover_Background: #f31010;
+  --sapButton_Negative_Hover_BorderColor: #f31010;
+  --sapButton_Negative_Hover_TextColor: #fff;
+  --sapButton_Negative_Active_Background: #e90b0b;
+  --sapButton_Negative_Active_BorderColor: #e90b0b;
+  --sapButton_Negative_Active_TextColor: #fff;
+  --sapButton_Critical_Background: #e76500;
+  --sapButton_Critical_BorderColor: #e76500;
+  --sapButton_Critical_TextColor: #fff;
+  --sapButton_Critical_Hover_Background: #ff760c;
+  --sapButton_Critical_Hover_BorderColor: #ff760c;
+  --sapButton_Critical_Hover_TextColor: #fff;
+  --sapButton_Critical_Active_Background: #ff8a2f;
+  --sapButton_Critical_Active_BorderColor: #ff8a2f;
+  --sapButton_Critical_Active_TextColor: #fff;
+  --sapButton_Success_Background: #30914c;
+  --sapButton_Success_BorderColor: #30914c;
+  --sapButton_Success_TextColor: #fff;
+  --sapButton_Success_Hover_Background: #27763e;
+  --sapButton_Success_Hover_BorderColor: #27763e;
+  --sapButton_Success_Hover_TextColor: #fff;
+  --sapButton_Success_Active_Background: #236b38;
+  --sapButton_Success_Active_BorderColor: #236b38;
+  --sapButton_Success_Active_TextColor: #fff;
+  --sapButton_Information_Background: #0070f2;
+  --sapButton_Information_BorderColor: #0070f2;
+  --sapButton_Information_TextColor: #fff;
+  --sapButton_Information_Hover_Background: #0064d9;
+  --sapButton_Information_Hover_BorderColor: #0064d9;
+  --sapButton_Information_Hover_TextColor: #fff;
+  --sapButton_Information_Active_Background: #0058bf;
+  --sapButton_Information_Active_BorderColor: #0058bf;
+  --sapButton_Neutral_Background: #6e87a0;
+  --sapButton_Neutral_BorderColor: #6e87a0;
+  --sapButton_Neutral_TextColor: #fff;
+  --sapButton_Neutral_Hover_Background: #5d758e;
+  --sapButton_Neutral_Hover_BorderColor: #5d758e;
+  --sapButton_Neutral_Hover_TextColor: #fff;
+  --sapButton_Neutral_Active_Background: #576d84;
+  --sapButton_Neutral_Active_BorderColor: #576d84;
+  --sapButton_Neutral_Active_TextColor: #fff;
+  --sapButton_Track_Selected_Background: #0070f2;
+  --sapButton_Track_Selected_TextColor: #fff;
+  --sapButton_Track_Background: #d6dade;
+  --sapButton_Track_TextColor: #223548;
+  --sapButton_TokenBackground: #fff;
+  --sapButton_TokenBorderColor: #788fa6;
+  --sapField_Background: #eff1f2;
+  --sapField_TextColor: #131e29;
+  --sapField_PlaceholderTextColor: #556b82;
+  --sapField_BorderColor: #788fa6;
+  --sapField_HelpBackground: #eff1f2;
+  --sapField_BorderWidth: .0625rem;
+  --sapField_BorderCornerRadius: .25rem;
+  --sapField_Hover_Background: #fff;
+  --sapField_Hover_BorderColor: #788fa6;
+  --sapField_Hover_HelpBackground: #fff;
+  --sapField_Active_BorderColor: #0070f2;
+  --sapField_Focus_Background: #fff;
+  --sapField_Focus_BorderColor: #0070f2;
+  --sapField_Focus_HelpBackground: #fff;
+  --sapField_ReadOnly_Background: #eff1f2;
+  --sapField_ReadOnly_BorderColor: #788fa6;
+  --sapField_ReadOnly_HelpBackground: #eff1f2;
+  --sapField_RequiredColor: #5d36ff;
+  --sapField_InvalidColor: #f53232;
+  --sapField_InvalidBackground: #ffeaf4;
+  --sapField_InvalidBorderWidth: .125rem;
+  --sapField_InvalidBorderStyle: solid;
+  --sapField_WarningColor: #e76500;
+  --sapField_WarningBackground: #fff8d6;
+  --sapField_WarningBorderWidth: .125rem;
+  --sapField_WarningBorderStyle: solid;
+  --sapField_SuccessColor: #30914c;
+  --sapField_SuccessBackground: #f5fae5;
+  --sapField_SuccessBorderWidth: .0625rem;
+  --sapField_SuccessBorderStyle: solid;
+  --sapField_InformationColor: #0070f2;
+  --sapField_InformationBackground: #e1f4ff;
+  --sapField_InformationBorderWidth: .125rem;
+  --sapField_InformationBorderStyle: solid;
+  --sapGroup_TitleBackground: transparent;
+  --sapGroup_TitleBorderColor: #d9d9d9;
+  --sapGroup_TitleTextColor: #223548;
+  --sapGroup_ContentBackground: #fff;
+  --sapGroup_ContentBorderColor: #d9d9d9;
+  --sapGroup_BorderWidth: .0625rem;
+  --sapGroup_BorderCornerRadius: .5rem;
+  --sapGroup_FooterBackground: transparent;
+  --sapToolbar_Background: transparent;
+  --sapToolbar_SeparatorColor: #d9d9d9;
+  --sapList_HeaderBackground: #fff;
+  --sapList_HeaderBorderColor: #e5e5e5;
+  --sapList_HeaderTextColor: #223548;
+  --sapList_BorderColor: #e5e5e5;
+  --sapList_TextColor: #223548;
+  --sapList_Active_TextColor: #223548;
+  --sapList_BorderWidth: .0625rem;
+  --sapList_Active_Background: #dee2e5;
+  --sapList_SelectionBackgroundColor: #ebf8ff;
+  --sapList_SelectionBorderColor: #0070f2;
+  --sapList_Hover_SelectionBackground: #dcf3ff;
+  --sapList_Background: #fff;
+  --sapList_Hover_Background: #eaecee;
+  --sapList_AlternatingBackground: #f5f6f7;
+  --sapList_GroupHeaderBackground: #fff;
+  --sapList_GroupHeaderBorderColor: #d9d9d9;
+  --sapList_GroupHeaderTextColor: #223548;
+  --sapList_FooterBackground: #fff;
+  --sapList_FooterTextColor: #223548;
+  --sapList_TableGroupHeaderBackground: #fff;
+  --sapList_TableGroupHeaderBorderColor: #d9d9d9;
+  --sapList_TableGroupHeaderTextColor: #223548;
+  --sapList_TableFooterBorder: #d9d9d9;
+  --sapList_TableFixedBorderColor: #8c8c8c;
+  --sapList_Active_Background: #dee2e5;
+  --sapScrollBar_FaceColor: #8197ac;
+  --sapScrollBar_TrackColor: #fff;
+  --sapScrollBar_BorderColor: #8197ac;
+  --sapScrollBar_SymbolColor: #223548;
+  --sapScrollBar_Dimension: .75rem;
+  --sapScrollBar_Hover_FaceColor: #788fa6;
+  --sapPageHeader_Background: #fff;
+  --sapPageHeader_BorderColor: #d9d9d9;
+  --sapPageHeader_TextColor: #223548;
+  --sapPageFooter_Background: #fff;
+  --sapPageFooter_BorderColor: #d9d9d9;
+  --sapPageFooter_TextColor: #223548;
+  --sapInfobar_Background: #dafdf5;
+  --sapInfobar_Hover_Background: #fff;
+  --sapInfobar_Active_Background: #fff;
+  --sapInfobar_NonInteractive_Background: #f5f6f7;
+  --sapInfobar_TextColor: #046c7a;
+  --sapObjectHeader_Background: #fff;
+  --sapObjectHeader_BorderColor: #d9d9d9;
+  --sapObjectHeader_Hover_Background: #eaecee;
+  --sapBlockLayer_Background: #000;
+  --sapTile_Background: #fff;
+  --sapTile_Hover_Background: #fff;
+  --sapTile_Active_Background: #f5f5f5;
+  --sapTile_BorderColor: transparent;
+  --sapTile_TitleTextColor: #223548;
+  --sapTile_TextColor: #556b82;
+  --sapTile_IconColor: #556b82;
+  --sapTile_SeparatorColor: #ccc;
+  --sapTile_Interactive_BorderColor: #b3b3b3;
+  --sapTile_OverlayBackground: rgba(255,255,255,0.96);
+  --sapTile_OverlayForegroundColor: #223548;
+  --sapAccentColor1: #f58b00;
+  --sapAccentColor2: #aa0808;
+  --sapAccentColor3: #cc00dc;
+  --sapAccentColor4: #a100c2;
+  --sapAccentColor5: #5d36ff;
+  --sapAccentColor6: #0057d2;
+  --sapAccentColor7: #046c7a;
+  --sapAccentColor8: #256f3a;
+  --sapAccentColor9: #07838f;
+  --sapAccentColor10: #5b738b;
+  --sapAccentBackgroundColor1: #fff3b8;
+  --sapAccentBackgroundColor2: #ffd0e7;
+  --sapAccentBackgroundColor3: #fff0fa;
+  --sapAccentBackgroundColor4: #ffdcf3;
+  --sapAccentBackgroundColor5: #ded3ff;
+  --sapAccentBackgroundColor6: #d1efff;
+  --sapAccentBackgroundColor7: #c2fcee;
+  --sapAccentBackgroundColor8: #ebf5cb;
+  --sapAccentBackgroundColor9: #dafdf5;
+  --sapAccentBackgroundColor10: #eaecee;
+  --sapLegend_WorkingBackground: #fff;
+  --sapLegend_NonWorkingBackground: #ebebeb;
+  --sapLegend_CurrentDateTime: #a100c2;
+  --sapLegendColor1: #e18409;
+  --sapLegendColor2: #e65151;
+  --sapLegendColor3: #e71376;
+  --sapLegendColor4: #a63030;
+  --sapLegendColor5: #da52b8;
+  --sapLegendColor6: #1d6ebf;
+  --sapLegendColor7: #089aab;
+  --sapLegendColor8: #92a35b;
+  --sapLegendColor9: #587b93;
+  --sapLegendColor10: #922075;
+  --sapLegendColor11: #7b5b31;
+  --sapLegendColor12: #c72323;
+  --sapLegendColor13: #c71065;
+  --sapLegendColor14: #967244;
+  --sapLegendColor15: #54559c;
+  --sapLegendColor16: #4d7dad;
+  --sapLegendColor17: #3f8188;
+  --sapLegendColor18: #6c832a;
+  --sapLegendColor19: #205992;
+  --sapLegendColor20: #4549c9;
+  --sapLegendBackgroundColor1: #fef4e6;
+  --sapLegendBackgroundColor2: #fce9e9;
+  --sapLegendBackgroundColor3: #fde8f2;
+  --sapLegendBackgroundColor4: #f9ebeb;
+  --sapLegendBackgroundColor5: #fae9f6;
+  --sapLegendBackgroundColor6: #e9f3fc;
+  --sapLegendBackgroundColor7: #e7fcfe;
+  --sapLegendBackgroundColor8: #f4f6ee;
+  --sapLegendBackgroundColor9: #eff3f6;
+  --sapLegendBackgroundColor10: #faeaf6;
+  --sapLegendBackgroundColor11: #f7f2ec;
+  --sapLegendBackgroundColor12: #fbe9e9;
+  --sapLegendBackgroundColor13: #fde8f2;
+  --sapLegendBackgroundColor14: #f7f2ed;
+  --sapLegendBackgroundColor15: #efeff6;
+  --sapLegendBackgroundColor16: #edf2f7;
+  --sapLegendBackgroundColor17: #eef6f7;
+  --sapLegendBackgroundColor18: #f5f9eb;
+  --sapLegendBackgroundColor19: #eaf2fa;
+  --sapLegendBackgroundColor20: #ebebf9;
+  --sapChart_OrderedColor_1: #1B90FF;
+  --sapChart_OrderedColor_2: #f25f18;
+  --sapChart_OrderedColor_3: #179c6f;
+  --sapChart_OrderedColor_4: #f62866;
+  --sapChart_OrderedColor_5: #873fd4;
+  --sapChart_OrderedColor_6: #04ACA7;
+  --sapChart_OrderedColor_7: #0070F2;
+  --sapChart_OrderedColor_8: #CC00DC;
+  --sapChart_OrderedColor_9: #8396A8;
+  --sapChart_OrderedColor_10: #f54848;
+  --sapChart_OrderedColor_11: #20578c;
+  --sapChart_Bad: #D20A0A;
+  --sapChart_Critical: #F58B00;
+  --sapChart_Good: #36A41D;
+  --sapChart_Neutral: #8396A8;
+  --sapChart_Sequence_1: #1B90FF;
+  --sapChart_Sequence_2: #f25f18;
+  --sapChart_Sequence_3: #179c6f;
+  --sapChart_Sequence_4: #f62866;
+  --sapChart_Sequence_5: #873fd4;
+  --sapChart_Sequence_6: #04ACA7;
+  --sapChart_Sequence_7: #0070F2;
+  --sapChart_Sequence_8: #CC00DC;
+  --sapChart_Sequence_9: #8396A8;
+  --sapChart_Sequence_10: #f54848;
+  --sapChart_Sequence_11: #20578c;
+  --sapChart_Sequence_Neutral: #8396A8;
+  --sapFontUrl_SAP-icons_ttf: url('../../../Base/baseLib/sap_horizon/fonts/SAP-icons.ttf');
+  --sapFontUrl_SAP-icons_woff: url('../../../Base/baseLib/sap_horizon/fonts/SAP-icons.woff');
+  --sapFontUrl_SAP-icons_woff2: url('../../../Base/baseLib/sap_horizon/fonts/SAP-icons.woff2');
+  --sapFontUrl_SAP-icons-TNT_ttf: url('../../../Base/baseLib/baseTheme/fonts/SAP-icons-TNT.ttf');
+  --sapFontUrl_SAP-icons-TNT_woff: url('../../../Base/baseLib/baseTheme/fonts/SAP-icons-TNT.woff');
+  --sapFontUrl_SAP-icons-TNT_woff2: url('../../../Base/baseLib/baseTheme/fonts/SAP-icons-TNT.woff2');
+  --sapFontUrl_SAP-icons-Business-Suite_ttf: url('../../../Base/baseLib/baseTheme/fonts/BusinessSuiteInAppSymbols.ttf');
+  --sapFontUrl_SAP-icons-Business-Suite_woff: url('../../../Base/baseLib/baseTheme/fonts/BusinessSuiteInAppSymbols.woff');
+  --sapFontUrl_SAP-icons-Business-Suite_woff2: url('../../../Base/baseLib/baseTheme/fonts/BusinessSuiteInAppSymbols.woff2');
+  --sapFontUrl_72_Regular_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Regular.woff2');
+  --sapFontUrl_72_Regular_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Regular.woff');
+  --sapFontUrl_72_Bold_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Bold.woff2');
+  --sapFontUrl_72_Bold_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Bold.woff');
+  --sapFontUrl_72_Light_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Light.woff2');
+  --sapFontUrl_72_Light_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Light.woff');
+  --sapFontUrl_72_Regular_full_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Regular-full.woff2');
+  --sapFontUrl_72_Regular_full_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Regular-full.woff');
+  --sapFontUrl_72_Bold_full_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Bold-full.woff2');
+  --sapFontUrl_72_Bold_full_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Bold-full.woff');
+  --sapFontUrl_72_Light_full_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Light-full.woff2');
+  --sapFontUrl_72_Light_full_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Light-full.woff');
+  --sapFontUrl_72_Black_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Black.woff2');
+  --sapFontUrl_72_Black_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Black.woff');
+  --sapFontUrl_72_BoldItalic_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-BoldItalic.woff2');
+  --sapFontUrl_72_BoldItalic_woff: url('../../../Base/baseLib/baseTheme/fonts/72-BoldItalic.woff');
+  --sapFontUrl_72_Condensed_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Condensed.woff2');
+  --sapFontUrl_72_Condensed_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Condensed.woff');
+  --sapFontUrl_72_CondensedBold_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-CondensedBold.woff2');
+  --sapFontUrl_72_CondensedBold_woff: url('../../../Base/baseLib/baseTheme/fonts/72-CondensedBold.woff');
+  --sapFontUrl_72_Italic_woff2: url('../../../Base/baseLib/baseTheme/fonts/72-Italic.woff2');
+  --sapFontUrl_72_Italic_woff: url('../../../Base/baseLib/baseTheme/fonts/72-Italic.woff');
+  --sapFontUrl_72Mono_Regular_woff2: url('../../../Base/baseLib/baseTheme/fonts/72Mono-Regular.woff2');
+  --sapFontUrl_72Mono_Regular_woff: url('../../../Base/baseLib/baseTheme/fonts/72Mono-Regular.woff');
+  --sapFontUrl_72Mono_Regular_full_woff2: url('../../../Base/baseLib/baseTheme/fonts/72Mono-Regular-full.woff2');
+  --sapFontUrl_72Mono_Regular_full_woff: url('../../../Base/baseLib/baseTheme/fonts/72Mono-Regular-full.woff');
+  --sapFontUrl_72Mono_Bold_woff2: url('../../../Base/baseLib/baseTheme/fonts/72Mono-Bold.woff2');
+  --sapFontUrl_72Mono_Bold_woff: url('../../../Base/baseLib/baseTheme/fonts/72Mono-Bold.woff');
+  --sapFontUrl_72Mono_Bold_full_woff2: url('../../../Base/baseLib/baseTheme/fonts/72Mono-Bold-full.woff2');
+  --sapFontUrl_72Mono_Bold_full_woff: url('../../../Base/baseLib/baseTheme/fonts/72Mono-Bold-full.woff');
+}
+.background-image--sapCompanyLogo {
+  background-image: var(--sapCompanyLogo);
+}
+.background-image--sapBackgroundImage {
+  background-image: var(--sapBackgroundImage);
+}
+.background-image--sapShell_BackgroundImage {
+  background-image: var(--sapShell_BackgroundImage);
+}

package/dist/themes/sap_horizon_exp/parameters-bundle.css

@@ -0,0 +1 @@
+@import "./css_variables.css";

package/hash.txt

@@ -0,0 +1 @@
+rZnyMTmoc2CFM82C+7zGHcw3GGY=

package/lib/generate-css-vars-usage-report/index.js

@@ -0,0 +1,27 @@
+const fs = require('fs');
+const path = require("path");
+const glob = require("glob");
+const beautify = require("json-beautify");
+
+const vars = new Set();
+
+const processFile = file => {
+	const content = fs.readFileSync(file);
+	const matches = `${content}`.match(/var\(--sap[\-_A-Za-z0-9]+\)/g);
+	matches && matches.forEach(match => {
+		const cssVar = match.match(/--sap[\-_A-Za-z0-9]+/)[0];
+		vars.add(cssVar);
+	});
+};
+
+// Main
+glob.sync(path.join(__dirname, "../../../main/src/themes/**/*.css")).forEach(file => processFile(file));
+
+// Fiori
+glob.sync(path.join(__dirname, "../../../fiori/src/themes/**/*.css")).forEach(file => processFile(file));
+
+const collator = new Intl.Collator(undefined, {numeric: true, sensitivity: 'base'});
+const result = Array.from(vars).sort(collator.compare); // natural sort
+
+fs.writeFileSync(path.join(__dirname, "../../css-vars-usage.json"), beautify(result, null, 2, 100));
+console.log("CSS Vars usage report generated.");

package/package-scripts.js

@@ -0,0 +1,38 @@
+const resolve = require("resolve");
+const assets = require('@ui5/webcomponents-tools/assets-meta.js');
+
+const jsonImportsScript = resolve.sync("@ui5/webcomponents-tools/lib/generate-json-imports/themes.js");
+const generateReportScript = resolve.sync("@ui5/webcomponents-theming/lib/generate-css-vars-usage-report/index.js");
+
+const allThemes = assets.themes.all;
+const buildThemesCommands = {};
+const buildThemesCommandsNames = allThemes.map(theme => `build.themes.${theme}`).join(" ");
+
+buildThemesCommands["prepare"] = allThemes.map(theme => `mkdirp dist/themes/${theme}`).join(" && ");
+allThemes.forEach(theme => {
+	buildThemesCommands[theme] = `nps build.themes.copy_${theme}_vars build.themes.copy_${theme}_bundle`;
+	buildThemesCommands[`copy_${theme}_vars`] = `copy-and-watch "../../node_modules/@sap-theming/theming-base-content/content/Base/baseLib/${theme.replace("sap_horizon_exp", "sap_horizon")}/css_variables.css" dist/themes/${theme}/`;
+	buildThemesCommands[`copy_${theme}_bundle`] = `copy-and-watch "src/themes/${theme}/parameters-bundle.css" dist/themes/${theme}/`;
+});
+
+const generateHash = resolve.sync("@ui5/webcomponents-tools/lib/hash/generate.js");
+const hashIsUpToDate = resolve.sync("@ui5/webcomponents-tools/lib/hash/upToDate.js");
+const UP_TO_DATE = `node "${hashIsUpToDate}" dist/ hash.txt && echo "Up to date."`;
+
+module.exports = {
+	scripts: {
+		clean: "rimraf dist",
+		build: {
+			default: `${UP_TO_DATE} || nps clean build.src build.themes build.postcss build.jsonImports generateReport hash`,
+			src: `copy-and-watch "src/**/*.js" dist/`,
+			themes: {
+				default: `nps build.themes.prepare ${buildThemesCommandsNames}`,
+				...buildThemesCommands
+			},
+			postcss: "postcss dist/**/parameters-bundle.css --config config/postcss.themes --base dist/ --dir dist/css/",
+			jsonImports: `node "${jsonImportsScript}" dist/generated/assets/themes dist/generated/json-imports`,
+		},
+		generateReport: `node "${generateReportScript}"`,
+		hash: `node ${generateHash} dist/ hash.txt`,
+	},
+};