No Problemo Muchacho

    angular-epic-spinners
    TypeScript icon, indicating that this package has built-in type declarations

    2.0.0 • Public • Published

    Angular Epic Spinners

    npm npm npm

    Reusable angular components for epic spinners

    Demo

    Visit the demo page to see spinners in action

    Installation

    npm install --save angular-epic-spinners

    OR

    yarn install angular-epic-spinners

    Usage

    Example

    Import each spinners' module into your module file and use the spinner component anywhere.

      import {AtomSpinnerModule} from 'angular-epic-spinners'
      
      @NgModule({
        imports: [AtomSpinnerModule]
      })

    Then in your html file

      <app-atom-spinner
         [animationDuration]="1000"
         [size]="60"
         [color]="'#ff1d5e'"
        ></app-atom-spinner>

    Components list

    You can easily configure spinners' size, color and animation speed

    <app-flower-spinner
      [animationDuration]="2500"
      [size]="70"
      [color]="'#ff1d5e'"
    ></app-flower-spinner>
     
    <app-pixel-spinner
      [animationDuration]="2000"
      [pixelSize]="70"
      [color]="'#ff1d5e'"
    ></app-pixel-spinner>
     
    <app-hollow-dots-spinner
      [animationDuration]="1000"
      [dotSize]="15"
      [dotsNum]="3"
      [color]="'#ff1d5e'"
    ></app-hollow-dots-spinner>
     
    <app-intersecting-circles-spinner
      [animationDuration]="1200"
      [size]="70"
      [color]="'#ff1d5e'"
    ></app-intersecting-circles-spinner>
     
    <app-orbit-spinner
      [animationDuration]="1200"
      [size]="55"
      [color]="'#ff1d5e'"
    ></app-orbit-spinner>
     
    <app-radar-spinner
      [animationDuration]="2000"
      [size]="60"
      [color]="'#ff1d5e'"
    ></app-radar-spinner>
     
    <app-scaling-squares-spinner
      [animationDuration]="1250"
      [size]="65"
      [color]="'#ff1d5e'"
    ></app-scaling-squares-spinner>
     
    <app-half-circle-spinner
      [animationDuration]="1000"
      [size]="60"
      [color]="'#ff1d5e'"
    ></app-half-circle-spinner>
     
    <app-trinity-rings-spinner
      [animationDuration]="1500"
      [size]="66"
      [color]="'#ff1d5e'"
    ></app-trinity-rings-spinner>
     
    <app-fulfilling-square-spinner
      [animationDuration]="4000"
      [size]="50"
      [color]="'#ff1d5e'"
    ></app-fulfilling-square-spinner>
     
    <app-circles-to-rhombuses-spinner
      [animationDuration]="1200"
      [circlesNum]="3"
      [circleSize]="15"
      [color]="'#ff1d5e'"
    ></app-circles-to-rhombuses-spinner>
        
    <app-semipolar-spinner
      [animationDuration]="2000"
      [size]="65"
      [color]="'#ff1d5e'"
    ></app-semipolar-spinner>
        
    <app-self-building-square-spinner
      [animationDuration]="6000"
      [size]="40"
      [color]="'#ff1d5e'"
    ></app-self-building-square-spinner>
        
    <app-swapping-squares-spinner
      [animationDuration]="1000"
      [size]="65"
      [color]="'#ff1d5e'"
    ></app-swapping-squares-spinner>
     
    <app-fulfilling-bouncing-circle-spinner
      [animationDuration]="4000"
      [size]="60"
      [color]="'#ff1d5e'"
    ></app-fulfilling-bouncing-circle-spinner>
     
    <app-fingerprint-spinner
      [animationDuration]="1500"
      [size]="64"
      [color]="'#ff1d5e'"
    ></app-fingerprint-spinner>
     
    <app-spring-spinner
      [animationDuration]="3000"
      [size]="60"
      [color]="'#ff1d5e'"
    ></app-spring-spinner>
     
    <app-atom-spinner
      [animationDuration]="1000"
      [size]="60"
      [color]="'#ff1d5e'"
    ></app-atom-spinner>
     
    <app-looping-rhombuses-spinner
      [animationDuration]="2500"
      [rhombusSize]="15"
      [color]="'#ff1d5e'"
    ></app-looping-rhombuses-spinner>
     
    <app-breeding-rhombus-spinner
      [animationDuration]="2000"
      [size]="65"
      [color]="'#ff1d5e'"
    /><app-breeding-rhombus-spinner>

    Support?

    • Star the repo ⭐️
    • Create pull requests
    • Follow me on twitter @iamAfro

    License

    MIT license.

    Keywords

    none

    Install

    npm i angular-epic-spinners

    DownloadsWeekly Downloads

    461

    Version

    2.0.0

    License

    MIT

    Unpacked Size

    1.54 MB

    Total Files

    139

    Last publish

    Collaborators

    • iamafro