<template>
  <div class="slidev-layout about-me">
    <div class="flex items-center h-full">
      <div class="flex flex-col gap-4 w-1/2">
        <h1 class="text-6xl">Michael Hoffmann</h1>
        <span class="mt-4">Senior Frontend Developer</span>
        <ul>
          <li>Freelancer focused on Vue.js <logos-vue /></li>
          <li>+7 years of professional experience</li>
          <li>Munich, Germany 🇩🇪</li>
          <li>
            Weekly <logos-vue /> newsletter:
            <a href="https://weekly-vue.news">weekly-vue.news</a>
          </li>
          <li>
            Blog & Portfolio: <a href="https://mokkapps.de">mokkapps.de</a>
          </li>
          <li>
            Say hi at
            <a href="https://twitter.com/mokkapps"
              ><logos-twitter /> @mokkapps</a
            >
          </li>
        </ul>
      </div>
      <figure class="flex justify-center w-1/2">
        <img
          src="https://res.cloudinary.com/mokkapps/image/upload/v1670613615/website/profile-pic_copy_f2zwnt.png"
          class="bg-gray-400 rounded-full object-cover h-80 w-80 border border-8 border-secondary-400 z-10"
        />
      </figure>
    </div>
  </div>
</template>
