There are a few structural enhancements which would be helpful prior to other more style-related changes.
Requirements
[ ] Let's let the data source name wrap to 2 lines; almost all of them are getting truncated.
[ ] Let's eliminate the "search location" boxed static text on the right; the intent there was that the search form would basically just be recreated in that sidebar, which it is.
[ ] Where icons appear ("types of data") let's put them at the start of the line of text, rather than at the end.
[ ] It's generally preferred to use an en dash rather than a hyphen and spaces between years, replacing the word "to": "2023–2024" instead of "2023 - 2024".
Almost all interactive components use the component token except for the tag which uses small with some padding.
Components fall into 3 heights that somewhat align to font sizes, 44px, 36px and 20px. The use of 0x line-heights on some fonts help achieve a standard height and assumes that those components are rarely multi-line.
[ ] The description has an ellipsis but also extends by a line or more.
[ ] The rows should be 4px rounded and 1px borders unlike the other components that are all 2px.
[ ] The entire row should be a click area with a hover effect.
[ ] Updated the Agency row to bold because it's easy to miss that the agency changed.
[ ] Need to look at columns both for wide and mobile a bit closer.
[ ] For mobile It might be easier to change the whole font scale. There's a way to do this with rem but I need a refresher.
Context
Following https://github.com/Police-Data-Accessibility-Project/data-sources-app-v2/pull/107
There are a few structural enhancements which would be helpful prior to other more style-related changes.
Requirements