F7 Icons using React

Questions
1

I want to use Icons using React and Webpack (project was created using the F7 CLI).

However I facing some issues:

  1. Font awesome Icons are not getting displayed at all.
  2. F7 icons are partially displayed.
  3. Is there one name for both iOS and Android?

For example:

<Link tabLink="#suggestions" tabLinkActive text="Offers" iconIos="f7:favorites" iconAurora="f7:favorites" iconMd="material:favorites"></Link>

In Android there heart, but in the F7 Icons there is a list.

How can I make this working, so every F7 icon will be displayed, in both iOS and Android.
Plus, how to allow font awesome icons too?

I have also tried:

<i class="fa fa-check"></i>

But this ain’t working.

2

Material icons is different library, so even similar icons can be named differently. For Material icons here is the reference https://material.io/tools/icons/

<Link tabLink="#suggestions"
tabLinkActive
text="Offers"
iconIos="f7:favorites"
iconAurora="f7:favorites"
iconMd="material:list_alt"
></Link>

But you can also just use F7 icon for all themes like:

<Link tabLink="#suggestions"
tabLinkActive
text="Offers"
iconF7="favorites"
></Link>
3

That’s great. So basically icons are comming from material? Where is the iOS icons list?

4

Framework7 Icons here https://framework7.io/icons/

5

Note that the icons in the link you have provided are not getting displayed properly.
Those are the iOS icons?

6

What is wrong with them? Can’t see any issues

35
Снимок экрана 2019-05-01 в 14.15.35.png1894×1410 153 KB

This is F7 Icons library, that is designed mostly for iOS, but it is not mandatory

7

Where there iOS icons?

8

For about the icons that are not getting displayed - in icognito it works, cleared cache in browser and works too.