refactor: migrate and consolidate UI templates to compile-time Askama component macros

This commit is contained in:
2026-05-30 12:28:47 +05:00
parent f42a5f05b2
commit 110fc61fa2
16 changed files with 697 additions and 598 deletions
+5 -15
View File
@@ -1,4 +1,5 @@
{% extends "base.html" %}
{% import "components/macros.html" as ui %}
{% block title %}Edit Developer - Stick{% endblock %}
@@ -13,28 +14,17 @@
</div>
<form action="/developers/{{ developer.id.unwrap().to_hex() }}/edit" method="post" class="space-y-5">
<div>
<label for="name" class="block text-sm font-medium text-slate-400 mb-1.5">Name</label>
<input id="name" name="name" type="text" value="{{ developer.name }}" required class="appearance-none rounded-xl relative block w-full px-4 py-3 bg-[#0f172a]/80 border border-slate-800 placeholder-slate-500 text-white focus:outline-none focus:ring-2 focus:ring-sky-500 focus:border-sky-500 transition duration-200 text-sm">
</div>
{{ ui::text_input(id="name", name="name", label="Name", type="text", placeholder="Name", value=developer.name, required=true) }}
<div>
<label for="email" class="block text-sm font-medium text-slate-400 mb-1.5">Email</label>
<input id="email" name="email" type="email" value="{{ developer.email }}" required class="appearance-none rounded-xl relative block w-full px-4 py-3 bg-[#0f172a]/80 border border-slate-800 placeholder-slate-500 text-white focus:outline-none focus:ring-2 focus:ring-sky-500 focus:border-sky-500 transition duration-200 text-sm">
</div>
{{ ui::text_input(id="email", name="email", label="Email", type="email", placeholder="Email", value=developer.email, required=true) }}
<div>
<label for="skills" class="block text-sm font-medium text-slate-400 mb-1.5">Skills (Comma-separated)</label>
<input id="skills" name="skills" type="text" value='{{ developer.skills.join(", ") }}' class="appearance-none rounded-xl relative block w-full px-4 py-3 bg-[#0f172a]/80 border border-slate-800 placeholder-slate-500 text-white focus:outline-none focus:ring-2 focus:ring-sky-500 focus:border-sky-500 transition duration-200 text-sm">
</div>
{{ ui::text_input(id="skills", name="skills", label="Skills (Comma-separated)", type="text", placeholder="Skills", value=developer.skills.join(", ")) }}
<div class="flex gap-4 pt-2">
<a href="/developers" class="flex-1 py-3 px-4 text-center text-sm font-semibold rounded-xl text-slate-300 bg-slate-900 border border-slate-800 hover:border-slate-700 transition">
Cancel
</a>
<button type="submit" class="flex-1 py-3 px-4 text-sm font-semibold rounded-xl text-white bg-gradient-to-r from-sky-500 to-indigo-600 hover:opacity-95 transition shadow-lg shadow-sky-500/10">
Save Changes
</button>
{{ ui::button(label="Save Changes", variant="indigo", type="submit", extra_class="flex-1 py-3 bg-gradient-to-r from-sky-500 to-indigo-600 hover:opacity-95 transition shadow-lg shadow-sky-500/10") }}
</div>
</form>
</div>
+5 -15
View File
@@ -1,4 +1,5 @@
{% extends "base.html" %}
{% import "components/macros.html" as ui %}
{% block title %}Developers - Stick{% endblock %}
@@ -30,24 +31,13 @@
Add Developer
</h3>
<form action="/developers" method="post" class="space-y-4">
<div>
<label for="name" class="block text-xs font-semibold text-slate-400 mb-1.5">Name</label>
<input id="name" name="name" type="text" required class="appearance-none rounded-xl relative block w-full px-4 py-2.5 bg-[#0f172a]/80 border border-slate-800 placeholder-slate-500 text-white focus:outline-none focus:ring-2 focus:ring-sky-500 focus:border-sky-500 transition duration-200 text-sm" placeholder="e.g. Alice Smith">
</div>
{{ ui::text_input(id="name", name="name", label="Name", type="text", placeholder="e.g. Alice Smith", required=true) }}
<div>
<label for="email" class="block text-xs font-semibold text-slate-400 mb-1.5">Email</label>
<input id="email" name="email" type="email" required class="appearance-none rounded-xl relative block w-full px-4 py-2.5 bg-[#0f172a]/80 border border-slate-800 placeholder-slate-500 text-white focus:outline-none focus:ring-2 focus:ring-sky-500 focus:border-sky-500 transition duration-200 text-sm" placeholder="e.g. alice@company.com">
</div>
{{ ui::text_input(id="email", name="email", label="Email", type="email", placeholder="e.g. alice@company.com", required=true) }}
<div>
<label for="skills" class="block text-xs font-semibold text-slate-400 mb-1.5">Skills (Comma-separated)</label>
<input id="skills" name="skills" type="text" class="appearance-none rounded-xl relative block w-full px-4 py-2.5 bg-[#0f172a]/80 border border-slate-800 placeholder-slate-500 text-white focus:outline-none focus:ring-2 focus:ring-sky-500 focus:border-sky-500 transition duration-200 text-sm" placeholder="e.g. Rust, Axum, MongoDB">
</div>
{{ ui::text_input(id="skills", name="skills", label="Skills (Comma-separated)", type="text", placeholder="e.g. Rust, Axum, MongoDB") }}
<button type="submit" class="w-full py-3 px-4 text-sm font-semibold rounded-xl text-white bg-gradient-to-r from-sky-500 to-indigo-600 hover:opacity-95 transition shadow-md shadow-sky-500/10">
Create Developer
</button>
{{ ui::button(label="Create Developer", variant="indigo", type="submit", extra_class="w-full py-3 bg-gradient-to-r from-sky-500 to-indigo-600 hover:opacity-95 transition shadow-md shadow-sky-500/10") }}
</form>
</div>
</div>