#6451 closed task (fixed)
InlineEditBox: use keyline to indicate editability
Reported by: | bill | Owned by: | bill |
---|---|---|---|
Priority: | high | Milestone: | 1.5 |
Component: | Dijit - LnF | Version: | 1.1.0 |
Keywords: | ibm a11y | Cc: | |
Blocked By: | Blocking: |
Description
Users might not notice the background color change to indicate that some text can be edited, so use a keyline instead.
I guess we do the same thing for ColorPalette?.
Taken from IBM Design Leadership recommendations.
Note: not sure how to implement this without causing page to move on mouse-over, given that outline doesn't work on IE (not sure which browsers it does work on)
Change History (12)
comment:1 Changed 12 years ago by
comment:3 Changed 12 years ago by
Milestone: | 1.3 → 1.4 |
---|
comment:4 Changed 12 years ago by
I see on test_InlineEditBox.html that it just changes the background-color to gray, doesn't add a border.
IIRC though the complication is with the text jumping a little bit when the border shows up. Need to figure out a way for that not to happen, by trading off padding for border. And then that requires having padding in the first place.
comment:5 Changed 11 years ago by
Milestone: | 1.4 → 1.5 |
---|
comment:6 Changed 11 years ago by
comment:7 Changed 11 years ago by
Keywords: | a11y added |
---|
Come to think of it this is also an a11y requirement.
comment:8 Changed 11 years ago by
(In [21061]) dijitClickableRegion and dijitDisabledClickableRegion were only being used for InlineEditBox?, and only when it was being hovered, so changing the names to make that clear.
New classes are:
- dijitInlineEditBoxDisplayMode - for a InlineEditBox? in view mode, before clicking it to edit
- dijitInlineEditBoxDisplayMode-disabled - added in addition to dijitInlineEditBoxDisplayMode, when the InlineEditBox? is disabled and can't be edited
- dijitInlineEditBoxDisplayMode-hover - when the user hovers over or focuses an enabled (non-disabled) InlineEditBox?
The new dijitInlineEditBoxDisplayMode (which is present even when not hovering) is needed for the keyline.
Refs #6451.
comment:9 Changed 11 years ago by
Resolution: | → fixed |
---|---|
Status: | new → closed |
(In [21062]) Add border around InlineEditBox? in display mode when it's hovered over, except on IE6 due to screen jumping problems. I just made the default border black; individual themes can override it. Code from Wen Dong (IBM, CCLA).
comment:10 Changed 11 years ago by
(In [21083]) Use keyline (border) on InlineEditBox hover for IE6 too, for accessibility reasons, despite the minor screen jump. Refs #6451, #10527.
Could use border:white (or whatever the page background color is) in non-hover mode, to prevent the screen jump, but decided to keep it simple as it's just an IE6 issue.
The original issue was that the mouse pointer wasn't changing to the text cursor. The keyline would be useful to be sure but doesn't address the original issue.