Bottom Sheet / Image Settings Visual Refinements

[iamthomasbishop]

Per discussion with @etoledom regarding our progress on the updated "neutral" Bottom Sheets that will be housing Image Block Settings, I wanted to jot down some notes regarding recommended visual refinements. But first, some useful context:

Related Issues

• Image Setting – Link To: Link image setting #534
• Image Setting – Alt Text: Alt image setting #531

Current State

Here's a screenshot of what the current developed state looks like:

Proposed Design

Here's the proposed design – nearly identical to what @etoledom has here 👏

Proposed Refinements to Dev

• Remove the : from “Link To”. (in-progress)
• Force title case for the row titles (Link To, Alt Text, CSS Class, etc). (This is a point of difference between HIG and Material, but I’d prefer to use title case.)
• Truncate long text strings in the middle instead of at the end of the line.
• Make last row’s border-bottom full-width.
• 24pt margin between the top of sheet and start of the table. (example)

[etoledom]

Closed via WordPress/gutenberg#13855