npm - @ui5/webcomponents-fiori - Versions diffs - 2.19.0-rc.2 → 2.19.0-rc.3 - Mend

@ui5/webcomponents-fiori 2.19.0-rc.2 → 2.19.0-rc.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (449) hide show

package/src/themes/sap_horizon_exp/TimelineItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/TimelineItem-parameters.css";
-:root {
+:host {
 	--_ui5_TimelineItem_bubble_border_width: 0.125rem;
 	--_ui5_TimelineItem_bubble_border_style: solid;
 	--_ui5_TimelineItem_bubble_border_radius: var(--sapElement_BorderCornerRadius);

package/src/themes/sap_horizon_exp/UploadCollection-parameters.css CHANGED Viewed

@@ -1,5 +1,5 @@
 @import "../base/UploadCollection-parameters.css";
-:root {
+:host {
 	--ui5_upload_collection_small_size_buttons_margin_block_start: 0.5rem;
 }

package/src/themes/sap_horizon_exp/Wizard-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/Wizard-parameters.css";
-:root {
+:host {
     --_ui5_wiz_content_item_wrapper_padding: 1rem;
     --_ui5_wiz_content_item_wrapper_bg: var(--sapGroup_ContentBackground);
 }

package/src/themes/sap_horizon_exp/WizardTab-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/WizardTab-parameters.css";
-:root {
+:host {
 	--_ui5_wiz_tab_title_color: var(--sapTextColor);
 	--_ui5_wiz_tab_title_font_family: var(--sapFontBoldFamily);
 	--_ui5_wiz_tab_focus_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);

package/src/themes/sap_horizon_hcb/DynamicPageTitle-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/DynamicPageTitle-parameters.css";
-:root {
+:host {
     /*text-shadow of titles, breadcrumbs*/
     --sapContent_TextShadow: none;

package/src/themes/sap_horizon_hcb/FlexibleColumnLayout-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
-:root {
+:host {
 	--_ui5_fcl_solid_bg: var(--sapBackgroundColor);
 	--_ui5_fcl_column_border: solid 0.0625rem var(--sapGroup_ContentBorderColor);
-	--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapObjectHeader_BorderColor), #000);
-	--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapObjectHeader_BorderColor), #000);
+	--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapObjectHeader_BorderColor), #000);
+	--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapObjectHeader_BorderColor), #000);
 }

package/src/themes/sap_horizon_hcb/MediaGallery-parameters.css CHANGED Viewed

@@ -1,4 +1,4 @@
-:root {
+:host {
 	--_ui5_media_gallery_overflow_btn_background:  var(--sapButton_Background);
 	--_ui5_media_gallery_overflow_btn_color:  var(--sapButton_TextColor);
 	--_ui5_media_gallery_overflow_btn_border:  1px solid var(--sapButton_BorderColor);

package/src/themes/sap_horizon_hcb/NotificationListItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/NotificationListItem-parameters.css";
-:root {
+:host {
 	--_ui5-notification_item-border-radius: var(--sapTile_BorderCornerRadius);
 	--_ui5-notification_group_header-border-bottom-width: 0;
 	--_ui5-notification_group_header-padding: 0.5rem;

package/src/themes/sap_horizon_hcb/Page-parameters.css CHANGED Viewed

@@ -1,4 +1,4 @@
-:root {
+:host {
 	--_ui5_page_list_bg: var(--sapGroup_ContentBackground);
 	--_ui5_page_transparent_bg: var(--sapBackgroundColor);
 }

package/src/themes/sap_horizon_hcb/ProductSwitchItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/ProductSwitchItem-parameters.css";
-:root {
+:host {
 	--_ui5_product_switch_item_outline_offset: -.25rem;
 	--_ui5_product_switch_item_border: 1px solid var(--sapField_BorderColor);
 }

package/src/themes/sap_horizon_hcb/SearchField-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/SearchField-parameters.css";
-:root {
+:host {
 	--_ui5_search_icon_border_radius: 0.375rem;
 	--_ui5_search_input_border_radius: none;
 	--_ui5-search-border: var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);

package/src/themes/sap_horizon_hcb/ShellBar-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/ShellBar-parameters.css";
-:root {
+:host {
 	--_ui5_shellbar_root_height: 3.25rem;
 	--_ui5_shellbar_button_border: var(--sapButton_BorderWidth) solid var(--sapButton_BorderColor);
 	--_ui5_shellbar_button_border_radius: var(--sapButton_BorderCornerRadius);

package/src/themes/sap_horizon_hcb/SideNavigation-parameters.css CHANGED Viewed

@@ -1,12 +1,12 @@
 @import "../base/SideNavigation-parameters.css";
-:root {
+:host {
 	--_ui5_side_navigation_width: 16rem;
 	--_ui5_side_navigation_collapsed_width: 4rem;
 	--_ui5_side_navigation_navigation_separator_margin: 0.25rem 0.5rem 0.25rem 0.5rem;
 	--_ui5_side_navigation_navigation_separator_margin_collapsed: var(--_ui5_side_navigation_navigation_separator_margin);
-	--_ui5_side_navigation_navigation_separator_height:  0.0625rem;
+	--_ui5_side_navigation_navigation_separator_height: 0.0625rem;
 	--_ui5_side_navigation_border_right: 0;
 	--_ui5_side_navigation_box_shadow: var(--sapContent_Shadow0);
 	--_ui5_side_navigation_triangle_display: none;
@@ -26,12 +26,12 @@
 	--_ui5_side_navigation_hover_border_width: 0.0625rem;
 	--_ui5_side_navigation_selected_border_width: 0.0625rem;
 	--_ui5_side_navigation_collapsed_selected_item_background: 0 100% / 0.188rem 100% no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_SelectionBackgroundColor);
-	--_ui5_side_navigation_collapsed_selected_item_background_hover: 0 100% / 0.188rem 100%  no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_Hover_SelectionBackground);
+	--_ui5_side_navigation_collapsed_selected_item_background_hover: 0 100% / 0.188rem 100% no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_Hover_SelectionBackground);
 	--_ui5_side_navigation_selected_and_focused_border_style_color: none;
 	--_ui5_side_navigation_group_icon_width: 2.5rem;
 	--_ui5_side_navigation_icon_padding_inline_end: 0.5rem;
 	--_ui5_side_navigation_group_padding: 1rem;
-	--_ui5_side_navigation_padding-flexible: 0.5rem 0.5rem 0 0.5rem;
+	--_ui5_side_navigation_padding-flexible: 0.5rem 0.5rem 0 0.5rem;
 	--_ui5_side_navigation_padding-fixed: 0 0.5rem 0.5rem 0.5rem;
 	--_ui5_side_navigation_popup_padding: 0.5rem;
 	--_ui5_side_navigation_popup_title_line_height: 1.5rem;
@@ -46,8 +46,8 @@
 	--_ui5_side_navigation_item_collapsed_padding: 3rem;
 }
-[data-ui5-compact-size],
-.ui5-content-density-compact,
-.sapUiSizeCompact {
-	--_ui5_side_navigation_item_height: 2rem;
-}
+@container style(--ui5_content_density: compact) {
+	:host {
+		--_ui5_side_navigation_item_height: 2rem;
+	}
+}

package/src/themes/sap_horizon_hcb/TimelineItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/TimelineItem-parameters.css";
-:root {
+:host {
 	--_ui5_TimelineItem_bubble_rtl_left_offset: -0.1875rem;
 	--_ui5_TimelineItem_bubble_rtl_right_offset: -0.6875rem;
 }

package/src/themes/sap_horizon_hcb/UploadCollection-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/UploadCollection-parameters.css";
-:root {
+:host {
 	--ui5_upload_collection_drag_overlay_border: 0.1875rem dashed var(--sapField_BorderColor);
 	--ui5_upload_collection_drop_overlay_border: 0.1875rem solid var(--sapContent_DragAndDropActiveColor);
 	--ui5_upload_collection_drop_overlay_background: var(--sapContent_DragAndDropActiveColor);

package/src/themes/sap_horizon_hcb/Wizard-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/Wizard-parameters.css";
-:root {
+:host {
     --_ui5_wiz_content_item_wrapper_padding: 1rem;
     --_ui5_wiz_content_item_wrapper_bg: var(--sapGroup_ContentBackground);
 }

package/src/themes/sap_horizon_hcb/WizardTab-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/WizardTab-parameters.css";
-:root {
+:host {
 	--_ui5_wiz_tab_focus_outline: 0.125rem dotted var(--sapContent_FocusColor);
 	--_ui5_wiz_tab_selection_line: var(--sapTextColor);
 	--_ui5_wiz_tab_border: 1px solid var(--sapContent_Selected_ForegroundColor);

package/src/themes/sap_horizon_hcb_exp/FlexibleColumnLayout-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
-:root {
+:host {
 	--_ui5_fcl_solid_bg: var(--sapBackgroundColor);
 	--_ui5_fcl_column_border: solid 0.0625rem var(--sapGroup_ContentBorderColor);
-	--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapObjectHeader_BorderColor), #000);
-	--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapObjectHeader_BorderColor), #000);
+	--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapObjectHeader_BorderColor), #000);
+	--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapObjectHeader_BorderColor), #000);
 }

package/src/themes/sap_horizon_hcb_exp/MediaGallery-parameters.css CHANGED Viewed

@@ -1,4 +1,4 @@
-:root {
+:host {
 	--_ui5_media_gallery_overflow_btn_background:  var(--sapButton_Background);
 	--_ui5_media_gallery_overflow_btn_color:  var(--sapButton_TextColor);
 	--_ui5_media_gallery_overflow_btn_border:  1px solid var(--sapButton_BorderColor);

package/src/themes/sap_horizon_hcb_exp/Page-parameters.css CHANGED Viewed

@@ -1,4 +1,4 @@
-:root {
+:host {
 	--_ui5_page_list_bg: var(--sapGroup_ContentBackground);
 	--_ui5_page_transparent_bg: var(--sapBackgroundColor);
 }

package/src/themes/sap_horizon_hcb_exp/ProductSwitchItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/ProductSwitchItem-parameters.css";
-:root {
+:host {
 	--_ui5_product_switch_item_outline_offset: -.25rem;
 	--_ui5_product_switch_item_border: 1px solid var(--sapField_BorderColor);
 }

package/src/themes/sap_horizon_hcb_exp/ShellBar-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/ShellBar-parameters.css";
-:root {
+:host {
 	--_ui5_shellbar_button_border: var(--sapButton_BorderWidth) solid var(--sapButton_BorderColor);
 	--_ui5_shellbar_button_border_radius: var(--sapButton_BorderCornerRadius);
 	--_ui5_shellbar_button_focused_border: 0.125rem dotted var(--sapContent_FocusColor);

package/src/themes/sap_horizon_hcb_exp/SideNavigation-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/SideNavigation-parameters.css";
-:root {
+:host {
 	--_ui5_side_navigation_width: 16rem;
 	--_ui5_side_navigation_box_shadow: var(--sapContent_Shadow0);
 	--_ui5_side_navigation_icon_padding_inline_end: 0.4375rem;
@@ -9,8 +9,8 @@
 	--_ui5_side_navigation_item_height: 2.5rem;
 }
-[data-ui5-compact-size],
-.ui5-content-density-compact,
-.sapUiSizeCompact {
-	--_ui5_side_navigation_item_height: 2rem;
+@container style(--ui5_content_density: compact) {
+	:host {
+		--_ui5_side_navigation_item_height: 2rem;
+	}
 }

package/src/themes/sap_horizon_hcb_exp/TimelineItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/TimelineItem-parameters.css";
-:root {
+:host {
 	--_ui5_TimelineItem_bubble_rtl_left_offset: -0.1875rem;
 	--_ui5_TimelineItem_bubble_rtl_right_offset: -0.6875rem;
 }

package/src/themes/sap_horizon_hcb_exp/UploadCollection-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/UploadCollection-parameters.css";
-:root {
+:host {
 	--ui5_upload_collection_drag_overlay_border: 0.1875rem dashed var(--sapContent_ForegroundBorderColor);
 	--ui5_upload_collection_drop_overlay_border: 0.1875rem solid var(--sapContent_HelpColor);
 	--ui5_upload_collection_drop_overlay_background: transparent;

package/src/themes/sap_horizon_hcb_exp/Wizard-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/Wizard-parameters.css";
-:root {
+:host {
     --_ui5_wiz_content_item_wrapper_padding: 1rem;
     --_ui5_wiz_content_item_wrapper_bg: var(--sapGroup_ContentBackground);
 }

package/src/themes/sap_horizon_hcb_exp/WizardTab-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/WizardTab-parameters.css";
-:root {
+:host {
 	--_ui5_wiz_tab_focus_outline: 0.125rem dotted var(--sapContent_FocusColor);
 	--_ui5_wiz_tab_selection_line: var(--sapTextColor);
 	--_ui5_wiz_tab_border: 1px solid var(--sapContent_Selected_ForegroundColor);

package/src/themes/sap_horizon_hcw/DynamicPageTitle-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/DynamicPageTitle-parameters.css";
-:root {
+:host {
     /*text-shadow of titles, breadcrumbs*/
     --sapContent_TextShadow: none;

package/src/themes/sap_horizon_hcw/FlexibleColumnLayout-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
-:root {
+:host {
 	--_ui5_fcl_solid_bg: var(--sapBackgroundColor);
 	--_ui5_fcl_column_border: solid 0.0625rem var(--sapGroup_ContentBorderColor);
-	--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapObjectHeader_BorderColor), #fff);
-	--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapObjectHeader_BorderColor), #fff);
+	--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapObjectHeader_BorderColor), #fff);
+	--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapObjectHeader_BorderColor), #fff);
 }

package/src/themes/sap_horizon_hcw/MediaGallery-parameters.css CHANGED Viewed

@@ -1,4 +1,4 @@
-:root {
+:host {
 	--_ui5_media_gallery_overflow_btn_background:  var(--sapButton_Background);
 	--_ui5_media_gallery_overflow_btn_color:  var(--sapButton_TextColor);
 	--_ui5_media_gallery_overflow_btn_border:  1px solid var(--sapButton_BorderColor);

package/src/themes/sap_horizon_hcw/NotificationListItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/NotificationListItem-parameters.css";
-:root {
+:host {
 	--_ui5-notification_item-border-radius: var(--sapTile_BorderCornerRadius);
 	--_ui5-notification_group_header-border-bottom-width: 0;
 	--_ui5-notification_group_header-padding: 0.5rem;

package/src/themes/sap_horizon_hcw/Page-parameters.css CHANGED Viewed

@@ -1,4 +1,4 @@
-:root {
+:host {
 	--_ui5_page_list_bg: var(--sapGroup_ContentBackground);
 	--_ui5_page_transparent_bg: var(--sapBackgroundColor);
 }

package/src/themes/sap_horizon_hcw/ProductSwitchItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/ProductSwitchItem-parameters.css";
-:root {
+:host {
 	--_ui5_product_switch_item_outline_offset: -.25rem;
 	--_ui5_product_switch_item_border: 1px solid var(--sapField_BorderColor);
 }

package/src/themes/sap_horizon_hcw/SearchField-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/SearchField-parameters.css";
-:root {
+:host {
 	--_ui5_search_icon_border_radius: 0.375rem;
 	--_ui5_search_input_border_radius: none;
 	--_ui5-search-border: var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);

package/src/themes/sap_horizon_hcw/ShellBar-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/ShellBar-parameters.css";
-:root {
+:host {
 	--_ui5_shellbar_root_height: 3.25rem;
 	--_ui5_shellbar_button_border: var(--sapButton_BorderWidth) solid var(--sapButton_BorderColor);
 	--_ui5_shellbar_button_border_radius: var(--sapButton_BorderCornerRadius);

package/src/themes/sap_horizon_hcw/SideNavigation-parameters.css CHANGED Viewed

@@ -1,12 +1,12 @@
 @import "../base/SideNavigation-parameters.css";
-:root {
+:host {
 	--_ui5_side_navigation_width: 16rem;
 	--_ui5_side_navigation_collapsed_width: 4rem;
 	--_ui5_side_navigation_navigation_separator_margin: 0.25rem 0.5rem 0.25rem 0.5rem;
 	--_ui5_side_navigation_navigation_separator_margin_collapsed: var(--_ui5_side_navigation_navigation_separator_margin);
-	--_ui5_side_navigation_navigation_separator_height:  0.0625rem;
+	--_ui5_side_navigation_navigation_separator_height: 0.0625rem;
 	--_ui5_side_navigation_border_right: 0;
 	--_ui5_side_navigation_box_shadow: var(--sapContent_Shadow0);
 	--_ui5_side_navigation_triangle_display: none;
@@ -26,12 +26,12 @@
 	--_ui5_side_navigation_hover_border_width: 0.0625rem;
 	--_ui5_side_navigation_selected_border_width: 0.0625rem;
 	--_ui5_side_navigation_collapsed_selected_item_background: 0 100% / 0.188rem 100% no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_SelectionBackgroundColor);
-	--_ui5_side_navigation_collapsed_selected_item_background_hover: 0 100% / 0.188rem 100%  no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_Hover_SelectionBackground);
+	--_ui5_side_navigation_collapsed_selected_item_background_hover: 0 100% / 0.188rem 100% no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_Hover_SelectionBackground);
 	--_ui5_side_navigation_selected_and_focused_border_style_color: none;
 	--_ui5_side_navigation_group_icon_width: 2.5rem;
 	--_ui5_side_navigation_icon_padding_inline_end: 0.5rem;
 	--_ui5_side_navigation_group_padding: 1rem;
-	--_ui5_side_navigation_padding-flexible: 0.5rem 0.5rem 0 0.5rem;
+	--_ui5_side_navigation_padding-flexible: 0.5rem 0.5rem 0 0.5rem;
 	--_ui5_side_navigation_padding-fixed: 0 0.5rem 0.5rem 0.5rem;
 	--_ui5_side_navigation_popup_padding: 0.5rem;
 	--_ui5_side_navigation_popup_title_line_height: 1.5rem;
@@ -46,8 +46,8 @@
 	--_ui5_side_navigation_item_collapsed_padding: 3rem;
 }
-[data-ui5-compact-size],
-.ui5-content-density-compact,
-.sapUiSizeCompact {
-	--_ui5_side_navigation_item_height: 2rem;
-}
+@container style(--ui5_content_density: compact) {
+	:host {
+		--_ui5_side_navigation_item_height: 2rem;
+	}
+}

package/src/themes/sap_horizon_hcw/TimelineItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/TimelineItem-parameters.css";
-:root {
+:host {
 	--_ui5_TimelineItem_bubble_rtl_left_offset: -0.1875rem;
 	--_ui5_TimelineItem_bubble_rtl_right_offset: -0.6875rem;
 }

package/src/themes/sap_horizon_hcw/UploadCollection-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/UploadCollection-parameters.css";
-:root {
+:host {
 	--ui5_upload_collection_drag_overlay_border: 0.1875rem dashed var(--sapField_BorderColor);
 	--ui5_upload_collection_drop_overlay_border: 0.1875rem solid var(--sapContent_DragAndDropActiveColor);
 	--ui5_upload_collection_small_size_buttons_margin_block_start: 0.5rem;

package/src/themes/sap_horizon_hcw/Wizard-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/Wizard-parameters.css";
-:root {
+:host {
     --_ui5_wiz_content_item_wrapper_padding: 1rem;
     --_ui5_wiz_content_item_wrapper_bg: var(--sapGroup_ContentBackground);
 }

package/src/themes/sap_horizon_hcw/WizardTab-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/WizardTab-parameters.css";
-:root {
+:host {
 	--_ui5_wiz_tab_focus_outline: 0.125rem dotted var(--sapContent_FocusColor);
 	--_ui5_wiz_tab_selection_line: var(--sapTextColor);
 	--_ui5_wiz_tab_border: 1px solid var(--sapContent_Selected_ForegroundColor);

package/src/themes/sap_horizon_hcw_exp/FlexibleColumnLayout-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
-:root {
+:host {
 	--_ui5_fcl_solid_bg: var(--sapBackgroundColor);
 	--_ui5_fcl_column_border: solid 0.0625rem var(--sapGroup_ContentBorderColor);
-	--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapObjectHeader_BorderColor), #fff);
-	--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapObjectHeader_BorderColor), #fff);
+	--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapObjectHeader_BorderColor), #fff);
+	--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapObjectHeader_BorderColor), #fff);
 }

package/src/themes/sap_horizon_hcw_exp/MediaGallery-parameters.css CHANGED Viewed

@@ -1,4 +1,4 @@
-:root {
+:host {
 	--_ui5_media_gallery_overflow_btn_background:  var(--sapButton_Background);
 	--_ui5_media_gallery_overflow_btn_color:  var(--sapButton_TextColor);
 	--_ui5_media_gallery_overflow_btn_border:  1px solid var(--sapButton_BorderColor);

package/src/themes/sap_horizon_hcw_exp/Page-parameters.css CHANGED Viewed

@@ -1,4 +1,4 @@
-:root {
+:host {
 	--_ui5_page_list_bg: var(--sapGroup_ContentBackground);
 	--_ui5_page_transparent_bg: var(--sapBackgroundColor);
 }

package/src/themes/sap_horizon_hcw_exp/ProductSwitchItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/ProductSwitchItem-parameters.css";
-:root {
+:host {
 	--_ui5_product_switch_item_outline_offset: -.25rem;
 	--_ui5_product_switch_item_border: 1px solid var(--sapField_BorderColor);
 }

package/src/themes/sap_horizon_hcw_exp/ShellBar-parameters.css CHANGED Viewed

@@ -1,5 +1,5 @@
 @import "../base/ShellBar-parameters.css";
-:root {
+:host {
 	--_ui5_shellbar_button_focused_border: 0.125rem dotted var(--sapContent_FocusColor);
 }

package/src/themes/sap_horizon_hcw_exp/SideNavigation-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/SideNavigation-parameters.css";
-:root {
+:host {
 	--_ui5_side_navigation_width: 16rem;
 	--_ui5_side_navigation_box_shadow: var(--sapContent_Shadow0);
 	--_ui5_side_navigation_icon_padding_inline_end: 0.4375rem;
@@ -9,8 +9,8 @@
 	--_ui5_side_navigation_item_height: 2.5rem;
 }
-[data-ui5-compact-size],
-.ui5-content-density-compact,
-.sapUiSizeCompact {
-	--_ui5_side_navigation_item_height: 2rem;
+@container style(--ui5_content_density: compact) {
+	:host {
+		--_ui5_side_navigation_item_height: 2rem;
+	}
 }

package/src/themes/sap_horizon_hcw_exp/TimelineItem-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/TimelineItem-parameters.css";
-:root {
+:host {
 	--_ui5_TimelineItem_bubble_rtl_left_offset: -0.1875rem;
 	--_ui5_TimelineItem_bubble_rtl_right_offset: -0.6875rem;
 }

package/src/themes/sap_horizon_hcw_exp/UploadCollection-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/UploadCollection-parameters.css";
-:root {
+:host {
 	--ui5_upload_collection_drag_overlay_border: 0.1875rem dashed var(--sapContent_ForegroundBorderColor);
 	--ui5_upload_collection_drop_overlay_border: 0.1875rem solid var(--sapContent_HelpColor);
 	--ui5_upload_collection_small_size_buttons_margin_block_start: 0.5rem;

package/src/themes/sap_horizon_hcw_exp/Wizard-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/Wizard-parameters.css";
-:root {
+:host {
     --_ui5_wiz_content_item_wrapper_padding: 1rem;
     --_ui5_wiz_content_item_wrapper_bg: var(--sapGroup_ContentBackground);
 }

package/src/themes/sap_horizon_hcw_exp/WizardTab-parameters.css CHANGED Viewed

@@ -1,6 +1,6 @@
 @import "../base/WizardTab-parameters.css";
-:root {
+:host {
 	--_ui5_wiz_tab_focus_outline: 0.125rem dotted var(--sapContent_FocusColor);
 	--_ui5_wiz_tab_selection_line: var(--sapTextColor);
 	--_ui5_wiz_tab_border: 1px solid var(--sapContent_Selected_ForegroundColor);