[dagit] Simplify Table styles
Simplify tables in Dagit:
- Make all tables width: 100% to remove that from callsites
- Remove striped usage in favor of tr-level gray keyline boxshadow
- Set first-child and last-child table cells to be flush against the horizontal sides
- Add a $compact transient prop to render small tables with minimal padding
- Add a storybook example
The striped version was a step in the right direction to get us to a true table without having lots of internal borders -- as is the default in Blueprint Table -- but the stripes are still a bit cluttered.
By extending the first-child and last-child table cells to the edges, we get better alignment with headers and other page content. To that end, I added a bit more padding to Page to restore some breathing room whitespace around table edges.
View Storybook example, verify rendering as described above.
Load Dagit, navigate to all affected tables, verify rendering as described above.
Reviewers: bengotow, prha
Reviewed By: bengotow
Differential Revision: https://dagster.phacility.com/D6117