From 957c1fa7fced986c821bd7ab9a9ec639a3bc8457 Mon Sep 17 00:00:00 2001
From: shadash <sophiahadash@gmail.com>
Date: Fri, 15 Oct 2021 22:54:04 +0200
Subject: [PATCH 1/2] render extras with z-index higher than the carousel above
 the carousel

Signed-off-by: Sophia Hadash <sophiahadash@gmail.com>
---
 es-app/src/views/SystemView.cpp | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/es-app/src/views/SystemView.cpp b/es-app/src/views/SystemView.cpp
index 8159bacbd..c186960dd 100644
--- a/es-app/src/views/SystemView.cpp
+++ b/es-app/src/views/SystemView.cpp
@@ -402,7 +402,8 @@ void SystemView::render(const glm::mat4& parentTrans)
 
     glm::mat4 trans{getTransform() * parentTrans};
 
-    renderExtras(trans, INT16_MIN, INT16_MAX);
+    // Render the extras that are below the carousel.
+    renderExtras(trans, INT16_MIN, mCarousel.zIndex);
 
     // Fade the screen if we're using fade transitions and we're currently transitioning.
     // This basically renders a black rectangle on top of the currently visible extras
@@ -412,6 +413,9 @@ void SystemView::render(const glm::mat4& parentTrans)
 
     // Always render the carousel on top so that it's not faded.
     renderCarousel(trans);
+
+    // Render the rest of the extras.
+    renderExtras(trans, mCarousel.zIndex, INT16_MAX);
 }
 
 std::vector<HelpPrompt> SystemView::getHelpPrompts()

From 3070a66e2c43970fd92c336d4511be8100074920 Mon Sep 17 00:00:00 2001
From: shadash <sophiahadash@gmail.com>
Date: Sat, 23 Oct 2021 17:34:20 +0200
Subject: [PATCH 2/2] introduce 'legacyZIndexMode' tag in carousel

Signed-off-by: Sophia Hadash <sophiahadash@gmail.com>
---
 es-app/src/views/SystemView.cpp | 44 ++++++++++++++++++++++++---------
 es-app/src/views/SystemView.h   |  1 +
 es-core/src/ThemeData.cpp       |  3 ++-
 3 files changed, 36 insertions(+), 12 deletions(-)

diff --git a/es-app/src/views/SystemView.cpp b/es-app/src/views/SystemView.cpp
index c186960dd..f60a9a552 100644
--- a/es-app/src/views/SystemView.cpp
+++ b/es-app/src/views/SystemView.cpp
@@ -402,20 +402,35 @@ void SystemView::render(const glm::mat4& parentTrans)
 
     glm::mat4 trans{getTransform() * parentTrans};
 
-    // Render the extras that are below the carousel.
-    renderExtras(trans, INT16_MIN, mCarousel.zIndex);
+    if (mCarousel.legacyZIndexMode) {
+        // Render all extras.
+        renderExtras(trans, INT16_MIN, INT16_MAX);
 
-    // Fade the screen if we're using fade transitions and we're currently transitioning.
-    // This basically renders a black rectangle on top of the currently visible extras
-    // (and beneath the carousel and help prompts).
-    if (mExtrasFadeOpacity)
-        renderFade(trans);
+        // Fade the screen if we're using fade transitions and we're currently transitioning.
+        // This basically renders a black rectangle on top of the currently visible extras
+        // (and beneath the carousel and help prompts).
+        if (mExtrasFadeOpacity)
+            renderFade(trans);
 
-    // Always render the carousel on top so that it's not faded.
-    renderCarousel(trans);
+        // Always render the carousel on top so that it's not faded.
+        renderCarousel(trans);
+    }
+    else {
+        // Render the extras that are below the carousel.
+        renderExtras(trans, INT16_MIN, mCarousel.zIndex);
 
-    // Render the rest of the extras.
-    renderExtras(trans, mCarousel.zIndex, INT16_MAX);
+        // Fade the screen if we're using fade transitions and we're currently transitioning.
+        // This basically renders a black rectangle on top of the currently visible extras
+        // (and beneath the carousel and help prompts).
+        if (mExtrasFadeOpacity)
+            renderFade(trans);
+
+        // Render the carousel.
+        renderCarousel(trans);
+
+        // Render the rest of the extras.
+        renderExtras(trans, mCarousel.zIndex, INT16_MAX);
+    }
 }
 
 std::vector<HelpPrompt> SystemView::getHelpPrompts()
@@ -734,4 +749,11 @@ void SystemView::getCarouselFromTheme(const ThemeData::ThemeElement* elem)
         else
             mCarousel.logoAlignment = ALIGN_CENTER;
     }
+    if (elem->has("legacyZIndexMode")) {
+        mCarousel.legacyZIndexMode =
+            elem->get<std::string>("legacyZIndexMode").compare("true") == 0 ? true : false;
+    }
+    else {
+        mCarousel.legacyZIndexMode = true;
+    }
 }
\ No newline at end of file
diff --git a/es-app/src/views/SystemView.h b/es-app/src/views/SystemView.h
index 6e590c971..5e0178a57 100644
--- a/es-app/src/views/SystemView.h
+++ b/es-app/src/views/SystemView.h
@@ -47,6 +47,7 @@ struct SystemViewCarousel {
     int maxLogoCount; // Number of logos shown on the carousel.
     glm::vec2 logoSize;
     float zIndex;
+    bool legacyZIndexMode;
 };
 
 class SystemView : public IList<SystemViewData, SystemData*>
diff --git a/es-core/src/ThemeData.cpp b/es-core/src/ThemeData.cpp
index 603a0131b..8c22d1968 100644
--- a/es-core/src/ThemeData.cpp
+++ b/es-core/src/ThemeData.cpp
@@ -210,7 +210,8 @@ std::map<std::string, std::map<std::string, ThemeData::ElementPropertyType>> The
       {"logoSize", NORMALIZED_PAIR},
       {"logoAlignment", STRING},
       {"maxLogoCount", FLOAT},
-      {"zIndex", FLOAT}}}};
+      {"zIndex", FLOAT},
+      {"legacyZIndexMode", STRING}}}};
 
 #define MINIMUM_THEME_FORMAT_VERSION 3
 #define CURRENT_THEME_FORMAT_VERSION 7