$UI.shadows = {
  '0': {
    // HACK: 'box-shadow none' does not work correctly on ios
    // it darkens all View component with background in project
    // and it blurs text when there is no background-color is set
    // therefore we using 'box-shadow 0 0 0 rgba(black, 0)'
    box-shadow: 0 0 0 rgba(black, 0)
    elevation: 0
  },
  '1': {
    box-shadow: 0 1px 2px rgba(black, 0.2)
    elevation: 3
  },
  '2': {
    box-shadow: 0 3px 5px rgba(black, 0.15)
    elevation: 6
  },
  '3': {
    box-shadow: 0 5px 8px rgba(black, 0.15)
    elevation: 12
  },
  '4': {
    box-shadow: 0 8px 12px rgba(black, 0.2)
    elevation: 18
  }
}

shadow(level = 1)
  _shadow = $UI.shadows['' + level]
  if (_shadow) {
    {_shadow}
  } else {
    error('ERROR! Wrong shadow level ' + level + ' passed to shadow() mixin. Such level does not exist in $UI.shadows')
  }