sidepanel.pug

#side-panel
  #pp
  #name= fullname
  hr
  // Personal Info
  table
    thead
      tr
        th Personal Information
    tbody
      each contact in contacts
        tr
          td.side-icon(style=`background-image:url('assets/side/${contact.icon}');`)
            if contact.link
              a(href=contact.link) #{contact.text}
            else
              | #{contact.text}
  hr
  // Links
  table
    thead
      tr
        th Links
    tbody
      each link in links
        tr
          td.side-icon(style=`background-image:url('assets/side/${link.icon}');`)
              a(href=link.link) #{link.text}
  hr
  // Languages
  .side-title Languages
  .w-full.grid.grid-cols-2.gap-2
    each language in languages
      .skill-box.side-icon(style=`background-image:url('assets/side/${language.icon}');`) #{language.text}
  hr
  // Hobbies
  table
    thead
      tr
        th Hobbies
    tbody
      each hobby in hobbies
        tr
          td.side-icon(style=`background-image:url('assets/side/${hobby.icon}');`)= hobby.text
  hr
  // QR Codes
  .flex-1
  .w-full.flex.items-center.mt-2.gap-2
    img(src="assets/side/qr.png").w-12
    .w-full.text-center Visit my portfolio!