fix: add Enter key handlers to all auth and nickname inputs
Pressing Enter on the username field in login/register or the nickname field in the join-game prompt now submits the form, matching user expectations. Also add *.templ to the gitignore allowlist.
This commit is contained in:
60
features/common/components/shared.templ
Normal file
60
features/common/components/shared.templ
Normal file
@@ -0,0 +1,60 @@
|
||||
package components
|
||||
|
||||
import "github.com/starfederation/datastar-go/datastar"
|
||||
|
||||
templ BackToLobby() {
|
||||
<a class="link text-sm opacity-70" href="/">← Back</a>
|
||||
}
|
||||
|
||||
templ StealthTitle(class string) {
|
||||
<span class={ class }>
|
||||
<span style="color:#4a2a3a">●</span>
|
||||
<span style="color:#2a4545">●</span>
|
||||
<span style="color:#4a2a3a">●</span>
|
||||
<span style="color:#2a4545">●</span>
|
||||
</span>
|
||||
}
|
||||
|
||||
templ NicknamePrompt(returnPath string) {
|
||||
<main class="max-w-sm mx-auto mt-8 text-center" data-signals="{nickname: ''}">
|
||||
<h1 class="text-3xl font-bold">Join Game</h1>
|
||||
<p class="mb-4">Enter your nickname to join the game.</p>
|
||||
<form>
|
||||
<fieldset class="fieldset">
|
||||
<label class="label" for="nickname">Your Nickname</label>
|
||||
<input
|
||||
class="input input-bordered w-full"
|
||||
id="nickname"
|
||||
type="text"
|
||||
placeholder="Enter your nickname"
|
||||
data-bind="nickname"
|
||||
data-on:keydown.key_enter={ datastar.PostSSE("%s", returnPath) }
|
||||
required
|
||||
autofocus
|
||||
/>
|
||||
</fieldset>
|
||||
<button
|
||||
class="btn btn-primary w-full"
|
||||
type="button"
|
||||
data-on:click={ datastar.PostSSE("%s", returnPath) }
|
||||
>
|
||||
Join
|
||||
</button>
|
||||
</form>
|
||||
</main>
|
||||
}
|
||||
|
||||
templ GameJoinPrompt(loginURL string, registerURL string, gamePath string) {
|
||||
<main class="max-w-sm mx-auto mt-8 text-center">
|
||||
<h1 class="text-3xl font-bold">Join Game</h1>
|
||||
<p class="mb-4">Log in to track your game history, or continue as a guest.</p>
|
||||
<div class="flex flex-col gap-2 my-4">
|
||||
<a class="btn btn-primary w-full" href={ templ.SafeURL(loginURL) }>Login</a>
|
||||
<a class="btn btn-secondary w-full" href={ templ.SafeURL(gamePath + "?guest=1") }>Continue as Guest</a>
|
||||
</div>
|
||||
<p class="text-sm opacity-60">
|
||||
Don't have an account?
|
||||
<a class="link" href={ templ.SafeURL(registerURL) }>Register</a>
|
||||
</p>
|
||||
</main>
|
||||
}
|
||||
Reference in New Issue
Block a user