####Background
There are a series of visual fixes that would improve the appearance of Codex Table's headings. This task collects design issues and, if known, the potential solutions we could apply to address these.
####Issues
| **Fix** | **Description** | **Screenshots/Specs** |
| 1. Headings should be aligned at the bottom (instead of at the center). This is to avoid creating unnecessary white space and visually support their connection with their respective columns, even if their text wraps. | To achieve this, we could apply `vertical-align: bottom` to `<th>`s, in combination with `align-items: flex-end` to buttons. Unfortunately, we'll need to take special measures to ensure that the text and the icons within the bottom-aligned heading cells remain centered before the text wraps (e.g., applying a bottom padding of 2px to sort icons does the trick, but this doesn't sound ideal). | {F54973366} |
| 2. Make sure that heading icons don't shrink when they lack space | At the moment, icons become smaller when space within the heading is compromised (e.g., in case the heading text uses a bigger font size). Looks like adding `flex-shrink: 0` to the icons would fix this issue. | {F54973530} |
| 3. Make sure that heading buttons take all the available height of `<th>`s when content wraps| We attempted to fix this in the past (see T364932). The problem is very visually prominent, specially in tables without headers (see screenshot). If this is not feasible technically, we could evaluate other design approaches (different ways to represent states) that could help minimize the issue | {F54973876} |
####Acceptance criteria
[] We define and apply fixes to improve the design of Table headings