New-UDCard Styles Local Font

PowerShell Universal
1

Hello all,

I am after some help with styles for New-UDCardBody, I can code in PowerShell but CSS is a dark art and I am struggling with styles. I am trying to use a local font called Digital-7 and within the styles option I am using the @font-face group as stated for CSS but when I use it within the dashboard the code is ignored and the default font is used, Any idea of an example of how I would use my local stored font within the New-UDCard, thanks for any help in advance

JK

Product: PowerShell Universal
Version: 4.0.5 (5469260942)
2

Hey all

I was looking to do exactly the same thing here.
Wanted to create a dashboard by following our corporate identity and therefore our custom font.

Unfortunately didn’t find anything related to how to achieve this except this unanswered thread. :frowning:

So I played a little bit with it by documenting myself online. I found this webpage that describes the various possibilities:

Then, searching for “CSS” in the forum, I understood that the way to modify the PSU CSS “on the fly” is by using New-UDHelmet.
So here’s is a working example of how you could modify the UDCard Header Title to reflect your custom font.

…just in case somebody will also sumble over this thread… :wink:

New-UDHelmet -Tag "style" -Content "
                @font-face {
                    font-family: 'My Personal Font';
                    src: url('/assets/fonts/My Personal Font.otf');
                "
            New-UDStyle -Sx @{
                '.MuiCardHeader-title' = @{
                    "font-family" = "My Personal Font,Roboto,Segoe UI,Helvetica,Arial,sans-serif"
                    "font-size"   = "2.5rem"
                }
    } -Content {
     New-UDCard -Header $Header -Body $Body
    }

Take care,
Don

1 Like