icons not displayin...
 
Notifications
Clear all

wpForo 1.x.x [Solved] icons not displaying correctly

21 Posts
3 Users
4 Likes
1,294 Views
Tutrix
Posts: 822
(@tutrix)
Noble Member
Joined: 3 years ago

@rainerpuschner

try this code for the icons

#wpforo #wpforo-wrap i[class*="fas"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="far"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="fab"]::before {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap .fas, 
#wpforo #wpforo-wrap .far,
#wpforo #wpforo-wrap .fab {
    text-decoration: none !important;
}
2 Replies
rainerpuschner
(@rainerpuschner)
Joined: 1 year ago

Active Member
Posts: 13

@tutrix THANK YOU!!! Your CSS Code just works perfectly!

rainerpuschner
(@rainerpuschner)
Joined: 1 year ago

Active Member
Posts: 13

Oh no! There is still one missing!

 

 

rainerpuschner
Posts: 13
Topic starter
(@rainerpuschner)
Active Member
Joined: 1 year ago

And this one (or is it the same?)

 

rainerpuschner
Posts: 13
Topic starter
(@rainerpuschner)
Active Member
Joined: 1 year ago

And what to do here?

8 Replies
Tutrix
(@tutrix)
Joined: 3 years ago

Noble Member
Posts: 822

@rainerpuschner 

add this too

#wpforo #wpforo-wrap i[class*="fa-layer-group"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="text"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="password"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="email"] {
    padding: 10px 20px 10px 34px !important;
}
rainerpuschner
(@rainerpuschner)
Joined: 1 year ago

Active Member
Posts: 13

@tutrix Yeah! Its getting better from time to time! THANK YOU SO MUCH!

 

This onei s still missing

Tutrix
(@tutrix)
Joined: 3 years ago

Noble Member
Posts: 822

@rainerpuschner 

you must use the complete code I posted above

 

rainerpuschner
(@rainerpuschner)
Joined: 1 year ago

Active Member
Posts: 13

@tutrix i did!

This is the whole Code in the CSS section of wpforo:

 

#wpforo-wrap {
   font-size: 13px; width: 100%; padding:10px 0; margin:0px; border-radius: 5px;
}


#wpforo #wpforo-wrap i[class*="far"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap i[class*="fab"]::before {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
#wpforo #wpforo-wrap .fas, 
#wpforo #wpforo-wrap .far,
#wpforo #wpforo-wrap .fab {
    text-decoration: none !important;
}

#wpforo #wpforo-wrap i[class*="fa-layer-group"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}

#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="text"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="password"], 
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field .wpf-field-wrap input[type="email"] {
    padding: 10px 20px 10px 34px !important;
}
Tutrix
(@tutrix)
Joined: 3 years ago

Noble Member
Posts: 822

@rainerpuschner 

and why not completely?

rainerpuschner
(@rainerpuschner)
Joined: 1 year ago

Active Member
Posts: 13

@tutrix Did i miss some snippet? Thats all code snippets you showed to me, isnt it?

Tutrix
(@tutrix)
Joined: 3 years ago

Noble Member
Posts: 822

@rainerpuschner 

you forgot or removed this part of the code

#wpforo #wpforo-wrap i[class*="fas"]::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    top: 0 !important;
}
rainerpuschner
(@rainerpuschner)
Joined: 1 year ago

Active Member
Posts: 13

@tutrix THANK YOU SO MUCH! I dont know how i missed that code... DANKE DANKE DANKE!

Page 2 / 2