fix(ui5-textarea): adjust scroll positioning (#7920)

SAP · Dec 5, 2023 · d817d42 · d817d42
1 parent ee44512
commit d817d42
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 6 deletions.
diff --git a/packages/main/src/themes/TextArea.css b/packages/main/src/themes/TextArea.css
@@ -64,6 +64,7 @@
 	border-radius: var(--sapField_BorderCornerRadius);
 	border-width: var(--sapField_BorderWidth);
 	border-style: var(--sapField_BorderStyle);
+	padding: var(--_ui5_textarea_wrapper_padding);
 	outline: none;
 }
 
@@ -331,6 +332,7 @@
 :host([value-state="Warning"]:not([readonly]):not([disabled])) .ui5-textarea-wrapper {
 	border-style: var(--_ui5_textarea_error_warning_border_style);
 	border-width: var(--_ui5_textarea_state_border_width);
+	padding: var(--_ui5_textarea_warning_error_wrapper_padding);
 }
 
 :host([value-state="Error"]:not([readonly]):not([disabled])) .ui5-textarea-inner,
@@ -366,6 +368,7 @@
 	border-color: var(--sapField_SuccessColor);
 	border-width: var(--sapField_BorderWidth);
 	box-shadow: var(--sapField_SuccessShadow);
+	padding: var(--_ui5_textarea_success_wrapper_padding);
 }
 
 :host([value-state="Success"][focused]:not([readonly])) .ui5-textarea-wrapper {
@@ -396,6 +399,7 @@
 	background-color: var(--sapField_InformationBackground);
 	border-color: var(--sapField_InformationColor);
 	box-shadow: var(--sapField_InformationShadow);
+	padding: var(--_ui5_textarea_information_wrapper_padding);
 }
 
 :host([value-state="Information"][focused]:not([readonly])) .ui5-textarea-wrapper {
@@ -426,29 +430,23 @@
 }
 
 :host :not(.ui5-content-native-scrollbars) ::-webkit-scrollbar {
-	background: var(--sapField_BackgroundStyle);
-	background-color: var(--sapScrollBar_TrackColor);
 	border-top-right-radius: var(--sapField_BorderCornerRadius);
 	border-bottom-right-radius: var(--sapField_BorderCornerRadius);
 }
 
 :host([value-state="Error"]) :not(.ui5-content-native-scrollbars) ::-webkit-scrollbar {
-	background: var(--sapField_InvalidBackgroundStyle);
 	background-color: var(--sapScrollBar_TrackColor);
 }
 
 :host([value-state="Warning"]) :not(.ui5-content-native-scrollbars) ::-webkit-scrollbar {
-	background: var(--sapField_WarningBackgroundStyle);
 	background-color: var(--sapScrollBar_TrackColor);
 }
 
 :host([value-state="Information"]) :not(.ui5-content-native-scrollbars) ::-webkit-scrollbar {
-	background: var(--sapField_InformationBackgroundStyle);
 	background-color: var(--sapScrollBar_TrackColor);
 }
 
 :host([value-state="Success"]) :not(.ui5-content-native-scrollbars) ::-webkit-scrollbar {
-	background: var(--sapField_SuccessBackgroundStyle);
 	background-color: var(--sapScrollBar_TrackColor);
 }
 

diff --git a/packages/main/src/themes/base/TextArea-parameters.css b/packages/main/src/themes/base/TextArea-parameters.css
@@ -23,6 +23,10 @@
 	--_ui5_textarea_value_state_focus_offset: 1px;
 	--_ui5_textarea_focus_outline_color: var(--sapContent_FocusColor);
 	--_ui5_textarea_min_height: 2.25rem;
+	--_ui5_textarea_wrapper_padding: 0;
+	--_ui5_textarea_success_wrapper_padding: 0;
+	--_ui5_textarea_warning_error_wrapper_padding: 0;
+	--_ui5_textarea_information_wrapper_padding: 0;
 	--_ui5_textarea_padding_right_and_left: 0.5625rem;
 	--_ui5_textarea_padding_right_and_left_error_warning: 0.5rem;
 	--_ui5_textarea_padding_right_and_left_information: 0.5rem;

diff --git a/packages/main/src/themes/sap_horizon/TextArea-parameters.css b/packages/main/src/themes/sap_horizon/TextArea-parameters.css
@@ -16,6 +16,10 @@
 	--_ui5_textarea_readonly_focus_offset: 1px;
 	--_ui5_textarea_focus_outline_color: var(--sapField_Active_BorderColor);
 	--_ui5_textarea_value_state_focus_offset: 0;
+	--_ui5_textarea_wrapper_padding: 0.0625rem;
+	--_ui5_textarea_success_wrapper_padding: 0.0625rem;
+	--_ui5_textarea_warning_error_wrapper_padding:  0.0625rem 0.0625rem 0.125rem 0.0625rem;
+	--_ui5_textarea_information_wrapper_padding: 0.0625rem 0.0625rem 0.125rem 0.0625rem;
 	--_ui5_textarea_padding_top: 0.5rem;
 	--_ui5_textarea_padding_bottom: 0.4375rem;
 	--_ui5_textarea_padding_bottom_readonly: 0.375rem;

diff --git a/packages/main/src/themes/sap_horizon_dark/TextArea-parameters.css b/packages/main/src/themes/sap_horizon_dark/TextArea-parameters.css
@@ -16,6 +16,10 @@
 	--_ui5_textarea_readonly_focus_offset: 1px;
 	--_ui5_textarea_focus_outline_color: var(--sapField_Active_BorderColor);
 	--_ui5_textarea_value_state_focus_offset: 0;
+	--_ui5_textarea_wrapper_padding: 0.0625rem;
+	--_ui5_textarea_success_wrapper_padding: 0.0625rem;
+	--_ui5_textarea_warning_error_wrapper_padding:  0.0625rem 0.0625rem 0.125rem 0.0625rem;
+	--_ui5_textarea_information_wrapper_padding: 0.0625rem 0.0625rem 0.125rem 0.0625rem;
 	--_ui5_textarea_padding_top: 0.5rem;
 	--_ui5_textarea_padding_bottom: 0.4375rem;
 	--_ui5_textarea_padding_bottom_readonly: 0.375rem;