Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Firefox uses apple-touch-icon in Urlbar history #10394

Closed
silverwind opened this issue Feb 21, 2020 · 2 comments · Fixed by #10402
Closed

Firefox uses apple-touch-icon in Urlbar history #10394

silverwind opened this issue Feb 21, 2020 · 2 comments · Fixed by #10402
Labels
topic/ui Change the appearance of the Gitea UI

Comments

@silverwind
Copy link
Member

silverwind commented Feb 21, 2020

Urlbar history entries in Firefox on macOS have apple-touch-icon as their icon and the browser seems to actively pull the icon during page load. We should seek to prevent this and it should just use the shortcut icon as the apple icon looks ugly with the opaque white background on a dark browser theme:

image

<link rel="shortcut icon" href="/img/favicon.png">
<link rel="apple-touch-icon" href="/img/apple-touch-icon.png">
@guillep2k guillep2k added the topic/ui Change the appearance of the Gitea UI label Feb 21, 2020
@silverwind
Copy link
Member Author

silverwind commented Feb 21, 2020

Related discussion: https://old.reddit.com/r/firefox/comments/71rjkt/why_is_top_sites_using_appletouchicon_meta/

I think it's time to remove the opacity on the apple-touch-icon again to fix this:

@silverwind
Copy link
Member Author

silverwind commented Feb 21, 2020

More info: https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/UI_considerations#Rich_icons

Checked GitHub, they do not define apple-touch-icon at all, just this which seems to serve the same purpose of a "rich icon":

<link rel="fluid-icon" href="https://github.com/fluidicon.png" title="GitHub">

apple-touch-icon does not need to be specified in HTML as supporting Apple devices will retrieve it from static URL /apple-touch-icon.png (In contrast with Firefox which will not do that). I will attempt this later.

silverwind added a commit to silverwind/gitea that referenced this issue Feb 23, 2020
The opaque background does not work well in Firefox which uses the icon
as a "rich icon". Prevent this by not specifying it in HTML. Real Apple
devices will still request the icon on the static path.

Fixes: go-gitea#10394

Also adjust gitignore so app.ini.sample becomes searchable and fixed a
variable name in app.ini.sample.
jolheiser pushed a commit that referenced this issue Feb 23, 2020
* Prevent Firefox from using apple-touch-icon

The opaque background does not work well in Firefox which uses the icon
as a "rich icon". Prevent this by not specifying it in HTML. Real Apple
devices will still request the icon on the static path.

Fixes: #10394

Also adjust gitignore so app.ini.sample becomes searchable and fixed a
variable name in app.ini.sample.

* fix gitignore
@go-gitea go-gitea locked and limited conversation to collaborators Nov 24, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
topic/ui Change the appearance of the Gitea UI
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants