Skip to content

Add support for dropping columns in the Table #1832

@mcoker

Description

@mcoker

patternfly/patternfly#1748

| .pf-m-hidden{-on-[breakpoint]} | .pf-c-table tr > * | Hides a table cell at a given breakpoint, or hides it at all breakpoints with .pf-m-hidden. Note: Needs to apply to all cells in the column you want to hide. |
| .pf-m-visible{-on-[breakpoint]} | .pf-c-table tr > * | Shows a table cell at a given breakpoint. |

This works with any of our global breakpoints. So you can use .pf-m-hidden, .pf-m-hidden-on-[sm, md, lg, xl] and the same for visible. You can use multiple classes on a single cell, too. For example .pf-m-hidden to hide the cell by default, then .pf-m-visible-on-sm to show it on sm, then .pf-m-hide-on-md to hide on md, and so on.

I suppose you should be able to add this to any cell in your table, as well as potentially supporting some way to say "hide the 3rd column on md breakpoint" and the react component applies the appropriate class to all the cells in that column?

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions