Person card

In progress

Person card

# Person card in search panel box (with image)

  <hy-person-card
    variant="search-panel"
    category-title="People"
    image-url="https://flamma.helsinki.fi/documents/20142/1322159/upload_00015721.jpg"
    image-alt="professor"
    first-name="Dolor"
    last-name="Sit-amet"
    url="https://www.helsinki.fi/sv/people/people-finder/person-by-id/9038938"
    sc-label="Link opens up in a new tab"
    position-title="Postdoctoral Researcher"
    department="DEPARTMENT OF BIOCHEMISTRY AND DEVELOPMENTAL BIOLOGY"
    field="Fields of science: Biochemistry, cell and molecular biology"
    email="lorem.ipsumlorem@helsinki.fi"
    phone="0212345678"
  >
  </hy-person-card>

# Person card in search panel box (without image)

<hy-person-card
          variant="search-panel"
          category-title="People"
          first-name="Paula"
          last-name="Elomaa"
          url="https://www.helsinki.fi/sv/people/people-finder/person-by-id/9038938"
          is-external="true"
          position-title="professor"
          department="Agrikultur-forstvetenskapliga fakulteten"
          email="paula.elomaa@helsinki.fi"
          phone="0504480427"
        >
        </hy-person-card>

# Person card in search results (with image)

    <hy-person-card
      category-title="People"
      image-url="https://flamma.helsinki.fi/documents/20142/1322159/upload_00015721.jpg"
      image-alt="professor"
      first-name="Dolor"
      last-name="Sit-amet"
      url="https://www.helsinki.fi/sv/people/people-finder/person-by-id/9038938"
      is-external="true"
      sc-label="Link opens up in a new tab"
      position-title="Postdoctoral Researcher"
      department="DEPARTMENT OF BIOCHEMISTRY AND DEVELOPMENTAL BIOLOGY"
      field="Fields of science: Biochemistry, cell and molecular biology"
      email="lorem.ipsumlorem@helsinki.fi"
      phone="0212345678"
    >
    </hy-person-card>

# Person card in search results (without image)

    <hy-person-card
      category-title="People"
      first-name="Paula"
      last-name="Elomaa"
      url="https://www.helsinki.fi/sv/people/people-finder/person-by-id/9038938"
      position-title="professor"
      department="Agrikultur-forstvetenskapliga fakulteten"
      email="paula.elomaa@helsinki.fi"
      phone="0504480427"
    >
    </hy-person-card>

# Properties

Property Attribute Description Type Default
categoryTitle category-title Category. For example, People string undefined
department department Department string undefined
email email Email string undefined
field field Branch where person works string undefined
firstName first-name First name string undefined
imageAlt image-alt Image alt text string undefined
imageUrl image-url Image url. If not provided, initials are shown string undefined
isExternal is-external Is url external or internal. Pass "true" if external boolean false
lastName last-name Last name string undefined
phone phone Phone string undefined
positionTitle position-title Job title string undefined
scLabel sc-label Aria label value string undefined
url url Url to person's page string undefined
variant variant Variant defines if card is in search panel or in search results. Pass "search-panel" to style for search panel box. PersonCardVariants.default \| PersonCardVariants.searchPanel PersonCardVariants.default

# Dependencies

# Depends on

Helsinki University Design System

← Row →