hathitrust / firebird-common

Other
0 stars 0 forks source link

fix form field focus styles #100

Closed carylwyatt closed 3 months ago

carylwyatt commented 3 months ago

This is only an issue for elements with a bg-secondary or bg-dark utility class. Our focus blue doesn't have enough contrast against the dark gray or black, so Gayathri and I decided to flip the blue and white of the universal focus style, but only for these components.

Previous:

image

With this update:

image

Black toolbar element in page turner:

image

With this fix:

image

And removes this bootstrap bleed through focus style with an orange outline (all form elements, not just dropdown/selects):

image

Updated:

image

@giramesh, does this look good to you on dev-3?

netlify[bot] commented 3 months ago

Deploy Preview for hathitrust-firebird-common ready!

Name Link
Latest commit 96480a673063a5056e29e2ffb205d9edf7f4d8bc
Latest deploy log https://app.netlify.com/sites/hathitrust-firebird-common/deploys/66b3b8a9603be70008447a5f
Deploy Preview https://deploy-preview-100--hathitrust-firebird-common.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

carylwyatt commented 3 months ago

Requesting @giramesh to review again with new changes. This branch of firebird is staged on dev-3 and has been applied to page turner on dev-3. Thanks!