Rows in Specs List should be clickable all the way across

[sync-by-unito]

Current Behavior

Only parts of the the rows in the specs list are clickable:

whole-row.click.events.on.main.specs.list.mp4

Expected Behavior

Clicking on the whole row should produce the same result as clicking on a folder name or a spec name.

This row has changed, it now contains interactive content and needs a distinct hover state: see this slack thread for context.

For the hover state, this figma prototype shows the icon on the left being highlighted with color, and the spec title text darkening by a few shades when any part of the row is hovered.

Since some parts of the row are now clickable, only clicking on non-interactive parts should trigger the navigation.

┆Issue is synchronized with this Jira Bug by Unito
┆Attachments: Screen Shot 2022-05-20 at 9.46.17 AM.png
┆author: Mark Noonan
┆epic: UI/UX Improvements
┆friendlyId: UNIFY-1434
┆priority: Medium
┆sprint: Fast Follows 1
┆taskType: Bug

[sync-by-unito]

➤ Jennifer Shehane commented:

This has been mentioned a lot by people.

https://cypressio.slack.com/archives/C02MYBT9Y5S/p1652978606893369 ( https://cypressio.slack.com/archives/C02MYBT9Y5S/p1652978606893369|smart-card )

[sync-by-unito]

➤ Brian Mann commented:

Does this need design?

[sync-by-unito]

➤ Mark Noonan commented:

Brian Mann it only needs design if this figma design hover state is not accurate - otherwise I was just going to go with that. Highlight the icon and darken the spec name. For consistency we should do that with the folders row as well. This would match the hover states in the Inline Specs List, which makes sense to me.

What I see now in the 10.0 Specs List is a partial implementation of the App-Cloud integration design: the Last Updated column from that prototype has replaced the Git Status column, but the Latest Runs and Average Duration columns are not there yet. In the slack thread I link in the ticket, Ryan is fine with that update as part of 10.0 release. But yeah probably worth confirming that what I’ve outlined above is acceptable for the hover state.