Search code examples
twitter-bootstrapintel-xdk

Using glyphicon-triangle-left with Intel XDK it shows up as a Chinese character


I am building a multi OS app with Intel XDK. I use a Sony Xperia Z1 Compact to debug. It seems to support boostrap glyphicons, this one works;

<span class="glyphicon glyphicon-arrow-right" aria-hidden="true"></span>

But when I use this one;

<span class="glyphicon glyphicon-triangle-left" aria-hidden="true"></span>

It shows up (kinda) like this: 繢 (it looks a lot like this, but my scetching skills are not quite up to the task)

Anyone got a clue what is happening here?

*Edit, found out what else is no longer working, and I think it is in the Device with auto translate or something like it...

The List:

  • glyphicon glyphicon-cd
  • glyphicon glyphicon-save-file
  • glyphicon glyphicon-open-file
  • glyphicon glyphicon-level-up
  • glyphicon glyphicon-copy
  • glyphicon glyphicon-paste
  • glyphicon glyphicon-alert
  • glyphicon glyphicon-equalizer
  • glyphicon glyphicon-king
  • glyphicon glyphicon-queen
  • glyphicon glyphicon-pawn
  • glyphicon glyphicon-bishop
  • glyphicon glyphicon-knight
  • glyphicon glyphicon-baby-formula
  • glyphicon glyphicon-tent
  • glyphicon glyphicon-blackboard
  • glyphicon glyphicon-bed
  • glyphicon glyphicon-apple
  • glyphicon glyphicon-erase
  • glyphicon glyphicon-hourglass
  • glyphicon glyphicon-lamp
  • glyphicon glyphicon-duplicate
  • glyphicon glyphicon-piggy-bank
  • glyphicon glyphicon-scissors
  • glyphicon glyphicon-bitcoin
  • glyphicon glyphicon-btc
  • glyphicon glyphicon-xbt
  • glyphicon glyphicon-yen
  • glyphicon glyphicon-jpy
  • glyphicon glyphicon-ruble
  • glyphicon glyphicon-rub
  • glyphicon glyphicon-scale
  • glyphicon glyphicon-ice-lolly
  • glyphicon glyphicon-ice-lolly-tasted
  • glyphicon glyphicon-education
  • glyphicon glyphicon-option-horizontal
  • glyphicon glyphicon-option-vertical
  • glyphicon glyphicon-menu-hamburger
  • glyphicon glyphicon-modal-window
  • glyphicon glyphicon-oil
  • glyphicon glyphicon-grain
  • glyphicon glyphicon-sunglasses
  • glyphicon glyphicon-text-size
  • glyphicon glyphicon-text-color
  • glyphicon glyphicon-text-background
  • glyphicon glyphicon-object-align-top
  • glyphicon glyphicon-object-align-bottom
  • glyphicon glyphicon-object-align-horizontal
  • glyphicon glyphicon-object-align-left
  • glyphicon glyphicon-object-align-vertical
  • glyphicon glyphicon-object-align-right
  • glyphicon glyphicon-triangle-right
  • glyphicon glyphicon-triangle-left
  • glyphicon glyphicon-triangle-bottom
  • glyphicon glyphicon-triangle-top
  • glyphicon glyphicon-console
  • glyphicon glyphicon-superscript
  • glyphicon glyphicon-subscript
  • glyphicon glyphicon-menu-leftglyphicon glyphicon-menu-left
  • glyphicon glyphicon-menu-right
  • glyphicon glyphicon-menu-down
  • glyphicon glyphicon-menu-up

  • Solution

  • Half a year and a upvote later, I have this working, just don't remember what exactly I did to make it so. But looking into my code these are the things that matter to make it work:

    index.html:

    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap.css">
    </head>
    

    and make sure you have the fonts in a folder like this:

    www - index.html
        - fonts
            - glyphicons-halflings-regular.eot
            - glyphicons-halflings-regular.svg
            - glyphicons-halflings-regular.ttf
            - glyphicons-halflings-regular.woff
            - glyphicons-halflings-regular.woff2