<script setup lang="ts">
import { defineRouteRules } from '#imports'

const config = useAppConfig()
const meta = {
  title: 'Enderman',
  description: config.description,
  image: `${config.url}/images/logo.png`,
  url: config.url,
}

useSeoMeta({
  title: meta.title,
  description: meta.description,
  ogTitle: meta.title,
  ogDescription: meta.description,
  ogImage: meta.image,
  ogUrl: meta.url,
  ogType: 'website',
  twitterTitle: meta.title,
  twitterDescription: meta.description,
  twitterImage: meta.image,
  twitterCard: 'summary',
})

useHead({
  title: 'Enderman',
  htmlAttrs: {
    lang: 'en',
  },
  link: [
    {
      rel: 'icon',
      type: 'image/x-icon',
      href: '/favicon.ico',
    },
  ],
})

defineRouteRules({
  sitemap: {
    changefreq: 'yearly',
    priority: 1,
  },
})
</script>

<template>
  <section class="page">
    <h3>Welcome 👋</h3>
    <p>
      I'm <strong>Enderman</strong> &ndash; a software engineer, a malware
      enthusiast and most importantly, a weird tall creature. I have over 300K
      subscribers on <a :href="`${config.shortener}/youtube`">YouTube</a> and
      over 25K followers on
      <a :href="`${config.shortener}/twitter`">Twitter</a>. Sometimes I wish
      there were 48 hours in a day.
    </p>
    <div class="flex flex-col md:flex-row gap-4">
      <div class="md:basis-0 md:flex-grow-[2]">
        <h6>What I do</h6>
        <ul class="list-style-type-do">
          <li>
            I develop cross-platform software. My language of choice is usually
            <strong>C/C++</strong> for desktop applications and any common
            backend stack with framework-loaded TypeScript for web. You can take
            a look at my code on
            <a :href="`${config.shortener}/github`">GitHub</a>.
          </li>
          <li>
            I have the most unnecessary, yet fascinating knowledge about
            Microsoft Windows, and I absolutely love sharing it with my viewers
            in an unorthodox comedic fashion.
            <sub>
              <em>*Microsoft still has not hired me as a software tester.</em>
            </sub>
          </li>
          <li>
            I research and analyze modern malware, educate computer users about
            it and preserve history. The repository can be found
            <a :href="`${config.shortener}/repository`">here</a>.
          </li>
          <li>I make videos for you to enjoy!</li>
        </ul>
      </div>
      <div class="md:basis-0 md:flex-grow-[1]">
        <h6>What I enjoy</h6>
        <ul class="list-style-type-enjoy">
          <li>Teaching</li>
          <li>Mathematics</li>
          <li>Technology</li>
          <li>Video Production</li>
          <li>Philosophy</li>
          <li>Geopolitics</li>
          <li>
            <a :href="`${config.shortener}/chess`">Chess</a>
          </li>
          <li>Solitude</li>
        </ul>
      </div>
    </div>
    <p>
      <strong>Want to learn more?</strong> Find out more about me using the
      navigation bar!<br />
      <em>See you there!~</em>
    </p>
  </section>
</template>
