Update help text demo to use message

pull/6674/head
Cagatay Civici 2024-10-28 15:16:23 +03:00
parent 53b0282bd0
commit 2a0f3cb26a
1 changed files with 5 additions and 5 deletions

View File

@ -1,12 +1,12 @@
<template> <template>
<DocSectionText v-bind="$attrs"> <DocSectionText v-bind="$attrs">
<p>An advisory text can be defined with the semantic <i>small</i> tag.</p> <p>An advisory text can be defined with the <NuxtLink to="/message">Message</NuxtLink> component.</p>
</DocSectionText> </DocSectionText>
<div class="card flex justify-center"> <div class="card flex justify-center">
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
<label for="username">Username</label> <label for="username">Username</label>
<InputText id="username" v-model="value" aria-describedby="username-help" /> <InputText id="username" v-model="value" aria-describedby="username-help" />
<small id="username-help">Enter your username to reset your password.</small> <Message size="small" severity="secondary" variant="simple">Enter your username to reset your password.</Message>
</div> </div>
</div> </div>
<DocSectionCode :code="code" /> <DocSectionCode :code="code" />
@ -22,7 +22,7 @@ export default {
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
<label for="username">Username</label> <label for="username">Username</label>
<InputText id="username" v-model="value" aria-describedby="username-help" /> <InputText id="username" v-model="value" aria-describedby="username-help" />
<small id="username-help">Enter your username to reset your password.</small> <Message size="small" severity="secondary" variant="simple">Enter your username to reset your password.</Message>
</div> </div>
`, `,
options: ` options: `
@ -31,7 +31,7 @@ export default {
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
<label for="username">Username</label> <label for="username">Username</label>
<InputText id="username" v-model="value" aria-describedby="username-help" /> <InputText id="username" v-model="value" aria-describedby="username-help" />
<small id="username-help">Enter your username to reset your password.</small> <Message size="small" severity="secondary" variant="simple">Enter your username to reset your password.</Message>
</div> </div>
</div> </div>
</template> </template>
@ -52,7 +52,7 @@ export default {
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
<label for="username">Username</label> <label for="username">Username</label>
<InputText id="username" v-model="value" aria-describedby="username-help" /> <InputText id="username" v-model="value" aria-describedby="username-help" />
<small id="username-help">Enter your username to reset your password.</small> <Message size="small" severity="secondary" variant="simple">Enter your username to reset your password.</Message>
</div> </div>
</div> </div>
</template> </template>