mozilla wordmark in footer repeating (add no-repeat)

VERIFIED FIXED

Status

www.mozilla.org
Pages & Content
VERIFIED FIXED
3 years ago
3 years ago

People

(Reporter: fuzzyfox, Assigned: agibson)

Tracking

Production

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [kb=1729882])

Attachments

(2 attachments)

(Reporter)

Description

3 years ago
Created attachment 8592888 [details]
Screen Shot 2015-04-15 at 17.36.56.png

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:37.0) Gecko/20100101 Firefox/37.0
Build ID: 20150402191859

Steps to reproduce:

* Visited mozilla.org using Firefox 37.0.1
* Scroll to footer to see wordmark is repeating


Actual results:

Repeating wordmark in mozilla.org footer


Expected results:

non-repeating footer, can be solved by adding simple no-repeat to `#colophon .logo a`
I cannot reproduce the issue. Anyone?
Component: Webdev → Pages & Content
Product: mozilla.org → www.mozilla.org
Version: other → Production
(Reporter)

Comment 2

3 years ago
A little more that I probably should have included

Exact URL: https://www.mozilla.org/en-US/
Machine: MBP 2011, OSX Yosemite
I'm unable to repro on prod/stage/dev, using OSX Yosemite 10.10.1, Firefox 37.0.1
(Assignee)

Comment 4

3 years ago
I can't reproduce this either. I think it might likely be a cache issue. 

:fuzzyfox could you please see if you are still seeing the issue. If so, does a hard-refresh fix it?
Flags: needinfo?(fuzzyfox0)
(Reporter)

Comment 5

3 years ago
It is indeed still there, checked in a blank profile to to ensure its not an addon causing the issue.

The fix I proposed works well (via devtools) and will definitely solve the issue for myself and anyone else who may encounter it with only a single line addition to the css.
Flags: needinfo?(fuzzyfox0)
(Assignee)

Comment 6

3 years ago
The CSS change may well fix the symptom, but I'm also curious as to the real cause and why others aren't seeing it.
(Assignee)

Comment 7

3 years ago
Ok, I can see the issue when testing on a non-retina Mac. Retina screens look fine.

The low-res image being loaded is:

https://www.mozilla.org/media/img/sandstone/footer-mozilla-white.d2f5c608cf32.png

this is sized at 88x24px

But the updated asset (removing the hash in the file name) is this one:

https://www.mozilla.org/media/img/sandstone/footer-mozilla-white.png

which is sized at 93x24px

So the image is the correct size in the repo, but the cached one on prod is still the old one.

Looks like this is the commit: https://github.com/mozilla/bedrock/commit/dc4401e8a695edc97999e7f3a32183e477d24507#diff-02438a08bc574a5ba98b607707e05d21

CC'ing pmac, who may be interested here.

Regardless, looks like we may just be able to cache bust the image here to at least fix the display issue.
(Assignee)

Updated

3 years ago
Duplicate of this bug: 1156673
So do we still have to use a cache bang for updated images?
Only in specific situations :( There's a bug in django where the name of the CSS file isn't changed (the hashed name) if only the content of images change. In other words, if an image changes that is referenced from a LESS file, the LESS file needs to change in some way as well.
(Assignee)

Comment 11

3 years ago
(In reply to Paul McLanahan [:pmac] from comment #10)
> Only in specific situations :( There's a bug in django where the name of the
> CSS file isn't changed (the hashed name) if only the content of images
> change. In other words, if an image changes that is referenced from a LESS
> file, the LESS file needs to change in some way as well.

The strange thing is with this bug, (as far as I can tell) both the CSS file and the image changed in this commit: https://github.com/mozilla/bedrock/commit/dc4401e8a695edc97999e7f3a32183e477d24507#diff-02438a08bc574a5ba98b607707e05d21

So maybe we do still been a cache bang? :(
@agibson: Is it possible that the LESS change resulted in the same minified CSS? That's the kicker. It should be sufficient to use one of those "special comments" in the file with the date, then we can just bump the date when something changes.
(Assignee)

Comment 13

3 years ago
I don't think it should have done, for example the explicit with changed from 88px to 93px in the CSS:

https://github.com/mozilla/bedrock/commit/dc4401e8a695edc97999e7f3a32183e477d24507#diff-02438a08bc574a5ba98b607707e05d21L790
(Assignee)

Comment 14

3 years ago
Created attachment 8596582 [details] [review]
GitHub pull request

Let's see if a cache buster comment does it this time.
(Assignee)

Updated

3 years ago
Assignee: nobody → agibson
Status: UNCONFIRMED → ASSIGNED
Ever confirmed: true
(Assignee)

Updated

3 years ago
Whiteboard: [kb=1729882]

Comment 15

3 years ago
Commits pushed to master at https://github.com/mozilla/bedrock

https://github.com/mozilla/bedrock/commit/59c25f0ef0a1dd30864728eb2f30df1d68e6586e
[fix bug 1154786] Mozilla wordmark in footer repeating

https://github.com/mozilla/bedrock/commit/2d5070cd19630c4bd24016b4f002292cc18657b6
Merge pull request #2926 from alexgibson/bug-1154786-mozilla-wordmark-footer-repeating

[fix bug 1154786] Mozilla wordmark in footer repeating

Updated

3 years ago
Status: ASSIGNED → RESOLVED
Last Resolved: 3 years ago
Resolution: --- → FIXED
(Assignee)

Comment 16

3 years ago
I manually verified this as fixed today on a low-res Macbook Air when visiting https://www.mozilla.org/
Status: RESOLVED → VERIFIED
You need to log in before you can comment on or make changes to this bug.