diff --git a/packages/fiori/src/themes/SearchField.css b/packages/fiori/src/themes/SearchField.css index b23ea0cb6c17..f7fda09f755d 100644 --- a/packages/fiori/src/themes/SearchField.css +++ b/packages/fiori/src/themes/SearchField.css @@ -87,8 +87,15 @@ --_ui5_select_label_color: var(--sapShell_TextColor); } -[ui5-select]:hover { - box-shadow: var(--sapField_Hover_Shadow); +[ui5-select]:hover, +.ui5-search-field-select::part(icon-wrapper):hover { + box-shadow: var(--_ui5-search_input_scope_hover_shadow); +} + +[ui5-select]:active, +.ui5-search-field-select:active::part(icon-wrapper) { + box-shadow: var(--_ui5-search_input_scope_active_shadow); + background: var(--sapShell_Active_Background); } [ui5-select]::part(icon) { @@ -283,18 +290,6 @@ height: 100%; } -.ui5-search-field-select[focused]::part(icon-wrapper) { - box-shadow: var(--sapField_Hover_Shadow); -} - -:host(:not([collapsed]):hover):has([ui5-select]:hover) { - background: var(--_ui5-search-wrapper-background); -} - -:host(:not([collapsed])):has([ui5-select][focused]) { - background: var(--_ui5-search-wrapper-background); -} - .ui5-search-field-inner-input::selection { background: var(--sapSelectedColor); color: var(--sapContent_ContrastTextColor); diff --git a/packages/fiori/src/themes/base/SearchField-parameters.css b/packages/fiori/src/themes/base/SearchField-parameters.css index 0068a8e68edb..705d977ec68f 100644 --- a/packages/fiori/src/themes/base/SearchField-parameters.css +++ b/packages/fiori/src/themes/base/SearchField-parameters.css @@ -10,6 +10,8 @@ --_ui5-search-elements-hover-background: none; --_ui5-search-elements-active-background: none; --_ui5_search_input_scope_margin: 0 0.125rem 0 .5rem; + --_ui5-search_input_scope_hover_shadow: inset 0 0 0 var(--sapField_BorderWidth) var(--sapButton_Lite_Hover_BorderColor); + --_ui5-search_input_scope_active_shadow: inset 0 0 0 var(--sapField_BorderWidth) var(--sapButton_Lite_Active_BorderColor); --_ui5-search-elements-background: inherit; --_ui5_search_wrapper_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapField_Active_BorderColor); --_ui5_search_input_outline: none; diff --git a/packages/fiori/src/themes/sap_fiori_3/SearchField-parameters.css b/packages/fiori/src/themes/sap_fiori_3/SearchField-parameters.css index 46ca073813dd..25455d3465b6 100644 --- a/packages/fiori/src/themes/sap_fiori_3/SearchField-parameters.css +++ b/packages/fiori/src/themes/sap_fiori_3/SearchField-parameters.css @@ -9,6 +9,8 @@ --_ui5-search-wrapper-hover-background: none; --_ui5-search-wrapper-hover-background-color: none; --_ui5_search_input_scope_margin: 0; + --_ui5-search_input_scope_hover_shadow: none; + --_ui5-search_input_scope_active_shadow: none; --_ui5-search-elements-background: var(--sapShell_InteractiveBackground); --_ui5-search-elements-hover-background: var(--sapShell_Hover_Background); --_ui5-search-elements-active-background: var(--sapShell_Active_Background); diff --git a/packages/fiori/src/themes/sap_fiori_3_dark/SearchField-parameters.css b/packages/fiori/src/themes/sap_fiori_3_dark/SearchField-parameters.css index 3810f05884c5..398218acec36 100644 --- a/packages/fiori/src/themes/sap_fiori_3_dark/SearchField-parameters.css +++ b/packages/fiori/src/themes/sap_fiori_3_dark/SearchField-parameters.css @@ -9,6 +9,8 @@ --_ui5-search-wrapper-hover-background: none; --_ui5-search-wrapper-hover-background-color: none; --_ui5_search_input_scope_margin: 0; + --_ui5-search_input_scope_hover_shadow: none; + --_ui5-search_input_scope_active_shadow: none; --_ui5-search-elements-background: var(--sapShell_InteractiveBackground); --_ui5-search-elements-hover-background: var(--sapShell_Hover_Background); --_ui5-search-elements-active-background: var(--sapShell_Active_Background); diff --git a/packages/fiori/src/themes/sap_fiori_3_hcb/SearchField-parameters.css b/packages/fiori/src/themes/sap_fiori_3_hcb/SearchField-parameters.css index 927431bda7a5..692fc8dfef4a 100644 --- a/packages/fiori/src/themes/sap_fiori_3_hcb/SearchField-parameters.css +++ b/packages/fiori/src/themes/sap_fiori_3_hcb/SearchField-parameters.css @@ -9,6 +9,8 @@ --_ui5-search-wrapper-hover-background: none; --_ui5-search-wrapper-hover-background-color: none; --_ui5_search_input_scope_margin: 0; + --_ui5-search_input_scope_hover_shadow: none; + --_ui5-search_input_scope_active_shadow: none; --_ui5-search-elements-background: var(--sapShell_InteractiveBackground); --_ui5-search-elements-hover-background: var(--sapShell_Hover_Background); --_ui5-search-elements-active-background: var(--sapShell_Active_Background); diff --git a/packages/fiori/src/themes/sap_fiori_3_hcw/SearchField-parameters.css b/packages/fiori/src/themes/sap_fiori_3_hcw/SearchField-parameters.css index e0885713758e..ac17dfaa3724 100644 --- a/packages/fiori/src/themes/sap_fiori_3_hcw/SearchField-parameters.css +++ b/packages/fiori/src/themes/sap_fiori_3_hcw/SearchField-parameters.css @@ -9,6 +9,8 @@ --_ui5-search-wrapper-hover-background: none; --_ui5-search-wrapper-hover-background-color: none; --_ui5_search_input_scope_margin: 0; + --_ui5-search_input_scope_hover_shadow: none; + --_ui5-search_input_scope_active_shadow: none; --_ui5-search-elements-background: var(--sapShell_InteractiveBackground); --_ui5-search-elements-hover-background: var(--sapShell_Hover_Background); --_ui5-search-elements-active-background: var(--sapShell_Active_Background); diff --git a/packages/fiori/src/themes/sap_horizon_hcb/SearchField-parameters.css b/packages/fiori/src/themes/sap_horizon_hcb/SearchField-parameters.css index 1c335b438dbf..10236c07edc7 100644 --- a/packages/fiori/src/themes/sap_horizon_hcb/SearchField-parameters.css +++ b/packages/fiori/src/themes/sap_horizon_hcb/SearchField-parameters.css @@ -9,6 +9,8 @@ --_ui5-search-wrapper-hover-background: none; --_ui5-search-wrapper-hover-background-color: none; --_ui5_search_input_scope_margin: 0; + --_ui5-search_input_scope_hover_shadow: none; + --_ui5-search_input_scope_active_shadow: none; --_ui5-search-elements-background: var(--sapShell_InteractiveBackground); --_ui5-search-elements-hover-background: var(--sapShell_Hover_Background); --_ui5-search-elements-active-background: var(--sapShell_Active_Background); diff --git a/packages/fiori/src/themes/sap_horizon_hcw/SearchField-parameters.css b/packages/fiori/src/themes/sap_horizon_hcw/SearchField-parameters.css index 1c335b438dbf..10236c07edc7 100644 --- a/packages/fiori/src/themes/sap_horizon_hcw/SearchField-parameters.css +++ b/packages/fiori/src/themes/sap_horizon_hcw/SearchField-parameters.css @@ -9,6 +9,8 @@ --_ui5-search-wrapper-hover-background: none; --_ui5-search-wrapper-hover-background-color: none; --_ui5_search_input_scope_margin: 0; + --_ui5-search_input_scope_hover_shadow: none; + --_ui5-search_input_scope_active_shadow: none; --_ui5-search-elements-background: var(--sapShell_InteractiveBackground); --_ui5-search-elements-hover-background: var(--sapShell_Hover_Background); --_ui5-search-elements-active-background: var(--sapShell_Active_Background);