Light/Dark mode to follow browser/OS?

PowerShell Universal
1 
Product: PowerShell Universal
Version: 4.x

Is there a clever way to let light/dark mode of the dashboard follow browser or Windows? The dashboard does not retain the setting but always defaults to light, so I’ve added:

Set-UDTheme -Name ‘Dark+’ -Variant ‘Dark’

Which works fine, except now I have some users that actually want light mode.

So either the detection or a way to preserve the users’ selection is needed.

2

i would recommend taking a look at Invoke-UDJavascript, specifically for the window.matchMedia method. you can invoke a callback at that point written in powershell

3

Yeah, I’ve got the window.matchMedia down and it shows the correct value, but getting that value back to PowerShell to set the theme is apparently beyond me…

4

Would it perchance work to put the Code in an New-UDDynamic, that loads on page load, and executes Set-UDTheme -Name ‘Dark+’ -Variant ‘Dark’ based on the values from window.matchMedia?

Can you share the code for getting the values? I’d like to make use of it as well :smiley:

5

Possibly, except I’m missing how to transfer the value from JS to PS…

The code is:

function detectDarkMode() {
    return window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches;
}
return detectDarkMode();
6

This is working for me, can possible be optimized a bit, as the switch happens a few seconds into loading the page.

$Javascript = @"
function detectDarkMode() {
   return window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches;
   }
detectDarkMode()
"@
New-UDDynamic {
   IF (Invoke-UDJavaScript -JavaScript $Javascript) {
      Set-UDTheme -Name 'Dark+' -Variant 'Dark'
   }
}
7

Works like a charm here as well, thanks! Confused myself with the “return” command… :slight_smile: