clean-and-green-philly icon indicating copy to clipboard operation
clean-and-green-philly copied to clipboard
Published 2 months ago • verified publisher icon CodeForPhilly

A11y: Apply hover styling on property cards when keyboard focus is on the card

Open bacitracin opened this issue 1 year ago • 1 comments

Describe the task

Currently there is this hover styling for a property card Screenshot 2024-04-27 at 21 45 38

When keyboard navigating to a card there is this styling. You can see a focus indicator but no background color on the full card. Screenshot 2024-04-27 at 21 45 46

Ideally it would look like this on keyboard focus: Screenshot 2024-04-27 at 21 45 54

Acceptance Criteria

  • [ ] TAB to a property card
  • [ ] Focus ring appears around the address link
  • [ ] Background color appears on the card

Additional context

  • Potentially useful: https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-within

bacitracin avatar Apr 28 '24 01:04 bacitracin

would like to be assigned please

AZBL avatar May 14 '24 23:05 AZBL

@AZBL what is the status for this?

Moylena avatar May 28 '24 20:05 Moylena

@AZBL what is the status for this?

I think @nlebovits pushed to staging

AZBL avatar May 28 '24 20:05 AZBL

Confirming this is already in staging! Just waiting for it to be merged to production.

marvieqa avatar May 31 '24 13:05 marvieqa

This is live, so closing the issue.

bacitracin avatar Jul 02 '24 20:07 bacitracin