Progressing on the components with the Slider and the Switch

This commit is contained in:
2024-10-29 17:36:15 +01:00
parent 97f8ca499a
commit f4f4be6b27
6 changed files with 48 additions and 5 deletions

View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
const open = ref(false), username = ref("");
const open = ref(false), username = ref(""), price = ref(750);
</script>
<template>
@@ -8,6 +8,8 @@ const open = ref(false), username = ref("");
</Head>
<div class="h-100 w-100 flex flex-1 flex-col justify-center items-center">
<div class="w-1/2 flex flex-1 flex-col justify-center items-center">
<Switch label="Test" />
<SliderInput class="flex-col" :label="`Prix: ${price.toFixed(2)}€`" :min="0" :max="1500" :step="0.25" v-model="price" />
<TextInput label="Saisir un pseudonyme" v-model="username" />
<Separator decorative orientation="horizontal" class="h-px w-96 my-2 bg-light-30 dark:bg-dark-30" />
<Tooltip message="Vas y, ajoute stp" side="top"><button @click="open = !!username && !open" class="text-3xl font-extralight tracking-wide text-light-60 dark:text-dark-60">Ajouter</button></Tooltip>