Bug 13017 - Login page image replacement technique fails when browser width exceeds 2000 pixels
Summary: Login page image replacement technique fails when browser width exceeds 2000 ...
Status: CLOSED FIXED
Alias: None
Product: Koha
Classification: Unclassified
Component: Templates (show other bugs)
Version: 3.16
Hardware: All All
: P5 - low trivial
Assignee: Owen Leonard
QA Contact: Testopia
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2014-09-30 20:30 UTC by Nicole C. Engard
Modified: 2016-06-21 21:37 UTC (History)
4 users (show)

See Also:
Change sponsored?: ---
Patch complexity: Trivial patch
Documentation contact:
Documentation submission:
Text to go in the release notes:
Version(s) released in:
Circulation function:


Attachments
koha h1 (19.68 KB, image/png)
2014-09-30 20:30 UTC, Nicole C. Engard
Details
Bug 13017 - Login page image replacement technique fails when browser width exceeds 2000 pixels (1.62 KB, patch)
2014-11-11 16:41 UTC, Owen Leonard
Details | Diff | Splinter Review
[SIGNED OFF] Bug 13017 - Login page image replacement technique fails when browser width exceeds 2000 pixels (1.66 KB, patch)
2014-12-01 16:23 UTC, Christopher Brannon
Details | Diff | Splinter Review
[PASSED QA] Bug 13017 - Login page image replacement technique fails when browser width exceeds 2000 pixels (1.71 KB, patch)
2014-12-05 15:43 UTC, Kyle M Hall (khall)
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Nicole C. Engard 2014-09-30 20:30:11 UTC
Created attachment 31959 [details]
koha h1

If you zoom out on the staff client you will see Koha to the far left (see attached).

The code reads:

<div id="login">

    <h1>
        <a href="http://koha-community.org">

            Koha

        </a>
    </h1>
Comment 1 Owen Leonard 2014-10-10 00:36:28 UTC
‘Doctor, doctor, it hurts when I do this.’

‘Then don’t do that!’

Sorry, I couldn't resist. Yes it's true. If your browser window goes much wider than 2000 pixels the image replacement technique which displays the Koha logo will fail, having this style:

text-indent: -1000px;

...which at the time of implementation was expected to be PLENTY of space to exclude the possibility that someone's browser would be wide enough that the text would be visible.

It may be that we need to increase that number, or it may be that there is a more modern image replacement technique which we should switch to.
Comment 2 Owen Leonard 2014-11-11 16:41:05 UTC Comment hidden (obsolete)
Comment 3 Christopher Brannon 2014-12-01 16:21:57 UTC
(In reply to Owen Leonard from comment #2)

> Note: This patch has not been tested in any Internet Explorer version!

Works in IE 11.
Comment 4 Christopher Brannon 2014-12-01 16:23:57 UTC Comment hidden (obsolete)
Comment 5 Kyle M Hall (khall) 2014-12-05 15:43:19 UTC
Created attachment 34156 [details] [review]
[PASSED QA] Bug 13017 - Login page image replacement technique fails when browser width exceeds 2000 pixels

This patch updates the image replacement technique used for Koha's login
page. The old technique used a negative text-indent value to move the
text offscreen, but that begins to fail more and more often as screens
get larger.

The new technqiue is described here:
http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/

Note: This patch has not been tested in any Internet Explorer version!

To test you must have a screen which is wider than 2000 pixels. Apply
the patch, clear your browser cache and view the staff client login
page. The logo on the login form should look correct with no
corresponding text appearing anywhere on the screen.

Signed-off-by: Christopher Brannon <cbrannon@debian.localdomain>

Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
Comment 6 Tomás Cohen Arazi (tcohen) 2014-12-28 14:21:56 UTC
Patch pushed to master.

Thanks Owen!
Comment 7 Chris Cormack 2014-12-29 19:17:52 UTC
Pushed to 3.18.x will be in 3.18.3
Comment 8 Mason James 2015-01-16 19:10:45 UTC
Pushed to 3.16.x, patch will be in 3.16.7