New Table Element

Can someone post a link to the new table element in weweb documentation? The documentation is terrible. The left Nav “Elements” section doesn’t include Table. Seach function on documentation site doesn’t yield results. @Joyce ? Have you made a video on the new table element?

BTW, it appears that we no longer get an option of whether or not to use sample data or not???

Are you talking about table or data grid? There’s quite a difference in two. Table is used for hard-coded data or more advanced data display. Data grid is used to quickly setup a table from a collection

Thanks Luka. I was referring to the newly updated table element. My understanding was that revamped element gets rid of the columns section and uses flexbox of type Grid instead.

Hey @luka I added the new table element to a page and was able to bind to a collection. Only thing is, it is not responsive on mobile size. The column width default is 1fr. I expect that when viewed on mobile, those columns will shrink so that the table takes up the full width of the mobile width. Currently only 1 column is visible on mobile, and columns are not shrinking. Perhaps I don’t understand what fr means or how that responds at different sizes. I made a short Loom video to illustrate my issue. Can you see if I’ve done something wrong? Troubleshooting Collection List Layout Issue | Loom

Looks like you have a different mobile width setting on your ‘Collection List’.

LOL. It was a typo. I have the mobile width set to 1200 :wink:

1fr is one part of whole, for example if you have two 1fr’s, they both take 50% of available space.

If you want your table to fit on mobile, you can keep the fr’s, but update the table size. If you want to have a specific width for columns, you can change to pixels instead of frs.

Check this out for more on grid sizing.

thanks Luka

btw. 1 fr is simply 1 fraction