X
Tap here to go to the mobile version of the site.

Support Forum

Favicon does not have a coloured background

Posted

I tried Firefox 16.01 for the Mac OS and found the favicon does not show a inverted coloured background as shown in the Firefox documentation. Only the characters on a Https site are coloured green.

I take it this is an omission ?

I tried Firefox 16.01 for the Mac OS and found the favicon does not show a inverted coloured background as shown in the Firefox documentation. Only the characters on a Https site are coloured green. I take it this is an omission ?

Additional System Details

Installed Plug-ins

  • Shockwave Flash 11.4 r402
  • The QuickTime Plugin allows you to view a wide variety of multimedia content in web pages. For more information, visit the QuickTime Web site.

Application

  • User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:13.0) Gecko/20100101 Firefox/13.0.1

More Information

Upgraded from 13.01 to 16.01 and went to the Paypal web site. The same as in the firefox documentation.

Helpful Reply

enclosed a scrren shot

enclosed a scrren shot
philipp
  • Top 25 Contributor
  • Moderator
5307 solutions 23427 answers

Helpful Reply

How do I tell if my connection to a website is secure? - the screenshot in this article was taken on a different operating system (windows7), so the design might be different...

https://blog.mozilla.org/ux/2012/06/site-identity-ui-updates/

edit: please note that there were several critical vulnerabilities fixed since firefox 13 was released, therefore i'd recommend to Update Firefox to the latest release as soon as possible.

[[How do I tell if my connection to a website is secure?]] - the screenshot in this article was taken on a different operating system (windows7), so the design might be different... https://blog.mozilla.org/ux/2012/06/site-identity-ui-updates/ edit: please note that there were [https://www.mozilla.org/security/known-vulnerabilities/firefox.html several critical vulnerabilities fixed] since firefox 13 was released, therefore i'd recommend to [[Update Firefox to the latest version]] as soon as possible.

Modified by philipp

Question owner

If you read my note you would see it was version 16.01 I reported this Favicon problem.

where did you get I am using version 13

If you read my note you would see it was version 16.01 I reported this Favicon problem. where did you get I am using version 13
philipp
  • Top 25 Contributor
  • Moderator
5307 solutions 23427 answers

your user-agent states that you're using firefox 13.0.1 - in case you're already on firefox 16 and this information is wrongly submitted, please reset the user agent: Websites say that Firefox is outdated or incompatible even though it's the latest version

your user-agent states that you're using firefox 13.0.1 - in case you're already on firefox 16 and this information is wrongly submitted, please reset the user agent: [[Websites say that Firefox is outdated or incompatible even though it's the latest version]]

Question owner

Madperson: I reverted back to 13.01 after finding the following.

I have tried Firefox 16.01 on both Mac and PC and the Favicon for a SSL connection to Paypal looks different than the described information for Firefox 16.01 web site. I used Paypal as the example because that is what Firefox web site displays "http://www.mozilla.org/en-US/firefox/features/" however both the Mac OS and PC display just a simple green https favicon not a rich green (background green) as shown in Firefox's example.

Madperson: I reverted back to 13.01 after finding the following. I have tried Firefox 16.01 on both Mac and PC and the Favicon for a SSL connection to Paypal looks different than the described information for Firefox 16.01 web site. I used Paypal as the example because that is what Firefox web site displays "http://www.mozilla.org/en-US/firefox/features/" however both the Mac OS and PC display just a simple green https favicon not a rich green (background green) as shown in Firefox's example.

Question owner

The MD5 HAsh for the Pc version of Firefox is 6251c5c48214118f2e9be18f7a518451 Us-En for the PC

The MD5 HAsh for the Pc version of Firefox is 6251c5c48214118f2e9be18f7a518451 Us-En for the PC
philipp
  • Top 25 Contributor
  • Moderator
5307 solutions 23427 answers

this fits the one mozilla has published for win32/en-US/Firefox Setup 16.0.1.exe, see ftp://ftp.mozilla.org/pub/mozilla.org/firefox/releases/16.0.1/MD5SUMS

as i've said, please stay with the latest version to keep secure...

this fits the one mozilla has published for win32/en-US/Firefox Setup 16.0.1.exe, see ftp://ftp.mozilla.org/pub/mozilla.org/firefox/releases/16.0.1/MD5SUMS as i've said, please stay with the latest version to keep secure...
cor-el
  • Top 10 Contributor
  • Moderator
17482 solutions 158016 answers

The screenshot on the features page is from an older Firefox version.

Current Firefox versions no longer apply a background color to the Site Identity Button, but only color the domain in case of a EV SSL certificate.

The screenshot on the features page is from an older Firefox version. Current Firefox versions no longer apply a background color to the Site Identity Button, but only color the domain in case of a EV SSL certificate. *http://blog.mozilla.org/ux/2012/06/site-identity-ui-updates/

Question owner

Why is Firefox showing an old page for version 16? where is the new web page for firefox 16 description?

Why is Firefox showing an old page for version 16? where is the new web page for firefox 16 description?

Question owner

I don't understand how Mozilla could put out a new version of firefox out 16.01 and have incorrect documentation on its new features. You want me toupgrade when the documentation does not match the actual product? I don't think anyone will upgrade if they can't trust the documentation. "http://www.mozilla.org/en-US/firefox/features/

I don't understand how Mozilla could put out a new version of firefox out 16.01 and have incorrect documentation on its new features. You want me toupgrade when the documentation does not match the actual product? I don't think anyone will upgrade if they can't trust the documentation. "http://www.mozilla.org/en-US/firefox/features/
cor-el
  • Top 10 Contributor
  • Moderator
17482 solutions 158016 answers

You can still achieve this via various means.
There may be themes that add a background color.
You can also use the Stylish extension or use the userChrome.css file to style the user interface.

I'm using this code in userChrome.css to add my own customization (using HSLA makes it easy to modify the colors).

The customization files userChrome.css (interface) and userContent.css (websites) are located in the chrome folder in the user profile folder.


@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

/* Restore Site Identity Button background */
#urlbar[pageproxystate="valid"] #identity-box.verifiedDomain *{
  background-image: -moz-linear-gradient(hsl(215,60%,92%), hsl(215,58%,88%))!important;
  box-shadow: 0 1px 0 hsla(215,54%,33%,.05) inset!important;
  -moz-border-end-color: hsla(215,54%,33%,.2)!important;
  color: hsl(215,54%,33%)!important;
}

#urlbar[pageproxystate="valid"] #identity-box.verifiedIdentity *{
  background-image: -moz-linear-gradient(hsl(91,70%,90%), hsl(93,60%,81%))!important;
  box-shadow: 0 1px 0 hsla(92,81%,16%,.05) inset!important;
  -moz-border-end-color: hsla(92,81%,16%,.2)!important;
  color: hsl(92,81%,16%)!important;
}

