fix(ui5-button): use base CSS param for border-radius (#2840)

There is a standard CSS variable --sapButton_BorderCornerRadius meant to be used for the Button's border-radius. It is 0.25rem in Fiori3 and 0.375rem in HCB and HCW themes. In terms of metrics nothing changes, we use the same values, but now we allow customization via the ThemeDesigner as we apply standard CSS variable. FIXES: #2830
SAP · Feb 19, 2021 · a5aafde · a5aafde
1 parent 91d370a
commit a5aafde
Show file tree

Hide file tree

Showing 7 changed files with 1 addition and 7 deletions.
diff --git a/packages/main/src/themes/base/Button-parameters.css b/packages/main/src/themes/base/Button-parameters.css
@@ -3,7 +3,7 @@
 	--_ui5_button_base_min_compact_width: 2rem;
 	--_ui5_button_base_height: 2.5rem;
 	--_ui5_button_compact_height: 1.625rem;
-	--_ui5_button_border_radius: 0.2rem;
+	--_ui5_button_border_radius: var(--sapButton_BorderCornerRadius);
 	--_ui5_button_base_padding: 0.6875rem;
 	--_ui5_button_compact_padding: 0.4375rem;
 	--_ui5_button_base_icon_only_padding: 0.5625rem;

diff --git a/packages/main/src/themes/sap_belize_hcb/Button-parameters.css b/packages/main/src/themes/sap_belize_hcb/Button-parameters.css
@@ -1,7 +1,6 @@
 @import "../base/Button-parameters.css";
 
 :root {
-	--_ui5_button_border_radius: 0.375rem;
 	--_ui5_button_outline_offset: -0.125rem;
 	--_ui5_button_outline: 0.125rem dotted var(--sapContent_FocusColor);
 	--_ui5_button_positive_border_active_color: transparent;

diff --git a/packages/main/src/themes/sap_belize_hcw/Button-parameters.css b/packages/main/src/themes/sap_belize_hcw/Button-parameters.css
@@ -1,7 +1,6 @@
 @import "../base/Button-parameters.css";
 
 :root {
-	--_ui5_button_border_radius: 0.375rem;
 	--_ui5_button_outline_offset: -0.125rem;
 	--_ui5_button_outline: 0.125rem dotted var(--sapContent_FocusColor);
 	--_ui5_button_positive_border_active_color: transparent;

diff --git a/packages/main/src/themes/sap_fiori_3/Button-parameters.css b/packages/main/src/themes/sap_fiori_3/Button-parameters.css
@@ -3,7 +3,6 @@
 :root {
 	--_ui5_button_base_min_width: 2.25rem;
 	--_ui5_button_base_height: 2.25rem;
-	--_ui5_button_border_radius: 0.25rem;
 	--_ui5_button_base_padding: 0.5625rem;
 	--_ui5_button_base_icon_only_padding: 0.5625rem;
 	--_ui5_button_base_icon_margin: 0.375rem;

diff --git a/packages/main/src/themes/sap_fiori_3_dark/Button-parameters.css b/packages/main/src/themes/sap_fiori_3_dark/Button-parameters.css
@@ -3,7 +3,6 @@
 :root {
 	--_ui5_button_base_min_width: 2.25rem;
 	--_ui5_button_base_height: 2.25rem;
-	--_ui5_button_border_radius: 0.25rem;
 	--_ui5_button_base_padding: 0.5625rem;
 	--_ui5_button_base_icon_only_padding: 0.5625rem;
 	--_ui5_button_base_icon_margin: 0.375rem;

diff --git a/packages/main/src/themes/sap_fiori_3_hcb/Button-parameters.css b/packages/main/src/themes/sap_fiori_3_hcb/Button-parameters.css
@@ -1,7 +1,6 @@
 @import "../base/Button-parameters.css";
 
 :root {
-	--_ui5_button_border_radius: 0.375rem;
 	--_ui5_button_outline_offset: -0.25rem;
 	--_ui5_button_outline: 0.125rem dotted var(--sapContent_FocusColor);
 	--_ui5_button_positive_border_active_color: var(--sapButton_Emphasized_Active_Background);

diff --git a/packages/main/src/themes/sap_fiori_3_hcw/Button-parameters.css b/packages/main/src/themes/sap_fiori_3_hcw/Button-parameters.css
@@ -1,7 +1,6 @@
 @import "../base/Button-parameters.css";
 
 :root {
-	--_ui5_button_border_radius: 0.375rem;
 	--_ui5_button_outline_offset: -0.25rem;
 	--_ui5_button_outline: 0.125rem dotted var(--sapContent_FocusColor);
 	--_ui5_button_positive_border_active_color: var(--sapButton_Emphasized_Active_Background);