---
import Layout from "../layouts/Layout.astro";
import "../styles/home.scss";
import { Icon } from "astro-icon/components";
---

<Layout
  title="Home"
  description="This is my personal website with my projects, docs and other useful stuff."
>
  <div class="lines">
    <div class="home-main-box">
      <div class="home-title-box">
        <h1 class="home-title">vaporvee</h1>
        <h2 class="home-title home-subtitle">web & game developer</h2>
        <a href="/projects">
          <button class="continue"
            >To my Projects<Icon
              size={35}
              class="icon"
              name="typcn:arrow-right-outline"
            />
          </button>
        </a>
      </div>
      <div class="content">
        <div class="avatar portrait"><div class="avatar"></div></div>
        <p>
          Hello my name is <b>Yannik</b>!<br />
          I’m a <b> web and game developer</b> living <b>in Germany</b>.<br />
          <br /><br />
          My primary tools: React, Vue, TypeScript, Godot Engine's GDScript, Golang.
          <br />
          While I have some preferred tools, I always choose the best one for the
          job, even if it's not on my usual list. My goal is to find the right solution
          for each project.
          <br />
          Beyond coding I'm passionate about design, making games / stories, music
          and cooking.
        </p>
      </div>
    </div>
  </div>
</Layout>
