<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
  <title>am3lia</title>
  <link rel="stylesheet" href="https://use.typekit.net/fdg6nge.css">
  <link rel="stylesheet" href="src/style.css">
</head>

<body>
  <main>
    <div class="decoration"><img src="am3lia.jpg" alt=""></div>
    <article>
      <header>
        <h1>Welcome, the entire land.</h1>
        <p>Hi, my name is Amélia.</p>
      </header>
      <figure class="card">
        <h2 class="sr-only age">Age - What is a day to me?</h2>
        <p>I was born <data class="days-of-age" value></data><noscript>a few</noscript> days ago.</p>
        <p><strong>One full day</strong> represents roughly <data class="day-percentage" value></data><noscript>a small
            percentage</noscript> of my life so far.</p>

        <div class="lifeBar">
          <div class="dayBar day-width">
            <data class="day-percentage" value></data>
          </div>
        </div>
        <figcaption>How much is a day in my life, thus far?</figcaption>
      </figure>
      <div class="card card--small">
        <h2><span class="sr-only">Elsewhere -</span> Where else can you find me?</h2>
        <p><abbr title="Cardano Non Fungible Tokens (NFT)">CNFT</abbr> collection will be here: <a
            href="https://handle.me/am3lia">$am3lia</a> (<a href="https://pool.pm/$am3lia">pool.pm</a>).</p>
        <p>Shoot me an email to: <a href="mailto:am3lia@andr3.net">am3lia@andr3.net</a>. My parents will read them until
          I'm old enough, though.</p>
      </div>
      <p>Note: This page is a placeholder built by my parents while I grow old enough to learn HTML.</p>
    </article>
  </main>

  <hr>

  <footer>
    <p>Licensed as <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/2.0/">cc-by-nc-sa 2.0</a>.
      &mdash; Authored by am3lia's parents with <em class="emoji">❤️</em> in 2022 &mdash;
      v0.2</p>
  </footer>
  <script src="src/index.js"></script>
</html>
