Scrollable Tabs in 2.11.1?

PowerShell Universal Universal Dashboard
1

Hi folks,

I’ve been trying to get a multi-tab view for a dashboard page to display more results but I seem to be limited to 10 for the time being as the tabs don’t seem to want to display the scroll bar.

I currently have it written as New-UDTabs -Variant 'Scrollable' -ScrollButtons 'Auto' -Tabs { [...] } but even when I load more tabs, it doesn’t display as I would expect. Likewise when I set the ScrollButtons parameter to On. When I load more than 10 tabs, the content just spills over and looks weird.

hat-ws-lookup-scroll-tabs
hat-ws-lookup-scroll-tabs1920×937 46.4 KB

Is this the expected behaviour for scrollable tabs or have I missed something?

Cheers,

Adam

Product: PowerShell Universal
Version: 2.11.1
2

You’ll need to restrict the size of the parent so the tabs can’t grow forever. For example, you can use a container.

  New-UDContainer {
        New-UDTabs -Variant 'scrollable' -ScrollButtons 'auto' -Tabs {
            1..20 | % { 
                New-UDTab -Text 'Item One' -Content { New-UDTypography -Text 'Item One' -Variant 'h2' }
            }
        }
    }

Then the scrollable works for me.

image
image1298×183 5.49 KB

I do notice that the Variant parameter is currently case sensitive so I’ll open an issue for that.

1 Like
3

Ah! Yes, once I wrapped in a container it stopped the spill-over issue, and then changing the Variant and Scrollbuttons parameters to lowercase made the scroll buttons appear as intended.

Thanks!

1 Like