<script lang="ts">
  let name = 'World';
</script>

<main>
  <h1>Hello {name}!</h1>
  <p>Welcome to your Svelte frontend for Taiga</p>
  <p>This is a skeleton structure ready for your web app development.</p>
</main>

<style>
  main {
    text-align: center;
    padding: 1em;
    max-width: 240px;
    margin: 0 auto;
  }

  h1 {
    color: #ff3e00;
    text-transform: uppercase;
    font-size: 4em;
    font-weight: 100;
  }

  p {
    color: #333;
    margin: 1em 0;
  }

  @media (min-width: 640px) {
    main {
      max-width: none;
    }
  }
</style>