Page 2 of 2 FirstFirst 12
Results 11 to 16 of 16

Thread: How to upgrade Font Awesome

  1. #11
    Sencha Premium User
    Join Date
    Jun 2017
    Posts
    17

    Default

    I have. The way I fixed it was to move the
    HTML Code:
    .#{$prefix}fa:before,
    above the fas solid class. Also, make sure that if you did not get the pro version of Font Awesome, that your font-family just has the name without the word pro.

    HTML Code:
    .#{$prefix}fa:before,
    .#{$prefix}fas:before {
    
      font-family: "Font Awesome 5 Solid" !important;
    
    }
    Hope this helps.

  2. #12
    Sencha Premium User vadimv's Avatar
    Join Date
    Sep 2010
    Location
    Cluj, Romania
    Posts
    811
    Answers
    23

    Default

    I've followed the first post more or less, but my package is in project/packages/local/ and also added below 2 lines in build.xml to make the things cleaner and install them automatically, as for example in production some build scripts may install the ext.

    Code:
        <target name="-after-init-local">
            <copy file="${package.dir}/sass/etc/font-awesome-5-variables.scss"
                  tofile="${framework.dir}/sass/etc/font-awesome-5-variables.scss" overwrite="true"/>
            <copy file="${package.dir}/sass/etc/ext-all.scss"
                  tofile="${framework.dir}/sass/etc/all.scss" overwrite="true"/>
        </target>
    Then for font-awesome-5 had to rename the $fa-font-path into $fa-font-5-path to have both fonts in the app, needed during the migration.

    https://github.com/vadimpopa/sencha-font-awesome-5
    Github https://github.com/vadimpopa
    Blogging @ : http://vadimpopa.com
    Twitter: @vadimvpopa

  3. #13

    Default

    Hello Arik, I followed your instructions because I also purchased the Pro version of font awesome 5 and for some reason i cannot see the icons. what is the correct way to include for example the box full icon using the light styling.
    I tried iconCls: 'x-fa fal fa-box-full' and it did not work.

  4. #14

    Join Date
    May 2019
    Location
    Ho Chi Minh city, Vietnam
    Posts
    1

    Default

    Quote Originally Posted by belindaramireznew View Post
    Hello Arik, I followed your instructions because I also purchased the Pro version of font awesome 5 and for some reason i cannot see the icons. what is the correct way to include for example the box full icon using the light styling.
    I tried iconCls: 'x-fa fal fa-box-full' and it did not work.
    Do you check the scss path?

  5. #15
    Sencha Premium Member
    Join Date
    May 2011
    Posts
    33

    Default

    For your information, the current nightly build of ExtJS 7 includes Font Awesome Free Version 5.6.3

    For an update to Font Awesome Pro you have to set the
    "$font-icon-font-family" to "Font Awesome Pro" and update the Font and SCSS Files.

  6. #16
    Sencha Premium Member volkans80's Avatar
    Join Date
    Mar 2012
    Location
    Ankara, Turkey
    Posts
    91
    Answers
    2

    Default

    Thanks, it works with ExtJS 6.6.0, Font Awesome 5.10.1. (with minor fixes)

Page 2 of 2 FirstFirst 12

Similar Threads

  1. Upgrade font-awesome package to lastest version (4.4.0)
    By wemerson.januario in forum Ext JS 6.x Q&A
    Replies: 15
    Last Post: 2 Mar 2018, 8:38 AM
  2. Font.awesome 4.7 in SA 4.2
    By [email protected] in forum Sencha Architect 4.x: Q&A
    Replies: 1
    Last Post: 30 Nov 2017, 8:02 AM
  3. How to upgrade "font-awesome" fonts to Extjs 6.2?
    By Link_ in forum Ext JS 6.x Q&A
    Replies: 8
    Last Post: 7 Feb 2017, 1:37 PM
  4. Font Icons (Pictos, Font Awesome) not available on Windows 8.1
    By garysybex1 in forum Sencha Touch 2.x: Bugs
    Replies: 0
    Last Post: 1 Jun 2016, 5:33 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •