<script setup>
import ImageScan from "@/components/imageScan.vue";
import Card from "primevue/card";
</script>

<template>
<div class="upload-wrapper">
  <Card>
    <template #header>
      <img src="../../style/moss.jpg" alt="">
    </template>
    <template #title>
      <h1>Hello! Share your plant with us and we'll tell you all about it!</h1>
    </template>
    <template #content>
      <image-scan></image-scan>
    </template>
  </Card>

</div>
</template>

<style scoped>
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Playwrite+HU:wght@100..400&family=Roboto+Flex:opsz,wght@8..144,100..1000&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');


h1 {
  font-family: 'Playwrite HU', sans-serif;
  font-size: 2.5rem;
  margin-bottom: 1rem;
}

img {
  max-height: 5rem;
  width: 45rem;
  object-fit: cover;
  border-radius: 5px 5px 0 0;
}
</style>
