40 lines
No EOL
1.4 KiB
HTML
40 lines
No EOL
1.4 KiB
HTML
{% extends 'base.html' %}
|
|
{% load crispy_forms_tags i18n %}
|
|
|
|
{% block title %}Add Friend Code{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container mx-auto max-w-md mt-6">
|
|
<h1 class="text-3xl font-bold mb-4">Add Friend Code</h1>
|
|
<form method="post" class="space-y-4">
|
|
{% csrf_token %}
|
|
{{ form.non_field_errors }}
|
|
<div>
|
|
<label for="{{ form.friend_code.id_for_label }}" class="block font-medium">{{ form.friend_code.label }}</label>
|
|
{{ form.friend_code }}
|
|
{{ form.friend_code.errors }}
|
|
</div>
|
|
<div>
|
|
<label for="{{ form.in_game_name.id_for_label }}" class="block font-medium">{{ form.in_game_name.label }}</label>
|
|
{{ form.in_game_name }}
|
|
{{ form.in_game_name.errors }}
|
|
</div>
|
|
<button type="submit" class="btn btn-primary w-full">{% trans "Add Friend Code" %}</button>
|
|
</form>
|
|
|
|
</div>
|
|
|
|
<!-- Include Cleave Zen from a CDN -->
|
|
<script src="https://unpkg.com/cleave-zen@0.0.17/dist/cleave-zen.umd.js"></script>
|
|
<script defer>
|
|
document.addEventListener('DOMContentLoaded', function(){
|
|
// Initialize Cleave Zen on the friend code input field.
|
|
// Make sure that the input ID is correct (e.g., provided by Django's widget rendering).
|
|
cleaveZen('#id_friend_code', {
|
|
delimiters: ['-', '-', '-'], // Inserts dashes between the blocks.
|
|
blocks: [4, 4, 4, 4],
|
|
numericOnly: true
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %} |