User Badge

This kit was created to display employee icons related to a Nitro user. Currently there is the PVI logo and the Million Dollar Rep Icon.

Default

Use these to represent what affiliation an employee has.

Code Example

import React from 'react'

import UserBadge from '../_user_badge'

const UserBadgeDefault = () => {
  return (
    <div>
      <div>
        <UserBadge
            badge="veteran"
            size="md"
        />
      </div>
      <br />
      <br />
      <div>
        <UserBadge
            badge="million-dollar"
            size="md"
        />
      </div>
    </div>
  )
}

export default UserBadgeDefault

Sizes

Code Example

import React from 'react'

import UserBadge from '../_user_badge'

const UserBadgeSize = () => {
  return (
    <div>
      <div>
        <UserBadge
            badge="veteran"
            size="sm"
        />
      </div>
      <br />
      <br />
      <div>
        <UserBadge
            badge="veteran"
            size="md"
        />
      </div>
      <br />
      <br />
      <div>
        <UserBadge
            badge="veteran"
            size="lg"
        />
      </div>
    </div>
  )
}

export default UserBadgeSize

Things To Avoid

Don’t use this to replace icon kit.