• Components
  • Loading

Loading 

@!jrmc.loading({ class: 'loading-spinner' })
<span class="loading loading-spinner" ></span>

Loading spinner 

@!jrmc.loading.spinner()
<span class="loading loading-spinner" ></span>

Loading dots 

@!jrmc.loading.dots()
<span class="loading loading-dots" ></span>

Loading ring 

@!jrmc.loading.ring()
<span class="loading loading-ring" ></span>

Loading ball 

@!jrmc.loading.ball()
<span class="loading loading-ball" ></span>

Loading bars 

@!jrmc.loading.bars()
<span class="loading loading-bars" ></span>

Loading infinity 

@!jrmc.loading.infinity()
<span class="loading loading-infinity" ></span>

Loading size 

@!jrmc.loading.ring({ class: 'loading-xs' })
@!jrmc.loading.ring({ class: 'loading-sm' })
@!jrmc.loading.ring({ class: 'loading-md' })
@!jrmc.loading.ring({ class: 'loading-lg' })
<span class="loading loading-ring loading-xs" ></span>
<span class="loading loading-ring loading-sm" ></span>
<span class="loading loading-ring loading-md" ></span>
<span class="loading loading-ring loading-lg" ></span>

Loading color 

@!jrmc.loading.infinity({ class: 'text-primary' })
@!jrmc.loading.infinity({ class: 'text-secondary' })
@!jrmc.loading.infinity({ class: 'text-accent' })
@!jrmc.loading.infinity({ class: 'text-neutral' })
@!jrmc.loading.infinity({ class: 'text-info' })
@!jrmc.loading.infinity({ class: 'text-success' })
@!jrmc.loading.infinity({ class: 'text-warning' })
@!jrmc.loading.infinity({ class: 'text-error' })
<span class="loading loading-infinity text-primary" ></span>
<span class="loading loading-infinity text-secondary" ></span>
<span class="loading loading-infinity text-accent" ></span>
<span class="loading loading-infinity text-neutral" ></span>
<span class="loading loading-infinity text-info" ></span>
<span class="loading loading-infinity text-success" ></span>
<span class="loading loading-infinity text-warning" ></span>
<span class="loading loading-infinity text-error" ></span>