New-UDTransferList limited to 200px width!?

Universal Dashboard
1

I am trying to use the New-UDTransferList in my dashboard but it doesn’t use the whole desktop-width it is limited by the css “.jss12” . Is this an error?

Universaldesktop 3.1.6 with the sample code from the docu:

New-UDDashboard -Title 'PowerShell Universal' -Content {
    New-UDTransferList -Item {
        New-UDTransferListItem -Name 'test1 with a very long text' -Value 1
        New-UDTransferListItem -Name 'test2 not as long' -Value 2
        New-UDTransferListItem -Name 'test3' -Value 3
        New-UDTransferListItem -Name 'test4' -Value 4
        New-UDTransferListItem -Name 'test5' -Value 5
    } -id "tl" -SelectedItem @('4', '1')
}
2

It does look like is hard coded into the control. I’ve opened a feature request to add some formatting features to the transfer list.

2 Likes
3

Hey @lubeda In the interim remember there is New-UDStyle which should allow you to override the setting and customise it to your needs. I recently used New-UDStyle to overcome an display issue I had with a custom component

1 Like
4

I know only a few things about css but the relevant style/class has a random number in it, so I also don’t know how to overwrite it.

5

Honestly I believe New-UDStyle will still solve this issue as it will apply the styling directly to the component regardless of the ID, I am using it for a custom component here:-

    New-UDStyle -Style '
    top: 0;
      position: fixed;
      left: 0;
      opacity: 75%
    ' -Content {
        New-UDScrollProgress -BackgroundColor "transparent" -Height "6px"
    }

If you are still stuck, I am happy to give an example using your component but hopefully this shows you how to use this :slight_smile:

6

Well i am getting a step further but it still doesn’t work.

Here is my sample code: New-UDStyle -style '.MuiList-root { width : 300; background : #ff3344; }' -Content { New-UDTransferList -Item { "Ludger", "Ulf", "Tanja", "Martha", "Bettina" | ForEach-Object { New-UDTransferListItem -Name $_ -Value $_ } } }

The css-selector seems to work because the selected path is red but the width doesn’t work, because it is still 200px wide.

tansferlist
tansferlist2518×998 251 KB

7

Wrong css-selector! With .MuiPaper-root it is working!

1 Like