Checkbox doesn't show the tick on checked

1

12

Instead of show the tick (√) it’s shows the word checkbox_md.
I think this has a simple solution, but I can’t find it.

<label class="checkbox">
      <input type="checkbox">
      <i class="icon-checkbox"></i>
</label>
2

you are missing the icons,
https://framework7.io/docs/icons.html

3

No, I put them. Other icons works fine, like Facebook icon. 34

    <link rel="stylesheet" href="css/framework7-icons.css">

The fonts file in fonts folder and the css file:

@font-face {
          font-family: 'Framework7 Icons';
          font-style: normal;
          font-weight: 400;
          src: url("fonts/Framework7Icons-Regular.eot");
          src: local('Framework7 Icons'),
             local('Framework7Icons-Regular'),
             url("fonts/Framework7Icons-Regular.woff2") format("woff2"),
             url("fonts/Framework7Icons-Regular.woff") format("woff"),
             url("fonts/Framework7Icons-Regular.ttf") format("truetype");
        }
.f7-icons, .framework7-icons {
          font-family: 'Framework7 Icons';
          font-weight: normal;
          font-style: normal;
          font-size: 28px;
          line-height: 1;
          letter-spacing: normal;
          text-transform: none;
          display: inline-block;
          white-space: nowrap;
          word-wrap: normal;
          direction: ltr;
          -webkit-font-smoothing: antialiased;
          text-rendering: optimizeLegibility;
          -moz-osx-font-smoothing: grayscale;
          -webkit-font-feature-settings: "liga";
          -moz-font-feature-settings: "liga=1";
          -moz-font-feature-settings: "liga";
          font-feature-settings: "liga";
        }
4

Did you found a solution? I have the same problem. I use MD Theme for Android and iOS. I have no problems on Android but on iOS sometimes the app shows “checkbox_md” instead of the tick. I tested it with iPhone and iPad and it happens very rarely. This morning, Apple doesn’t publish my app because of this error:

attachment.Screenshot-0719-121625
attachment.Screenshot-0719-1216251668×2224 289 KB

5

In my case was related with content security policy. Problem with css. Later i paste the code, i don’t remember exacly.

6

If I remember well, I add this font-src ‘self’ data:; and work.

<meta http-equiv="Content-Security-Policy" content="default-src *;
                                                        font-src 'self' data:;
                                                        style-src 'self' 'unsafe-inline'; 
                                                        script-src 'self' 'unsafe-inline' 'unsafe-eval'">
7

Thanks, but i have already font-src * data: in the Content-Security-Policy. In my case, it happens only every 10th time when i open the app. It only happens to icons from the “framework7-core-icons” font-family. I will open a own thread: https://forum.framework7.io/t/icons-from-framework7-core-icons-sometimes-dont-show-up