<script setup lang="ts">
import { ref } from "vue";

const count = ref(0);
</script>

<template>
  <div class="app">
    <h1>{{ "{{ project_name }}" }}</h1>
    <p>Vue 3 + Litestar + Vite</p>
    <div class="card">
      <button type="button" @click="count++">count is {{ "{{ count }}" }}</button>
    </div>
  </div>
</template>

<style scoped>
.app {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2rem;
  text-align: center;
}

.card {
  padding: 2em;
}
</style>
