UUI
UUI copied to clipboard
[DataTable]: condensed view
To Do
- Add
headerSize: '36' | '48'prop. Default '36' - Make gap beetween column header elements(caption, sorting, filter, dropdown icons) equal 3px
- In
headerSize='48'we can have 2 line header, when text wrapping - Add
columnsGap: '12' | '24'prop, default '24'. The prop will configure space between columns. Add mention that '12' value, will not work with editable tables. - Add condensed table example with DataTable headerSize='36', columnsGap: '12' and size='30'(row size), border={ false }, like in design below.
Design - https://www.figma.com/design/cAd3iaIW4JxJapIVTrE96b/UUI-%E2%80%93-Tables-%26-Filters-(Demo-%26-Examples)?node-id=6287%3A153224&t=J2FqD1hkM5SVJfJr-1
Condensed table view: Truncate text postpone, leave with text breaks on the second line
Action Point. Create tooltips on hover when text is truncated? Only for truncated cells? Design to do: Learn best practices, ask designers
Released in 5.8.0 ver.