Bug 12376

Summary: blinking cursor not clear in larger resolutions
Product: Koha Reporter: Nicole C. Engard <nengard>
Component: TemplatesAssignee: Owen Leonard <oleonard>
Status: CLOSED FIXED QA Contact: Testopia <testopia>
Severity: trivial    
Priority: P5 - low CC: cbrannon, katrin.fischer, tomascohen, veron
Version: Main   
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: Trivial patch
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
Bug Depends on:    
Bug Blocks: 13370    
Attachments: easy to see on higher resolution
cursor right on the edge of the box and hard to see
Bug 12376 - blinking cursor not clear in larger resolutions
Bug 12376 - blinking cursor not clear in larger resolutions
[PASSED QA] Bug 12376 - blinking cursor not clear in larger resolutions

Description Nicole C. Engard 2014-06-05 17:15:52 UTC
Created attachment 28684 [details]
easy to see on higher resolution

This is one that I'm not sure we can fix, but users have noticed that the cursor isn't easy to see on higher resolutions. See my screenshots for examples - is there a way to add some padding or something on the boxes in Koha?
Comment 1 Nicole C. Engard 2014-06-05 17:17:04 UTC
Created attachment 28685 [details]
cursor right on the edge of the box and hard to see
Comment 2 Christopher Brannon 2014-11-17 16:06:28 UTC
The problem is easy to fix with jQuery, but introduces other issues due to unconventional uses of text boxes.  For example, I can add padding to the text boxes with this:

$("input[type='text']").css("padding","2px");

But unfortunately Koha has started adding graphics inside the text boxes, such as a padlock in some of the marc fields in cataloging.  If these images were on the outside of the textbox rather than inside, this would be fixed.  However, additional code would have to be used to detect and exclude these instances.

I agree that in general, the text boxes need some padding inside.  Not being able to see the cursor when it is right on top of the textbox border has been an ongoing nuisance.

Christopher
Comment 3 Christopher Brannon 2014-11-17 16:11:40 UTC
For a temp workaround, this seems to work better, and ignores boxes with the readonly class for the graphic in the marc fields:

$("input[type='text']").not(".readonly").css("padding","2px");

Christopher
Comment 4 Owen Leonard 2014-11-17 16:54:21 UTC
If you want to globally set custom CSS in the staff client, the  IntranetUserCSS preference is what you want:

input[type='text'] { padding : 2px; }
input[type='text'].readonly { padding-left : 15px; }

There's no reason to make JavaScript do that work on every page load if plain CSS can do it.
Comment 5 Christopher Brannon 2014-11-17 17:25:33 UTC
Thank you, Owen.  I do so much in jQuery, I tend to forget I can alter the CSS directly.

You smart - me working on it  ;)

In either case, I did notice that the check in textbox is lacking the type attribute.

I will file a separate bug on that.

Christopher
Comment 6 Owen Leonard 2014-11-17 18:48:18 UTC Comment hidden (obsolete)
Comment 7 Marc Véron 2014-11-17 20:47:01 UTC Comment hidden (obsolete)
Comment 8 Katrin Fischer 2014-11-17 21:27:02 UTC
Created attachment 33629 [details] [review]
[PASSED QA] Bug 12376 - blinking cursor not clear in larger resolutions

This patch slightly alters the padding on <input> and <textarea> so that
the cursor is more visible.

To test, apply the patch and clear your browser cache. View a variety of
pages in the staff client and confirm that the change does not adversely
affect the display of forms.

Small change that enhances user experience.
Patch behaves as expected.
Signed-off-by: Marc Véron <veron@veron.ch>

Signed-off-by: Katrin Fischer <Katrin.Fischer.83@web.de>
Works as described, small CSS change.
Comment 9 Tomás Cohen Arazi 2014-11-19 14:41:13 UTC
Patch pushed to master.

Thanks Owen!