From 324a0958ae436e75cb1b252263dfafbd1447097f Mon Sep 17 00:00:00 2001
From: Viktor Varland <viktor@dhis2.org>
Date: Wed, 1 Sep 2021 14:06:37 +0200
Subject: [PATCH] fix(shell): create new stacking context for roots

This adds two rules for the application root and portal root divs that
creates a new stacking context for each, this allows an app the freedom
to do pretty much whatever it wants with z-indexes, without affecting UI
components that render in a Portal.

It also allows other 3rd party libraries that rely on appending elements
to the DOM and modifying z-indexes to work better with our platform.

The isolation property has good support and should align nicely with our
supported browsers[1].

[1] https://caniuse.com/mdn-css_properties_isolation
---
 shell/src/index.css | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/shell/src/index.css b/shell/src/index.css
index 4a1df4db7..2c23bd9e1 100644
--- a/shell/src/index.css
+++ b/shell/src/index.css
@@ -11,3 +11,13 @@ code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;
 }
+
+#dhis2-app-root {
+    /* establish a stacking context for the application */
+    isolation: isolate;
+}
+
+#dhis2-portal-root {
+    /* establish a stacking context for portals */
+    isolation: isolate;
+}