ConsenSysMesh / rimble-ui

React components that implement Rimble's Design System.
https://rimble.consensys.design/
MIT License
462 stars 67 forks source link

Table component docs overflow container #420

Open as-dr opened 5 years ago

as-dr commented 5 years ago

Describe the bug Per this issue in the rimble-storefront repo, the Table example in the docs and one in the Do's & Dont's overflows its container at smaller viewports.

It was decided that it was out of scope for the rimble-storefront repo and should be brought over to here.

To Reproduce Steps to reproduce the behavior:

  1. Go to https://rimble.consensys.design/components/rimble-ui/Table
  2. Reduce your browser window consistently to see the bug.

Expected behavior The Table should be set to overflow-x: scroll in order to scroll horizontally when in danger of overflowing its container. Padding should also be made responsive, with smaller amounts of padding on all table headings and cells at smaller viewports to avoid vertical text.

Screenshots https://user-images.githubusercontent.com/797290/68433312-72604500-0173-11ea-86d6-56106783bb36.png

https://user-images.githubusercontent.com/797290/68433365-8e63e680-0173-11ea-9ced-17895fc66275.png

Rimble UI Version

Desktop (please complete the following information):

gesquinca commented 5 years ago

Thanks for submitting @as-dr. Sounds like this is related to #406 in our backlog.