Channels

A utility component for displaying multiple channels.

Channels

Mail

Phone

+316 83485163

---
import Channels from 'fulldev-ui/components/Channels.astro'
---

<Channels
  channels={[
    {
      icon: 'mail',
      heading: 'Mail',
      text: '[email protected]',
      href: 'mailto:[email protected]',
    },
    {
      icon: 'phone',
      heading: 'Phone',
      text: '+316 83485163',
      href: 'tel:+31683485163',
    },
  ]}
/>

Props

Please reference src/components/Channels.astro for now.

Examples

`variant`

Mail

[email protected]

Phone

+316 83485163

---
import Channels from 'fulldev-ui/components/Channels.astro'
---

<Channels
  variant="primary"
  channels={[
    {
      icon: 'mail',
      heading: 'Mail',
      text: '[email protected]',
      href: 'mailto:[email protected]',
    },
    {
      icon: 'phone',
      heading: 'Phone',
      text: '+316 83485163',
      href: 'tel:+31683485163',
    },
  ]}
/>

`size`

Mail

[email protected]

Phone

+316 83485163

---
import Channels from 'fulldev-ui/components/Channels.astro'
---

<Channels
  size="sm"
  channels={[
    {
      icon: 'mail',
      heading: 'Mail',
      text: '[email protected]',
      href: 'mailto:[email protected]',
    },
    {
      icon: 'phone',
      heading: 'Phone',
      text: '+316 83485163',
      href: 'tel:+31683485163',
    },
  ]}
/>