Customizing displays with Dashboard v3

Universal Dashboard
1

Hi there,

Is there anyone having any experience around theming and customizing display of controls like UD Cards ?

I’d did found out, that the title was relying on the Typography H5 from MUI themes, but the thing is if I overwrite it like:

    typography = @{
    h5 = @{
        fontSize = 12
    }
}

it do the trick, but all UDCards will be impacted, which is not the ultimate goal.

I tried to modify the control itself using the -style parameter but almost nothing does change, except for the color maybe, but for instance:

New-UDCard -Title $item.Name -Style @{
                        top             = '2px'
                        color           = 'green'
                            'font-size' = '1rem'
                            'font-family' = "Roboto", "Helvetica", "Arial", "sans-serif"
                            'font-weight' = '200'
                            'line-height' = '1.334'
                            'letter-spacing' = '0em'
                        } -Content { $body }

except the titel’s color, nothing get “impacted” by the style settings.

I’m as well wondering how the -ClassName works, can’t find any information in any available documentation. I saw in one example provided (line 548) by @adam that it is used but no clue how it works

is there anyone around here that can help on this ? that would be very much appreciated to go ahead with my dashboards.

I have as well noticed that if you specify a main color for the dashboard using the following:

    $Theme = @{
      palette = @{
        primary = @{
            main = "#00603a"
        }
       }
    }

The dark mode switch button ain’t working anymore, any clue how or why it happen ?

I did try to configure the theme as per the following, I did check on MUI website for some insight, but I must do something wrong as it is not working :frowning:

 $Theme = @{
    palette = @{
        primary = @{
            main = "#00603a"
        }
        secondary = @{
            light = "#d7ac59"
            main = "#a37d2c"
            contrastText = "#000000"
        }
    }
}

Many thanks in advance ! Cheers !

1 Like
2

Hey @Speegel I am still behind the times I am afraid…and still using an older version…however as no-one posted here is my 2 pence worth…as for styling a particular card you need this additional module from the marketplace:- https://marketplace.universaldashboard.io/Dashboard/UniversalDashboard.Style if you search this forum there is some use examples, and on the download page there is a demo on this control for UD… :grin:

3

Hey @psDevUK !

Thx for your feedback on this, I’d like to use the MUI theme way of customizing my components though, like changin Table headers backgroup, changing font for some part of components, etc etc. it seems like Material UI allows this to be performed in a pretty easy way, though I can figure out the syntax or if it’s taken into account by the Dashboard.

The client I’m working for is really willing the theming of the dashboard to match internal policies in terms of fonts and colour scheme.

I’ll wait to see if either adam or anyone else can provide some insight about the that topic.

btw @AlonGvili is the AntD module usable with v3 or is it only working with V2 atm ?

Many thanks in advance !

4

The Antd module is working with v3 but i put it on hold, as im correctly working on the UI for PowerShell Universal