fix(ui5-dialog): include the opacity in the background color (#8181)

fix(ui5-dialog): include the opacity in the background color
SAP · Jan 25, 2024 · 3666e56 · 3666e56
1 parent 26c9fde
commit 3666e56
Show file tree

Hide file tree

Showing 13 changed files with 15 additions and 2 deletions.
diff --git a/packages/main/src/themes/PopupStaticAreaStyles.css b/packages/main/src/themes/PopupStaticAreaStyles.css
@@ -1,8 +1,7 @@
 .ui5-block-layer {
 	display: none;
 	position: fixed;
-	background-color: var(--sapBlockLayer_Background);
-	opacity: 0.6;
+	background-color: var(--_ui5_popup_block_layer_background);
 	top: -500px;
 	left: -500px;
 	right: -500px;

diff --git a/packages/main/src/themes/base/PopupStaticAreaStyles-parameters.css b/packages/main/src/themes/base/PopupStaticAreaStyles-parameters.css
@@ -0,0 +1,3 @@
+:root {
+	--_ui5_popup_block_layer_background: color-mix(in oklch, transparent, var(--sapBlockLayer_Background) 60%);
+}
diff --git a/packages/main/src/themes/sap_belize/parameters-bundle.css b/packages/main/src/themes/sap_belize/parameters-bundle.css
@@ -26,6 +26,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "./ProgressIndicator-parameters.css";
 @import "../base/RadioButton-parameters.css";
 @import "../base/RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_belize_hcb/parameters-bundle.css b/packages/main/src/themes/sap_belize_hcb/parameters-bundle.css
@@ -26,6 +26,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "./ProgressIndicator-parameters.css";
 @import "./RadioButton-parameters.css";
 @import "../base/RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_belize_hcw/parameters-bundle.css b/packages/main/src/themes/sap_belize_hcw/parameters-bundle.css
@@ -26,6 +26,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "./ProgressIndicator-parameters.css";
 @import "./RadioButton-parameters.css";
 @import "../base/RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_fiori_3/parameters-bundle.css b/packages/main/src/themes/sap_fiori_3/parameters-bundle.css
@@ -25,6 +25,7 @@
 @import "../base/Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "../base/PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "../base/ProgressIndicator-parameters.css";
 @import "../base/RadioButton-parameters.css";
 @import "../base/RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_fiori_3_dark/parameters-bundle.css b/packages/main/src/themes/sap_fiori_3_dark/parameters-bundle.css
@@ -25,6 +25,7 @@
 @import "../base/Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "../base/PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "../base/ProgressIndicator-parameters.css";
 @import "../base/RadioButton-parameters.css";
 @import "../base/RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_fiori_3_hcb/parameters-bundle.css b/packages/main/src/themes/sap_fiori_3_hcb/parameters-bundle.css
@@ -27,6 +27,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "./ProgressIndicator-parameters.css";
 @import "./RadioButton-parameters.css";
 @import "../base/RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_fiori_3_hcw/parameters-bundle.css b/packages/main/src/themes/sap_fiori_3_hcw/parameters-bundle.css
@@ -27,6 +27,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "./ProgressIndicator-parameters.css";
 @import "./RadioButton-parameters.css";
 @import "../base/RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_horizon/parameters-bundle.css b/packages/main/src/themes/sap_horizon/parameters-bundle.css
@@ -29,6 +29,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "./ProgressIndicator-parameters.css";
 @import "../base/RadioButton-parameters.css";
 @import "./RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_horizon_dark/parameters-bundle.css b/packages/main/src/themes/sap_horizon_dark/parameters-bundle.css
@@ -29,6 +29,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "../sap_horizon/ProgressIndicator-parameters.css";
 @import "../base/RadioButton-parameters.css";
 @import "./RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_horizon_hcb/parameters-bundle.css b/packages/main/src/themes/sap_horizon_hcb/parameters-bundle.css
@@ -27,6 +27,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "./ProgressIndicator-parameters";
 @import "./RadioButton-parameters.css";
 @import "./RatingIndicator-parameters.css";

diff --git a/packages/main/src/themes/sap_horizon_hcw/parameters-bundle.css b/packages/main/src/themes/sap_horizon_hcw/parameters-bundle.css
@@ -27,6 +27,7 @@
 @import "./Panel-parameters.css";
 @import "../base/Popover-parameters.css";
 @import "./PopupsCommon-parameters.css";
+@import "../base/PopupStaticAreaStyles-parameters.css";
 @import "../sap_horizon_hcb/ProgressIndicator-parameters";
 @import "./RadioButton-parameters.css";
 @import "./RatingIndicator-parameters.css";