Description
Spurred by a customer request. This should be a quick CSS fix; hoping to get this closed out by end of day tomorrow.
Problem
On the /workspaces and /templates routes, several UI elements that deal with templates are not able to handle long text that don't have natural semantic line breakpoints (such as URLs that don't use hyphens to separate words). Long text like this is neither truncated nor forced to have per-character line breaks. In some cases, this makes elements entirely unreadable.
/workspaces page
This was the main customer request. When there are no workspaces available, the UI will show an empty state with templates that can be used. The cards in this empty state cannot handle long text values for either the title or the description.
/templates page
Most template titles cause the user count to overflow in an awkward way, with too much text leading relative to the text size. Text doesn't need to be especially long to trigger this edge case.
Just because these boxes are so thin, I think the user count should be moved down, inline with the "default" text. That would also give the titles a lot more room.
Similar to the workspaces issue, if a long enough text value with no natural line breaks is put in a template description, it overflows past the container. In this case, this doesn't obscure any nearby elements, but it does make the affected template a lot harder to read.
The titles themselves also don't handle long text like this well
Steps to reproduce
- Create a template with a long title and/or description (something like 100+ characters).
- Navigate to the
/workspacespage while there are no workspaces associated with the account - Afterwards, navigate to the
/templatespage
Other notes
Not strictly something that affects functionality, but we have a lot of unused space in the main Templates page. Going to see what I can do to update this without changing the aspect ratios on the cards too much
