Atoms

Atoms are tiny components

block-link

Usage : block-link
Options :
  • label - String
  • url - String
My block link 


  My block link

button

Usage : button
Options :
  • label - String

button-emergency

Usage : button-emergency
Options :
  • label - String

button-link

Usage : button-link
Options :
  • label - String
  • url - String
  • theme - String (default primary, succes, warning, ...)
My button 



  My button

chevron

Usage : chevron
Options :
  • direction - String (right (default), down, left or up)
  • classes - String (separate by spaces)

iconed-item

Usage : iconed-item
Options :
  • theme - String
  • icon - String
  • heading - String
  • desc - String

label

Usage : label
Options :
  • label - String
My label 


  My label

phone

Usage : phone
Options :
  • number - String (ex: 021 473 17 31)
021 473 17 31 


  
  021 473 17 31

search-field

Usage : search-field

shadow-separator

Usage : shadow-separator

Can be also applied to blocks using the classes .shadow-separator combined, if needed, with .shadow-separator-left, .shadow-separator-right, .shadow-separator-bottom or .shadow-separator-top. Warning, can be only left + right or top + bottom, not left + top, we have only 2 pseudo-element per block

video

Usage : video