diff --git a/packages/fiori/src/themes/SideNavigation.css b/packages/fiori/src/themes/SideNavigation.css index 97787081618c..f754d961c231 100644 --- a/packages/fiori/src/themes/SideNavigation.css +++ b/packages/fiori/src/themes/SideNavigation.css @@ -5,8 +5,6 @@ width: var(--_ui5_side_navigation_width); max-width: 100%; transition: width 0.3s, min-width 0.3s; - border-radius: var(--_ui5_side_navigation_border_radius); - box-shadow: var(--_ui5_side_navigation_box_shadow); font-family: "72override", var(--sapFontFamily); font-size: var(--sapFontSize); background: var(--sapList_Background); @@ -17,10 +15,6 @@ width: var(--_ui5_side_navigation_collapsed_width); } -:host([is-touch-device]) { - border-radius: var(--_ui5_side_navigation_phone_border_radius); -} - .ui5-sn-root { height: 100%; display: flex; diff --git a/packages/fiori/src/themes/base/SideNavigation-parameters.css b/packages/fiori/src/themes/base/SideNavigation-parameters.css index 4f3aed2914f0..910def860954 100644 --- a/packages/fiori/src/themes/base/SideNavigation-parameters.css +++ b/packages/fiori/src/themes/base/SideNavigation-parameters.css @@ -11,9 +11,6 @@ --_ui5_side_navigation_navigation_separator_height: calc(2 * var(--sapList_BorderWidth)); --_ui5_side_navigation_triangle_color: var(--sapContent_IconColor); --_ui5_side_navigation_border_right: 1px solid var(--sapGroup_ContentBorderColor); - --_ui5_side_navigation_border_radius: 0; - --_ui5_side_navigation_phone_border_radius: 0; - --_ui5_side_navigation_box_shadow: none; --_ui5_side_navigation_triangle_display: block; --_ui5_side_navigation_phone_width: var(--_ui5_side_navigation_width); diff --git a/packages/fiori/src/themes/sap_horizon/SideNavigation-parameters.css b/packages/fiori/src/themes/sap_horizon/SideNavigation-parameters.css index 87bf769b782b..43ef5678df39 100644 --- a/packages/fiori/src/themes/sap_horizon/SideNavigation-parameters.css +++ b/packages/fiori/src/themes/sap_horizon/SideNavigation-parameters.css @@ -11,11 +11,6 @@ --_ui5_side_navigation_navigation_separator_height: 0.0625rem; --_ui5_side_navigation_triangle_color: var(--sapContent_NonInteractiveIconColor); --_ui5_side_navigation_border_right: 0; - --_ui5_side_navigation_border_radius: 0.5rem 0.5rem 0 0; - --_ui5_side_navigation_phone_border_radius: 0.5rem; - --_ui5_side_navigation_shadow_color1: color-mix(in srgb, var(--sapContent_ShadowColor) 16%, transparent); - --_ui5_side_navigation_shadow_color2: color-mix(in srgb, var(--sapContent_ShadowColor) 16%, transparent); - --_ui5_side_navigation_box_shadow: 0 0 0.125rem 0 var(--_ui5_side_navigation_shadow_color1), 0 0.5rem 1rem 0 var(--_ui5_side_navigation_shadow_color2); --_ui5_side_navigation_triangle_display: none; --_ui5_side_navigation_phone_width: 100%; diff --git a/packages/fiori/src/themes/sap_horizon_dark/SideNavigation-parameters.css b/packages/fiori/src/themes/sap_horizon_dark/SideNavigation-parameters.css index 836fc71c4828..315048c1acfb 100644 --- a/packages/fiori/src/themes/sap_horizon_dark/SideNavigation-parameters.css +++ b/packages/fiori/src/themes/sap_horizon_dark/SideNavigation-parameters.css @@ -11,11 +11,6 @@ --_ui5_side_navigation_navigation_separator_height: 0.0625rem; --_ui5_side_navigation_triangle_color: var(--sapContent_NonInteractiveIconColor); --_ui5_side_navigation_border_right: 0; - --_ui5_side_navigation_border_radius: 0.5rem 0.5rem 0 0; - --_ui5_side_navigation_phone_border_radius: 0.5rem; - --_ui5_side_navigation_shadow_color1: color-mix(in srgb, var(--sapContent_ShadowColor) 16%, transparent); - --_ui5_side_navigation_shadow_color2: color-mix(in srgb, var(--sapContent_ShadowColor) 32%, transparent); - --_ui5_side_navigation_box_shadow: 0 0 0.125rem 0 var(--_ui5_side_navigation_shadow_color1), 0 0.5rem 1rem 0 var(--_ui5_side_navigation_shadow_color2); --_ui5_side_navigation_triangle_display: none; --_ui5_side_navigation_phone_width: 100%; diff --git a/packages/fiori/src/themes/sap_horizon_hcb/SideNavigation-parameters.css b/packages/fiori/src/themes/sap_horizon_hcb/SideNavigation-parameters.css index 4f3647784a20..f23dce523929 100644 --- a/packages/fiori/src/themes/sap_horizon_hcb/SideNavigation-parameters.css +++ b/packages/fiori/src/themes/sap_horizon_hcb/SideNavigation-parameters.css @@ -6,11 +6,6 @@ --_ui5_side_navigation_navigation_separator_height: 0.0625rem; --_ui5_side_navigation_border_right: 0; - --_ui5_side_navigation_border_radius: 0.5rem 0.5rem 0 0; - --_ui5_side_navigation_phone_border_radius: 0.5rem; - --_ui5_side_navigation_shadow_color1: var(--sapContent_ShadowColor); - --_ui5_side_navigation_shadow_color2: color-mix(in srgb, var(--sapContent_ShadowColor) 16%, transparent); - --_ui5_side_navigation_box_shadow: 0 0 0 0.0625rem var(--_ui5_side_navigation_shadow_color1), 0 0.5rem 1rem 0 var(--_ui5_side_navigation_shadow_color2); --_ui5_side_navigation_triangle_display: none; --_ui5_side_navigation_phone_width: 100% !important; diff --git a/packages/fiori/src/themes/sap_horizon_hcw/SideNavigation-parameters.css b/packages/fiori/src/themes/sap_horizon_hcw/SideNavigation-parameters.css index 4f3647784a20..f23dce523929 100644 --- a/packages/fiori/src/themes/sap_horizon_hcw/SideNavigation-parameters.css +++ b/packages/fiori/src/themes/sap_horizon_hcw/SideNavigation-parameters.css @@ -6,11 +6,6 @@ --_ui5_side_navigation_navigation_separator_height: 0.0625rem; --_ui5_side_navigation_border_right: 0; - --_ui5_side_navigation_border_radius: 0.5rem 0.5rem 0 0; - --_ui5_side_navigation_phone_border_radius: 0.5rem; - --_ui5_side_navigation_shadow_color1: var(--sapContent_ShadowColor); - --_ui5_side_navigation_shadow_color2: color-mix(in srgb, var(--sapContent_ShadowColor) 16%, transparent); - --_ui5_side_navigation_box_shadow: 0 0 0 0.0625rem var(--_ui5_side_navigation_shadow_color1), 0 0.5rem 1rem 0 var(--_ui5_side_navigation_shadow_color2); --_ui5_side_navigation_triangle_display: none; --_ui5_side_navigation_phone_width: 100% !important; diff --git a/packages/website/docs/_samples/fiori/SideNavigation/ToolLayout/main.css b/packages/website/docs/_samples/fiori/SideNavigation/ToolLayout/main.css index e43bcfbad7ca..870190b9c29c 100644 --- a/packages/website/docs/_samples/fiori/SideNavigation/ToolLayout/main.css +++ b/packages/website/docs/_samples/fiori/SideNavigation/ToolLayout/main.css @@ -1,5 +1,9 @@ ui5-side-navigation { height: 600px; + border-radius: 0.5rem 0.5rem 0 0; + box-shadow: + 0 0 0.125rem 0 color-mix(in srgb, var(--sapContent_ShadowColor) 16%, transparent), + 0 0.5rem 1rem 0 color-mix(in srgb, var(--sapContent_ShadowColor) 16%, transparent); } ui5-shellbar::part(root) {