<template>
  <aside>
    <p>Données basées sur la proposition du {{ frenchFormattedModified }}</p>
    <p>{{ page.designToLight.stepLabel }}</p>
  </aside>
</template>
<script setup>
import { storeToRefs } from "pinia";
import { usePageStore } from "../../stores/page";
import dayjs from "dayjs";
import "dayjs/locale/fr";

dayjs.locale("fr");

const { page } = storeToRefs(usePageStore());

const frenchFormattedModified = dayjs(page.value.designToLight.date).format(
  "dddd D MMMM YYYY"
);
</script>

<style scoped>
aside {
  position: fixed;
  right: 1rem;
  top: 1rem;
  bottom: 1rem;
  padding: 0.7rem;
  width: 30vw;
  border-radius: 1rem;
  background-color: #191919;
  color: #fff;
}
</style>
