Peaceultime/obsidian-visualiser
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add Collapsible, Avatar and Loading

Browse Source
This commit is contained in:
Peaceultime
2024-10-31 13:59:29 +01:00
parent cbce979aa9
commit bd32d176b1
9 changed files with 113 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
pages/index.vue
View File

@@ -8,16 +8,24 @@ const open = ref(false), username = ref(""), price = ref(750), disabled = ref(fa
</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" v-model="disabled" />
<SliderInput :disabled="disabled" :label="`Prix: ${price.toFixed(2)}€`" :min="0" :max="1500" :step="0.25"
v-model="price" />
<TextInput label="Saisir un pseudonyme" :disabled="disabled" v-model="username" />
<NumberPicker label="Age" :disabled="disabled" />
<Loading />
<Collapsible label="Options">
<div class="flex flex-col">
<Switch label="Test" v-model="disabled" />
<SliderInput :disabled="disabled" :label="`Prix: ${price.toFixed(2)}€`" :min="0" :max="1500" :step="0.25"
v-model="price" />
<TextInput label="Saisir un pseudonyme" :disabled="disabled" v-model="username" />
<NumberPicker label="Age" :disabled="disabled" />
</div>
</Collapsible>
<Separator decorative orientation="horizontal" class="h-px w-96 my-2 bg-light-30 dark:bg-dark-30" />
<HoverCard>
<span>Texte</span>
<template v-slot:content>
<div>Test de HoverCard</div>
<div>
<Avatar src="public/logo.svg" icon="radix-icons:question-mark"/>
<span class="text-xl font-light px-4">Dice[any]</span>
</div>
</template>
</HoverCard>
<Dialog label="Open" title="Titre" description="Description courte de la popup">