FontAwesome (v5) - loading spinner

#1
FontAwesome 
To replace default MyBB spinner by a modern good looking FontAwesome spinner you will need to apply these changes:

- FontAwesome v5.x library is required, please load it on your website

1) Open "headerinclude" template and find this block of code:
var spinner = "<img src='" + spinner_image +"' alt='' />";

and replace it with this one:
var spinner = "<img src='" + spinner_image +"' alt='' style='display: none' /><i class='fas fa-spinner fa-spin'></i>";

2) Open "showthread_quickreply" template and find this block of code:
<div id="quickreply_spinner" class="showthread_spinner" style="display: none"><img src="{$theme['imgdir']}/spinner.gif" /></div>

and replace it with this one:
<div id="quickreply_spinner" class="showthread_spinner" style="display: none"><img src="{$theme['imgdir']}/spinner.gif" style="display: none;" /><i class="fas fa-spinner fa-spin"></i></div>
*note: do not forget to apply the code above to all places where you might have the spinner

3) Open your "global.css" in your theme and add these few line of code below at the end of file:
#quickreply_spinner .fas {
font-size: 36px;
}

4) You are done, refresh your page (Ctrl+F5) and check the result!
Reply

Possibly Related Threads…
Thread Author Replies Views Last Post
FontAwesome FontAwesome (v5) - usergroup stars Eldenroot 1 335 20-08-2019, 07:28 AM
Last Post: mujeebdgk
Users browsing this thread: 1 Guest(s)