AnimatedPortrait

---
import { AnimatedPortrait } from '@santi020k/lumen-astro'

import portraitDummy from '../assets/portrait-dummy.jpg'
---

<AnimatedPortrait
  src={portraitDummy}
  alt="Portrait"
  showFloatingBadges
  badgeProps={{
    experience: { label: 'Experience', value: '5+ Years' },
    location: { label: 'Location', text: 'San Francisco, CA' }
  }}
/>

import { AnimatedPortrait } from '@santi020k/lumen-react'

export const Example = () => (
  <>
    <AnimatedPortrait
      src={portraitDummy}
      alt="Portrait"
      showFloatingBadges
      badgeProps={{
        experience: { label: 'Experience', value: '5+ Years' },
        location: { label: 'Location', text: 'San Francisco, CA' }
      }}
    />
  </>
)

<script type="module">
  import { defineLumenElements } from '@santi020k/lumen-elements/define'

  defineLumenElements()
</script>

<lumen-animated-portrait
  src={portraitDummy}
  alt="Portrait"
  showFloatingBadges
  badgeProps={{
    experience: { label: 'Experience', value: '5+ Years' },
    location: { label: 'Location', text: 'San Francisco, CA' }
  }}></lumen-animated-portrait>