Color Theme Switcher

Universal Dashboard Universal Dashboard Show Off
1

I’m playing around with the idea of a theme switcher in UD, like switching from light to dark, and here is what I have so far:

$Theme_Azure = Get-UDTheme -Name Azure
$Theme_Blue = Get-UDTheme -Name Blue

$Board = New-UDDashboard -Theme $Theme_Azure -Title "Test Themes" -Content {

$Session:BGColor = $Theme_Azure.Definition.UDCard.BackgroundColor
$Session:Color = $Theme_Azure.Definition.UDCard.FontColor

New-UDLayout -Columns 2 -Content {
    1..5 | % {
        new-udcard -BackgroundColor $Session:BGColor -FontColor $Session:Color -Id "card$_" -Title "Card #$_"
    }

    New-UDSwitch -Id themeSwitcher -OnText "Blue" -OffText "Azure" -OnChange {
        switch ($EventData)
        {
            $true
            {
                $Session:BGColor = $Theme_Blue.Definition.UDCard.BackgroundColor
                $Session:Color = $Theme_Blue.Definition.UDCard.FontColor
            }
            $false
            {
                $Session:BGColor = $Theme_Azure.Definition.UDCard.BackgroundColor
                $Session:Color = $Theme_Azure.Definition.UDCard.FontColor
            }
        }

        1..5 | % {
            $Id = "card$_"
            $Attributes = Get-UDElement -Id $Id | select -exp Attributes
            $Attributes.style.backgroundColor = $Session:BGColor
            $Attributes.style.color = $Session:Color
            Set-UDElement -Id $Id -Attributes $Attributes
            Sync-UDElement -Id $Id
        }
    }
}
}

Start-UDDashboard -Dashboard $Board

Switcher
Switcher.gif1905×638 64.4 KB

It’s a little unwieldy, but with the right design it might be kinda cool. Let me know what you think.

5 Likes
2

Its cool !!, in ud 3.0 we going to have this option using material ui theme context

1 Like
3

image

4
1 Like
5

Yeah, I think the theme structure is fine, but I have a couple of thoughts.

First, please make sure to include a couple of themes out of the box. That would make it simple for us to review and ensure we know how to create them. And of course a document on all the possible keys will be nice.

Also, will it be possible to override themes on particular components? Or to compose partial themes?

6

Ammm… your asking very good questions that i need to think about them with Adam.

The partial themes sound interesting, will take a look in this.

1 Like
7

+1 on ability to override theme settings. It is often desirable to be able to make one thing on one chart stand out as important or exceptional.

Thanks,
Tim Curwick

1 Like