Wrong font icons on some devices #10106
Comments
|
Possibly related: #9794. |
|
Yes, it is from the official docs at getbootstrap.com. I've emptied the cache before reporting the problem indeed, it didn't help. |
|
Huh. Could you try this link and report back whether you see any icons in the Result frame (bottom right)? http://jsfiddle.net/tW57G/ Thanks! |
|
From the screenshot, it looks like potentially the same affected set of icons that our CSS had the wrong codepoints for before we fixed that problem... |
|
See attached screenshot of the jsfiddle page on my android 2.1 phone (it is in the official browser), the icons are just squares. It may be indeed a problem of the android phone's browser, but then I have no explanation why other icons are properly displayed on the same phone. |
|
Confirm I get the same result on JSFiddle as the above screenshot on 2.3.3 |
|
Possibly we're encountering http://stackoverflow.com/questions/9241519/webkit-css-content-unicode-bug ? |
|
That would certainly explain why the problem only occurs on older browsers. If this is indeed related to the WebKit bug, is there anything @jankovarik could do about it? (I myself am not at all educated about how web fonts work.) |
|
If the linked bug is indeed the cause, then we could edit the icon font so that all the codepoints used fall within the BMP, thus avoiding that WebKit bug. However, semantically correct codepoints might not be available within the BMP for all icons. |
|
Hey guys, I'm not good at these "code" things and all HTML/CSS code that I'm providing along with GLYPHICONS PRO is done by my friend (he is experienced coder). I'm not sure if this is going to help, but you can try to open this link: http://jankovarik.net/test/ on the Android device you've mentioned above and maybe you'll find something useful in its CSS code (you're free to use any part of this code). If this is not going to help, I'll try to find some solution for this during next GLYPHICONS update. |
|
The issue is there only with few icons, so moving them to different codes (which are supported even by the broken webkit) seems as a reasonable solution to me. I understand this is a problem of old webkit bug, not the font. But I would suggest to "fix" the font so it works even on broken webkits :) Attached is screenshot of the above mentioned URL http://jankovarik.net/test/ Old buggy webkit on my android phone can't render fonts of these icons: lock |
|
@Tomas-M I see, thanks for getting back to me - I'll try to take a closer look on this issue during next update. Please send me your email on: glyphicons@gmail.com and I'll reach you as soon as the new version is out. |
|
Closing as a Glyphicons issue. |
|
I am also running into this when utilizing bootstrap3 on PhoneGap, rendering via older webkit on android... I tried guessing some unicode characters to move to... but they didn't seem to play nice either... Are you planning on an update to this? (I've emailed "glyphicon@gmail.com " as suggested above) |
|
@zeroasterisk Please send me your email address on: glyphicons@gmail.com (with "s" in the end) and I'll get back to you as soon as I have the updated version. |
|
To make this easier I have added screencasts with all the doomed glyphs |
|
@jankovarik The fix would be to either alias or move all the Glyphicon Halflings icons currently at Unicode codepoints greater than U+FFFF, to codepoints ≤ U+FFFF. (Which is to say, to move them so that they fall within the Unicode Basic Multilingual Plane (BMP)). See the comments earlier in this thread for a list of affected icons. |
|
Guys, I've made some changes and here are updated files (just temporary, tested on Android 2.3.6): [updated link in post below] INFO: these symbols should have to have its own unique unicode codes in UTF based on their names, this is why was GlyphsApp forcing me to assign these UTF codes, so I had to renamed them. Here is a list of changes from GLYPHICONS Halflings, all you have to do is to replace font files (please backup first) and replace these UTF codes in your CSS file: lock - E033 Hope it helped. |
|
Hi there, Thanks for the quick update! This looks great on my Android 2.3.5 and 4.0 Thank you! Best Regards, On Mon, Sep 16, 2013 at 3:30 PM, jankovarik notifications@github.comwrote:
|
|
@dotnetwise I really do not know why exactly have older Android browser this problem, but I think that original (current) names of the symbols and their unicode codes in Bootstrap are correct as they are. I'm not sure if it's good idea to replace original font with this "fix" directly in Bootstrap (moreover: I can't make this by my own). But as I said above, you're free to use these files in case you need to support older devices. |
|
Replacing the unicode characters should be a transparent change... all of I agree that the class names should remain the same, I don't forsee any ... regardless, thanks for coming up with the alternative dataset. Thanks, On Mon, Sep 16, 2013 at 9:33 AM, jankovarik notifications@github.comwrote:
|
|
@zeroasterisk you could (and you still can) replace any UTF code that you need by yourself, there is no limitation in this direction in Bootstrap license. I've just spent time today in order to find what's exactly wrong, but I couldn't find anything so I made this alternate version, because I wanted to help you somehow. I've just sent the link to the updated files to the Twitter Bootstrap. It's not in my competence to make this change anyway. Hope you're understand guys. |
|
Hm, since this issue (ticket) is closed, I'm unsure if the fix gets propagated to twitter bootstrap :( |
|
Oh ye of little faith. |
|
@cvrebert I forgot this symbol :/ It is still broken on Android? (I'm sorry, but I do not have any device with Android here at the moment). |
|
@jankovarik Yes, it's the last remaining one. |
|
My apology, here is version with all updated icons: https://www.dropbox.com/s/clh9y6lqtmj01l8/halflings_updated_for_android.zip Once again list of all affected symbols: lock - E033 |
|
@mdo Any luck with this small but affecting change? |
|
Has anyone happened to have figured out what version of Android the underlying WebKit CSS bug was fixed in? |
|
I have 2.3.3. and all icons work for me with the new set. |
|
@RyanJMcGowan "The new set" = the ones at the link jankovarik posted? |
|
Icons do work, but the css classes are |
|
Folks, my question was if anyone knew when Android fixed the bug that prevents the original version of Glyphicons from working. |
|
|
|
@dotnetwise That's an unrelated bug. Did you even read the StackOverflow link I posted? Please read more carefully so you don't spread disinformation. |
|
@cvrebert Yes, the revised glyphicons from his link. |
|
Tested the original bug in Android 2.3.4 - AppleWebKit/533.1, as sent in USER_AGENT by the browser in the phone, and the webkit bug is there. Tested the original bug on Android 4.0.3, AppleWebkit/534.30, as sent in USER_AGENT by the browser in the phone, and the webkit bug is there too, but looks differently, see screenshot: |
|
|
|
Well, changing the codepoints is technically backwards-incompatible if anyone was using them directly, so the core dev team needs to decide how handle that. But there's no obstacle to drafting a pull request to update the code itself. |
|
Really not sure how to do that. These halfings codes look totally different than bootstrap ones, even class names are different. |
|
No one said you had to be the one to do it. I plan to write the patch soon, so don't worry your pretty little head over it. |
Workaround an old Android WebKit bug by switching to codepoints within the BMP. Details: http://stackoverflow.com/questions/9241519/webkit-css-content-unicode-bug Extra special thanks to @jankovarik for doing this update. <3 Source: https://www.dropbox.com/s/clh9y6lqtmj01l8/halflings_updated_for_android.zip (As posted in #10106 (comment) )
|
Testers would be appreciated over at pull request #10778. |
|
So when is this going to be applied on the master branch & live bootstrap site? |
|
dotnet person: Had you read the issue I linked to, you'd know that this has already been fixed in |
|
Hi again Tomas, I just wanted to let you know, that I've finished minor update 1.8.1 as I promised earlier. If you want to download this update, please, use your download link for version 1.8! Some of the icons were not appearing in some browsers, because their UFT codes (they were valid though). I'm still not sure why exactly is not possible to use these specific codes, but the important thing is that now it is working almost everywhere.. I've also added list of affected icons in _changelog.txt. Let me know if there is anything else I can do for you Jan Kovaříkwww.jankovarik.net On 26 Aug 2013, at 09:07, Tomas-M notifications@github.com wrote:
|
The glyph font icons are somehow broken on some devices. For example on my android phone (android 2.1) some of the icons are broken, but others look OK. See attached screenshot.
I'm not sure what is cause of that, yet if it is possible to show some of the icons properly on my device, it should be possible to fix it to show all of them properly. If you need more information, let me know. Thank you.
The text was updated successfully, but these errors were encountered: