style: reorder v-model and v-bind directives

Changes:
- Move v-model directives before other attributes
- Move v-bind directives before event handlers
- Reorder attributes for better readability
- Fix template attribute ordering across components
- Improve eslint rules
- add default vite config for testing (handles nostr error too)
This follows Vue.js style guide recommendations for attribute
ordering and improves template consistency.
This commit is contained in:
Matthew Raymer
2025-02-26 09:27:04 +00:00
parent f6802cd160
commit 3b4f4dc125
62 changed files with 487 additions and 408 deletions

View File

@@ -25,8 +25,9 @@
<h2 class="text-xl font-bold mb-4">Notiwind Alerts</h2>
<button
class="font-bold capitalize bg-slate-900 text-white px-3 py-2 rounded-md mr-2"
@click="
this.$notify(
$notify(
{
group: 'alert',
type: 'toast',
@@ -36,14 +37,14 @@
5000,
)
"
class="font-bold capitalize bg-slate-900 text-white px-3 py-2 rounded-md mr-2"
>
Toast
</button>
<button
class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
@click="
this.$notify(
$notify(
{
group: 'alert',
type: 'info',
@@ -53,14 +54,14 @@
5000,
)
"
class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
>
Info
</button>
<button
class="font-bold capitalize bg-emerald-600 text-white px-3 py-2 rounded-md mr-2"
@click="
this.$notify(
$notify(
{
group: 'alert',
type: 'success',
@@ -70,14 +71,14 @@
5000,
)
"
class="font-bold capitalize bg-emerald-600 text-white px-3 py-2 rounded-md mr-2"
>
Success
</button>
<button
class="font-bold capitalize bg-amber-600 text-white px-3 py-2 rounded-md mr-2"
@click="
this.$notify(
$notify(
{
group: 'alert',
type: 'warning',
@@ -87,14 +88,14 @@
5000,
)
"
class="font-bold capitalize bg-amber-600 text-white px-3 py-2 rounded-md mr-2"
>
Warning
</button>
<button
class="font-bold capitalize bg-rose-600 text-white px-3 py-2 rounded-md mr-2"
@click="
this.$notify(
$notify(
{
group: 'alert',
type: 'danger',
@@ -104,14 +105,14 @@
5000,
)
"
class="font-bold capitalize bg-rose-600 text-white px-3 py-2 rounded-md mr-2"
>
Danger
</button>
<button
class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
@click="
this.$notify(
$notify(
{
group: 'modal',
type: 'notification-permission',
@@ -121,14 +122,14 @@
-1,
)
"
class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
>
Notif ON
</button>
<button
class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
@click="
this.$notify(
$notify(
{
group: 'modal',
type: 'notification-mute',
@@ -138,14 +139,14 @@
-1,
)
"
class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
>
Notif MUTE
</button>
<button
class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
@click="
this.$notify(
$notify(
{
group: 'modal',
type: 'notification-off',
@@ -155,7 +156,6 @@
-1,
)
"
class="font-bold capitalize bg-slate-600 text-white px-3 py-2 rounded-md mr-2"
>
Notif OFF
</button>
@@ -190,8 +190,8 @@
<div>
Register Passkey
<button
@click="register()"
class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
@click="register()"
>
Simplewebauthn
</button>
@@ -200,14 +200,14 @@
<div>
Create JWT
<button
@click="createJwtSimplewebauthn()"
class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
@click="createJwtSimplewebauthn()"
>
Simplewebauthn
</button>
<button
@click="createJwtNavigator()"
class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
@click="createJwtNavigator()"
>
Navigator
</button>
@@ -216,28 +216,28 @@
<div v-if="jwt">
Verify New JWT
<button
@click="verifySimplewebauthn()"
class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
@click="verifySimplewebauthn()"
>
Simplewebauthn
</button>
<button
@click="verifyWebCrypto()"
class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
@click="verifyWebCrypto()"
>
WebCrypto
</button>
<button
@click="verifyP256()"
class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
@click="verifyP256()"
>
p256 - broken
</button>
</div>
<div v-else>Verify New JWT -- requires creation first</div>
<button
@click="verifyMyJwt()"
class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
@click="verifyMyJwt()"
>
Verify Hard-Coded JWT
</button>
@@ -248,8 +248,8 @@
See console for more output.
<div>
<button
@click="testEncryptionDecryption()"
class="font-bold capitalize bg-slate-500 text-white px-3 py-2 rounded-md mr-2"
@click="testEncryptionDecryption()"
>
Run Test
</button>