Vebego Component Library

Icon: Spinning icon 

<span class="atm-icon  far fa-external-link fa-spin  "></span>
 
{{#if icon}}{{#if style}}<span class="atm-icon {{modifier}} {{style}} {{icon}} {{rotation}} {{size}} {{#if fixedWidth}}fa-fw{{/if}}"></span>{{/if}}{{/if}}
 
{
  "icon": "fa-external-link",
  "style": "far",
  "size": "",
  "rotation": "fa-spin",
  "fixedWidth": false,
  "modifier": ""
}

The icon component uses Font Awesome for displaying icons. The icon component supports different style, rotation and size variants.

Style variants

  • far : regular icons, which is the default value
  • fab : brand icons
  • fas : solid icons
  • fal : light icons
  • fad : duotone icons

Rotation variants

  • fa-rotate-90 : rotates the icon 90 degrees clockwise
  • fa-rotate-180 : rotates the icon 180 degrees clockwise
  • fa-rotate-270 : rotates the icon 270 degrees clockwise
  • fa-flip-horizontal : flips the icon horizontally
  • fa-flip-vertical : flips the icon vertically
  • fa-spin : spins the icon
  • fa-pulse : rotates the icon in 8 steps

Size variants

  • fa-xs : extra small
  • fa-ms : medium small
  • fa-lg : large
  • fa-2x : double size
  • fa-3x : triple size
  • fa-4x : quadruple size