diff options
| author | mo khan <mo@mokhan.ca> | 2025-04-25 21:25:40 -0600 |
|---|---|---|
| committer | mo khan <mo@mokhan.ca> | 2025-04-28 09:07:31 -0600 |
| commit | 9b01d1616e130a589151bf1273e41181ecc727f4 (patch) | |
| tree | 639ec3b3c3857042a551c8e88b09413f590ebcec /app/views/dashboard | |
| parent | 13ab8de7d09b5d4b10132828277d17ba0543b901 (diff) | |
feat: use htmx to render partials
Diffstat (limited to 'app/views/dashboard')
| -rw-r--r-- | app/views/dashboard/nav.html.tmpl | 22 | ||||
| -rw-r--r-- | app/views/dashboard/show.html.tmpl | 18 |
2 files changed, 26 insertions, 14 deletions
diff --git a/app/views/dashboard/nav.html.tmpl b/app/views/dashboard/nav.html.tmpl new file mode 100644 index 0000000..59ff68b --- /dev/null +++ b/app/views/dashboard/nav.html.tmpl @@ -0,0 +1,22 @@ +<nav> + <ul> + <li><strong>SparkleLab✨</strong></li> + </ul> + <ul> + {{ if .IsLoggedIn }} + <li> + <a href="{{ .CurrentUser.ProfileURL }}"> + <img src="{{ .CurrentUser.Picture }}" /> + {{ .CurrentUser.Username }} + </a> + </li> + <li> + <form action="/session/destroy" method="post"> + <input type="submit" value="Logout"> + </form> + </li> + {{ else }} + <li><a href="/session/new">Login</a></li> + {{ end }} + </ul> +</nav> diff --git a/app/views/dashboard/show.html.tmpl b/app/views/dashboard/show.html.tmpl index 664777e..3a29dd3 100644 --- a/app/views/dashboard/show.html.tmpl +++ b/app/views/dashboard/show.html.tmpl @@ -6,28 +6,18 @@ <meta name="color-scheme" content="light dark"> <title>SparkleLab</title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"> + <script src="https://unpkg.com/htmx.org@2.0.4"></script> <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script> <script src="/application.js"></script> </head> <body> - <header class="container"> - <nav> - <ul> - <li><strong>SparkleLab✨</strong></li> - </ul> - <ul> - <li> - <form action="/session/destroy" method="post"> - <input type="submit" value="Logout"> - </form> - </li> - </ul> - </nav> + <header class="container" hx-get="/dashboard/nav" hx-trigger="load"> + <progress /> </header> <main id="app" class="container"> <form v-on:submit.prevent="submitSparkle"> - <label>/sparkle <input type="text" placeholder="@tanuki for helping me with my homework!" v-model="sparkle" /> </label> + <label>/sparkle <input type="text" placeholder="@tanuki for helping me with my homework!" v-model="sparkle" pattern="\s*(?<sparklee>@\w+)\s+(?<reason>.+)" required /> </label> <button type="submit" v-bind:disabled="isDisabled">✨ Sparkle</button> </form> <span class="error">${ errorMessage }</span> |