clickable items in Gateways list

[rustyjux]

• fixes Enable clickable gateway list item panel for improved navigation #1167

I believe this is the first instance in which we have a clickable item / card sort of situation. This is a little one-off addition using Chakra inline styles but if we wanted to implement this sort of thing more widely, we could come up with a reusable component.

Or we could continue to use inline styles and handle each component individually.

---

🚀 Feature branch deployment: https://api-services-portal-feature-click-gateway-item.apps.silver.devops.gov.bc.ca

[timng-bcgov]

I have two observations on the styling of the list items.

1. I'm wondering if we're able to style the Gateway display name with an underline based on the state of the parent to better match the styling of cards in the Gateways manager:

Current:

Comparison (expected from Gateway details):

Quick mockup to illustrate:

2. Should we think about focus states for the list items? They seem to be absent on a few links throughout the Services portal. Is it possible to use a Chakra Link component (which composes <Box /> and has the desired focus state) instead of a <Flex /> with an onClick event? Might be worth discussing the composition here if we are planning on making a reusable component.