Re: [PR] fix(loading): improve loading screen theming for dark mode support [superset]

Mon, 15 Sep 2025 13:44:09 -0700 


korbit-ai[bot] commented on code in PR #35129:
URL: https://github.com/apache/superset/pull/35129#discussion_r2350090406


##########
superset/templates/superset/spa.html:
##########
@@ -30,6 +30,20 @@
 
     {% block head_meta %}{% endblock %}
 
+    <style>
+      body {
+        background: #fff;
+        color: #000;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        body {
+          background: #000;
+          color: #fff;
+        }
+      }
+    </style>

Review Comment:
   ### Redundant CSS causing style conflicts <sub>![category 
Performance](https://img.shields.io/badge/Performance-4f46e5)</sub>
   
   <details>
     <summary>Tell me more</summary>
   
   ###### What is the issue?
   Inline CSS in the head creates redundant style application that conflicts 
with existing theme-based styling on the body element.
   
   
   ###### Why this matters
   The body element already has inline styling with theme tokens 
(`background-color: {{ tokens.get('colorBgBase', '#ffffff') }}`), causing the 
browser to process and apply multiple conflicting background styles, leading to 
unnecessary style recalculation and potential visual flashing during theme 
transitions.
   
   ###### Suggested change ∙ *Feature Preview*
   Remove the inline `<style>` block and integrate dark mode support directly 
into the existing body inline style using CSS custom properties or conditional 
template logic to avoid duplicate style processing:
   
   ```html
   <body style="margin: 0; padding: 0; background-color: {{ 
tokens.get('colorBgBase', '#ffffff') }}; color: {{ tokens.get('colorTextBase', 
'#000000') }};">
   ```
   
   
   ###### Provide feedback to improve future suggestions
   [![Nice 
Catch](https://img.shields.io/badge/👍%20Nice%20Catch-71BC78)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/86fc3469-d813-4df0-b366-38dad6d5f752/upvote)
 
[![Incorrect](https://img.shields.io/badge/👎%20Incorrect-white)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/86fc3469-d813-4df0-b366-38dad6d5f752?what_not_true=true)
  [![Not in 
Scope](https://img.shields.io/badge/👎%20Out%20of%20PR%20scope-white)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/86fc3469-d813-4df0-b366-38dad6d5f752?what_out_of_scope=true)
 [![Not in coding 
standard](https://img.shields.io/badge/👎%20Not%20in%20our%20standards-white)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/86fc3469-d813-4df0-b366-38dad6d5f752?what_not_in_standard=true)
 
[![Other](https://img.shields.io/badge/👎%20Other-white)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/86fc3469-d813-4df0-b366-38dad6d5f752)
   </details>
   
   <sub>
   
   💬 Looking for more details? Reply to this comment to chat with Korbit.
   </sub>
   
   <!--- korbi internal id:3d55e053-10de-46aa-aefa-e1211c5e7d78 -->
   
   
   [](3d55e053-10de-46aa-aefa-e1211c5e7d78)



-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to