From 1b391b6a69abf89e2ead8dfefe5e321a9e0c87c0 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 6 Mar 2024 20:27:05 +0200
Subject: [PATCH] fix dialogs not having styles at all

---
 src/components/mobile_drawer.style.js     |  1 -
 src/services/style_setter/style_setter.js | 17 +++++++++++++++--
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/mobile_drawer.style.js b/src/components/mobile_drawer.style.js
index 671105c84d..398bc186e6 100644
--- a/src/components/mobile_drawer.style.js
+++ b/src/components/mobile_drawer.style.js
@@ -1,7 +1,6 @@
 export default {
   name: 'MobileDrawer',
   selector: '.mobile-drawer',
-  lazy: true,
   validInnerComponents: [
     'Text',
     'Link',
diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js
index d875f0f0f7..ad296ec408 100644
--- a/src/services/style_setter/style_setter.js
+++ b/src/services/style_setter/style_setter.js
@@ -26,7 +26,7 @@ export const applyTheme = async (input) => {
   const styleSheet = styleEl.sheet
 
   getCssRules(themes3.eager, themes3.staticVars).forEach(rule => {
-    // Hack to support multiple selectors on same component
+    // Hacks to support multiple selectors on same component
     if (rule.match(/::-webkit-scrollbar-button/)) {
       const parts = rule.split(/[{}]/g)
       const newRule = [
@@ -57,7 +57,20 @@ export const applyTheme = async (input) => {
     const chunk = chunks[counter]
     Promise.all(chunk.map(x => x())).then(result => {
       getCssRules(result.filter(x => x), themes3.staticVars).forEach(rule => {
-        styleSheet.insertRule(rule, 'index-max')
+        if (rule.match(/\.modal-view/)) {
+          const parts = rule.split(/[{}]/g)
+          const newRule = [
+            parts[0],
+            ', ',
+            parts[0].replace(/\.modal-view/, '#modal'),
+            ' {',
+            parts[1],
+            '}'
+          ].join('')
+          styleSheet.insertRule(newRule, 'index-max')
+        } else {
+          styleSheet.insertRule(rule, 'index-max')
+        }
       })
       // const t1 = performance.now()
       // console.debug('Chunk ' + counter + ' took ' + (t1 - t0) + 'ms')