Topic: Check Icon Not Appearing Correctly when Using JQuery Linear Stepper

scottposh free asked 5 years ago


Hello!

I just purchased the complete Jquery UI Kit. Overall very happy with it, good work!!! :)

One issue though - I'm using the Linear Stepper (https://mdbootstrap.com/docs/jquery/components/stepper/#!) and I wanted to Font Awesome check mark icon to appear when you finish each step (instead of the blank square which is confusing). The font awesome code is f00c.

I dug into it a little more and it looks like you guys are using that font awesome code already, but it's not working. Can you please look into this and let me know how we can fix it?

Thank you!

Scott


Marta Wierzbicka staff answered 5 years ago


Hi,

add this code to your CSS:

ul.stepper .step.active:before { content'\f00c'font-size1rem; }
ul.stepper .step.done:before, ul.stepper .step.wrong:before { font-family'Font Awesome 5 free'font-weight900; }
 
Best,
Marta

scottposh free answered 5 years ago


That fixed it!! Thanks for the quick & helpful response :)



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.5.15
  • Device: all
  • Browser: all
  • OS: all
  • Provided sample code: No
  • Provided link: Yes