Set an Ink theme and prepare for defining and overriding styles.

 






 

 


  Review Request #13687
  —
  Created April 1, 2024 and submitted  — Latest diff uploaded 

 


















 

  

   Information

  





 
 

  chipx86
 









 
 

  Review Board
 









 
 

  release-7.x
 









 
 

  
 









 
 

  
 






 




 

  

   Reviewers

  





 
 

  reviewboard
 









 
 

  
 






 








 





  


 
 

  
We now set the data-theme= on the page, using light by default. This

can be overridden using settings.DEFAULT_INK_THEME. Later, we'll

default this to "system" or to a user-specified default.


By setting the theme, we now have access to light and dark mode

variations of Ink design tokens and conditional values. We're also in a

position to begin overriding them.


We provide a couple of overrides. First, we override the default font to

use our long-standing font family (which we're not going to be changing

for this release). Second, we use a smaller font size, which is

equivalent to 11px instead of the 13px Ink currently uses by default.

These both match the existing UI, which the rest of our CSS expects.


The page class is now set on <html>, which is necessary for performing

some overrides. For compatibility, we also set it on <body> as before.

 








  


 
 

  
Tested that the UI looked and acted as it did before across all pages,

but that changing DEFAULT_INK_THEME in settings_local.py let me

opt in to dark mode or system-theme mode.


Made use of this along with several in-progress Ink changes, which make

use of this foundation.

 







 









 





  








 




 







   

    
    

    

    


    

      
Commits

      

        
      

    


    


      
Files