From 1b391b6a69abf89e2ead8dfefe5e321a9e0c87c0 Mon Sep 17 00:00:00 2001 From: Henry Jameson 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 671105c8..398bc186 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 d875f0f0..ad296ec4 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')