Opened 12 years ago

Closed 12 years ago

#4182 closed defect (fixed)

Need to make expand/collapse clickable area for tree larger in high contrast mode

Reported by: Becky Gibson Owned by: ptbrunet
Priority: high Milestone: 1.0
Component: Accessibility Version: 0.9
Keywords: Cc: brunet@…
Blocked By: Blocking:

Description

When in high contrast mode very small + and - characters are used in place of the icons - this makes for a very small area in which to click to expand/collapse the tree nodes. We need to use larger characters or make the clickable region larger.

Perhaps using full size characters rather than the .75em would be enough. We could consider html entity characters but the screen readers will speak "question" for them when the user is navigating the page.

Attachments (1)

4182c.patch (447 bytes) - added by ptbrunet 12 years ago.

Download all attachments as: .zip

Change History (10)

comment:1 Changed 12 years ago by bill

Yup, once #3661 is fixed you should take out all the styling (about font and font size) for those characters.

Since those buttons are actually dijit Buttons, this is just like styling the Toolbar buttons where you show icons or text.

comment:2 Changed 12 years ago by Becky Gibson

huh, they certainly don't look or behave like buttons to me? Also need to change the cursor as it is an insertion point since this is text. Unfortunately a simple cursor:pointer on dijitExpandoText didn't seem to do the trick.

comment:3 Changed 12 years ago by bill

Woops, I was talking about slider (since that has a similar problem, right?). Sorry, read the bug title wrong. But the basic thing I said still holds true, that you should remove all font-size styling for the +/- characters.

comment:4 Changed 12 years ago by ptbrunet

Cc: brunet@… added
Owner: changed from Becky Gibson to ptbrunet

comment:5 Changed 12 years ago by ptbrunet

I added a border around the character, i.e. the '+' or '-' and I made the '-' 10% larger. It's quite easy to see and click now. A patch is attached.

comment:6 Changed 12 years ago by ptbrunet

I had to reset the size of the character, i.e. the '+', back to .75em when the node collapses, i.e. when the minus is displayed it's at 110% and when the plus is displayed it's at .75 em. Attached a patch.

comment:7 Changed 12 years ago by ptbrunet

Removed fix from Tree.js and just made the char bigger in the CSS, i.e. removed the 0.75em so both - and + display larger. 4182b.patch attached.

Changed 12 years ago by ptbrunet

Attachment: 4182c.patch added

comment:8 Changed 12 years ago by ptbrunet

Changed patch to use monospace. The box was changing sizes between a - and a +.

comment:9 Changed 12 years ago by simonjb

Resolution: fixed
Status: newclosed

(In [10832]) Fixes #4182: Need to make expand/collapse clickable area for tree larger in high contrast mode.

Note: See TracTickets for help on using tickets.