- Buttons on dialogs were not getting width and height
- Tooltip buttons were getting standard button spacing when they
should be closer to their corresponding menu button
- Several buttons and other elements had containers just to get
spacing in button sets; rename button-container class to
button-set-item and apply directly to elements where possible.
After moving the padding to the content of buttons, we ended up with
extra padding around text buttons that wasn't there before. The
"Download" bar doesn't look great with no padding at all, but it needs
to match the text buttons so the text doesn't jump to the right when
it switches from "Download" (text button) to "Connecting" (progress bar).
So we pad both text buttons and progress bars just a little bit, less
than a standard button but enough that progress bars look OK.
- Don't fade out tile
- Display message in place of buttons with an option to bypass the
message
- Factor out message into its own FileUnavailableMessage component
- Use a single "state" prop to track download progress (not-started,
downloading, or done)
- Accept a file path as a prop an "Open" link after the download is
complete
- Trim some outdated code; improve CSS class names
This displays the file path on its own line and does character-level
wrapping on the path only.
Ideally, we would just apply character wrapping to all words that are
too long for their line. There are CSS props for that but I haven't
been able to find a reliable way to do it without setting a width on the
outer container, which we don't want here (modals stretch based on their content). So this is the best compromise I can come up with.
- Change warning icon to PNG with different color scheme
- Use alt style button
- Darken backdrop
- Add spacing under header
- Reduce margins on all modals