59 lines
2.5 KiB
HTML
59 lines
2.5 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Register — Meal Tracker{% endblock %}
|
|
{% block content %}
|
|
<div class="form-card register-card">
|
|
<h2>Create Account</h2>
|
|
<form method="POST">
|
|
<label for="username">Username</label>
|
|
<input type="text" id="username" name="username" required autofocus>
|
|
|
|
<label for="password">Password</label>
|
|
<input type="password" id="password" name="password" required>
|
|
|
|
<label for="confirm">Confirm Password</label>
|
|
<input type="password" id="confirm" name="confirm" required>
|
|
|
|
<fieldset class="household-section">
|
|
<legend>Household</legend>
|
|
|
|
<label class="radio-label">
|
|
<input type="radio" name="household_action" value="join" checked
|
|
onchange="document.getElementById('join-block').hidden=false;
|
|
document.getElementById('create-block').hidden=true;">
|
|
Join an existing household
|
|
</label>
|
|
<div id="join-block" class="household-block">
|
|
<select name="household_id" class="select-input">
|
|
<option value="">— Select —</option>
|
|
{% for h in households %}
|
|
<option value="{{ h.id }}">{{ h.name }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
{% if not households %}
|
|
<p class="hint">No households yet. Create one below!</p>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<label class="radio-label">
|
|
<input type="radio" name="household_action" value="create"
|
|
onchange="document.getElementById('join-block').hidden=true;
|
|
document.getElementById('create-block').hidden=false;"
|
|
{% if not households %}checked{% endif %}>
|
|
Create a new household
|
|
</label>
|
|
<div id="create-block" class="household-block" hidden>
|
|
<input type="text" name="new_household_name"
|
|
placeholder="Household name (e.g. The Smiths)"
|
|
class="text-input">
|
|
<p class="hint">You'll be the admin of this household.</p>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<button type="submit" class="btn btn-primary">Register</button>
|
|
</form>
|
|
<p class="form-footer">
|
|
Already have an account? <a href="{{ url_for('auth.login') }}">Log in</a>
|
|
</p>
|
|
</div>
|
|
{% endblock %}
|