UX Design: Improve contrast in form fields in Django Admin

cisagov / manage.get.gov

A Django-based domain name registrar used by the .gov domain to communicate with an EPP registry

https://get.gov

Other

59 stars 18 forks source link

UX Design: Improve contrast in form fields in Django Admin #1522

Open PaulKuykendall opened 9 months ago

PaulKuykendall commented 9 months ago

Issue description

One of our UX research subjects noted that the boxes for the form fields were too light and difficult to see.

Review and redesign as appropriate to improve the usability in these fields.

Acceptance criteria

[ ] Design and Dev collaborate to make decisions regarding optimal colors and contrast
[ ] Dev ticket created with clear changes to be made, if necessary. (work may completed as we go)

Additional context

Note from usability study affinity mapping

Links to other issues

Relates to Admin: Copy button has poor color contrast on hover
Relates to Admin: Sidenav selected item text contrasts poorly in dark mode

abroddrick commented 1 week ago

@PaulKuykendall @Katherine-Osos or @AnnaGingle it seems like this would apply to both light and dark mode correct? Should we hold off on all contrast/dark mode tickets until this one is completed? Also is there a design/product priority here for this one as clearly design time will be needed for this

AnnaGingle commented 1 week ago

@PaulKuykendall it looks like our checkbox styling is applied via browser settings. Notice how mine are pink?

AnnaGingle commented 1 week ago

@PaulKuykendall Or could this ticket be about these checkboxes? Do you know which ones the participant was talking about?

h-m-f-t commented 1 week ago

I'm pretty close to calling this "closed as not planned". This was awhile ago and I don't know that we have much to go on.

AnnaGingle commented 1 week ago

Can confirm the table checkboxes are using system settings styles. cc @abroddrick.

The green and black checkboxes meet contrasts standards.