Loading spinner

Need help
1

Is it possible to create a loading spinner of the size you want? for example very small?

2

Hi there, @quidsicurezza… you might want something “fancier” than this, but you can add an icon element to your page, choose the spinner (fa-spinner) for the icon, check the box to make the icon rotate, and make the element any size you want. Is that what you are trying to do?

Best…
Mike

2 Likes
3

You can use every spinner with its code in a HTML element. Like @mikeloc said you can use Bubble’s icons but it looks too bad in my opinion. Just add this code into the html element and make visible it whenever you want.

<style>
    .loader {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  background: linear-gradient(180deg, rgba(127, 200, 205, 0.5) 0%, rgba(141, 131, 255, 0.375) 100%);
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}
.loader::after {
  content: '';  
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 75px;
  height: 75px;
  border-radius: 50%;
  background: #6552F7;
}
@keyframes rotation {
  0% { transform: rotate(0deg) }
  100% { transform: rotate(360deg)}
} 
      
</style>

<span class="loader"></span>
2 Likes
4

That is definitely fancier. :slight_smile:

5

Hi @quidsicurezza You can check out our plugin Spinner/Loader. You can customize the size according to your needs, and you can place it wherever you want. I hope this might be helpful for you.

1 Like
6

This topic was automatically closed after 70 days. New replies are no longer allowed.