Opened 6 years ago

Closed 2 years ago

#14834 closed Bug (duplicate)

Colour issues in CSS - particularly documentation

Reported by: Greg Turner Owned by: Greg Turner
Component: Documentation Version: 1.2
Severity: Normal Keywords: sprintdec2010
Cc: Triage Stage: Accepted
Has patch: yes Needs documentation: no
Needs tests: no Patch needs improvement: yes
Easy pickings: no UI/UX: no

Description

As part of a CSS audit (qv #11390) I ran a colour contrast checker over docs.djangoproject.com, and the issues it highlighted were:

  • code snippets: grey text on green (e.g. comments, 'self': low contrast)
  • code snippets: orange text on green (e.g. strings: low contrast for colour blind visitors)
  • "Questions/feedback: orange text on green (links: low contrast for colour-blind visitors)

The attached patch for pygments.css corrects the code snippets. However there are no css files in the djangoproject.com repository so I'm unsure who will

Attachments (1)

pygments_css.diff (3.1 KB) - added by Greg Turner 6 years ago.

Download all attachments as: .zip

Change History (9)

Changed 6 years ago by Greg Turner

Attachment: pygments_css.diff added

comment:1 Changed 6 years ago by Greg Turner

The questions/feedback is in the footer by the way.

comment:2 Changed 6 years ago by Greg Turner

And the CSS audit is #11930.

comment:3 Changed 6 years ago by Gabriel Hurley

Patch needs improvement: set
Triage Stage: UnreviewedAccepted

Good call on the contrast check. I'd made a mental note of the grey on green before, but had never gotten around to opening a ticket for it.

My concern with the current patch is that it makes the various colors all pretty similar. They all tend towards blending in with the black text, and at that point you've lost the advantage of code highlighting.

One thing I think might help would be lightening the background color of the code blocks rather than darkening the foreground colors. (That'd mean changing pre, .literal-block's background-color property)

So, whatever can be done to increase contrast without losing the clear distinction of the colors would improve this patch IMHO.

comment:4 Changed 6 years ago by James Addison

milestone: 1.3
Severity: Normal
Type: Bug

comment:5 Changed 5 years ago by Aymeric Augustin

UI/UX: unset

Change UI/UX from NULL to False.

comment:6 Changed 5 years ago by Aymeric Augustin

Easy pickings: unset

Change Easy pickings from NULL to False.

comment:7 Changed 4 years ago by Aymeric Augustin

comment:8 Changed 2 years ago by Tim Graham

Resolution: duplicate
Status: newclosed

After the redesign this is superseded by https://github.com/django/djangoproject.com/issues/198 and tickets in that tracker.

Note: See TracTickets for help on using tickets.
Back to Top