#urlbar[pageproxystate="valid"] #identity-box.unknownIdentity.mixedContent {
 background-image: -moz-linear-gradient(hsl(61,100%,70%), hsl(63,90%,60%))!important;
 box-shadow: 0 1px 0 hsla(62,81%,16%,.05) inset!important;
 -moz-border-end-color: hsla(62,81%,16%,.2)!important;
 color: hsl(62,81%,16%)!important;
}

#urlbar[pageproxystate="valid"] #identity-box.unknownIdentity.mixedContent #page-proxy-favicon {
 list-style-image: url("chrome://browser/skin/Security-broken.png")!important;
 -moz-image-region: auto!important;
}

#urlbar[pageproxystate="valid"] #identity-box.unknownIdentity.mixedActiveContent {
 background-image: -moz-linear-gradient(hsl(1,90%,88%), hsl(3,80%,80%))!important;
 box-shadow: 0 1px 0 hsla(2,81%,16%,.05) inset!important;
 -moz-border-end-color: hsla(2,81%,16%,.2)!important;
 color: hsl(2,81%,16%)!important;
}
#urlbar[pageproxystate="valid"] #identity-box.unknownIdentity.mixedActiveContent #page-proxy-favicon {
 list-style-image: url("chrome://browser/skin/Security-broken.png")!important;
 -moz-image-region: auto!important;
}
You can still achieve this via various means.<br /> There may be themes that add a background color.<br /> You can also use the Stylish extension or use the userChrome.css file to style the user interface. I'm using this code in userChrome.css to add my own customization (using HSLA makes it easy to modify the colors). *http://en.wikipedia.org/wiki/HSL_and_HSV The customization files userChrome.css (interface) and userContent.css (websites) are located in the chrome folder in the user profile folder. *http://kb.mozillazine.org/Editing_configuration ---- <pre><nowiki>@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */ /* Restore Site Identity Button background */ #urlbar[pageproxystate="valid"] #identity-box.verifiedDomain *{ background-image: -moz-linear-gradient(hsl(215,60%,92%), hsl(215,58%,88%))!important; box-shadow: 0 1px 0 hsla(215,54%,33%,.05) inset!important; -moz-border-end-color: hsla(215,54%,33%,.2)!important; color: hsl(215,54%,33%)!important; } #urlbar[pageproxystate="valid"] #identity-box.verifiedIdentity *{ background-image: -moz-linear-gradient(hsl(91,70%,90%), hsl(93,60%,81%))!important; box-shadow: 0 1px 0 hsla(92,81%,16%,.05) inset!important; -moz-border-end-color: hsla(92,81%,16%,.2)!important; color: hsl(92,81%,16%)!important; } #urlbar[pageproxystate="valid"] #identity-box.unknownIdentity.mixedContent { background-image: -moz-linear-gradient(hsl(61,100%,70%), hsl(63,90%,60%))!important; box-shadow: 0 1px 0 hsla(62,81%,16%,.05) inset!important; -moz-border-end-color: hsla(62,81%,16%,.2)!important; color: hsl(62,81%,16%)!important; } #urlbar[pageproxystate="valid"] #identity-box.unknownIdentity.mixedContent #page-proxy-favicon { list-style-image: url("chrome://browser/skin/Security-broken.png")!important; -moz-image-region: auto!important; } #urlbar[pageproxystate="valid"] #identity-box.unknownIdentity.mixedActiveContent { background-image: -moz-linear-gradient(hsl(1,90%,88%), hsl(3,80%,80%))!important; box-shadow: 0 1px 0 hsla(2,81%,16%,.05) inset!important; -moz-border-end-color: hsla(2,81%,16%,.2)!important; color: hsl(2,81%,16%)!important; } #urlbar[pageproxystate="valid"] #identity-box.unknownIdentity.mixedActiveContent #page-proxy-favicon { list-style-image: url("chrome://browser/skin/Security-broken.png")!important; -moz-image-region: auto!important; } </nowiki></pre>

Question owner

Thanks, but If I upgrade to a new version and the documentation doesn't match I will not upgrade to that versionand I will not make modifications on a expected behavior

Thanks, but If I upgrade to a new version and the documentation doesn't match I will not upgrade to that versionand I will not make modifications on a expected behavior
cor-el
  • Top 10 Contributor
  • Moderator
17482 solutions 158016 answers

The code that I posted above works in Firefox 19 (currently under development) although the four mixedContent rules (http content on https web pages) may not be needed and can be left out.

The code that I posted above works in Firefox 19 (currently under development) although the four mixedContent rules (http content on https web pages) may not be needed and can be left out.