- Add page header, card-wrapped sections, and surface-alt item cards to the account page for visual consistency with the rest of the app - Style CLI callback page with centered icon + heading layout matching the login page, with dark-mode-safe colors - Add dark mode variants to all error/success alerts on account page - Add check_circle icon for CLI callback success state
33 lines
1.5 KiB
HTML
33 lines
1.5 KiB
HTML
{% extends "base.html" %} {% import "partials/icons.html" as icons %}
|
|
{% block title %}Brewlog · CLI Authentication{% endblock %}
|
|
{% block content %}
|
|
<div class="mx-auto max-w-md">
|
|
<div class="rounded-lg border bg-surface p-6">
|
|
{% if token.is_some() %}
|
|
<div class="flex flex-col items-center text-center gap-3">
|
|
{% call icons::check_circle("h-10 w-10 text-emerald-600 dark:text-emerald-400") %}
|
|
<h1 class="text-2xl font-semibold text-accent">CLI Authenticated</h1>
|
|
<p class="text-sm text-text-secondary">
|
|
Your CLI has been authenticated successfully. You can close this window and return to the terminal.
|
|
</p>
|
|
</div>
|
|
{% else if error.is_some() %}
|
|
<div class="flex flex-col items-center text-center gap-3">
|
|
{% call icons::x_circle("h-10 w-10 text-red-600 dark:text-red-400") %}
|
|
<h1 class="text-2xl font-semibold text-accent">Authentication Failed</h1>
|
|
<div class="w-full rounded-md bg-red-100 border border-red-300 p-3 text-sm text-red-800 dark:bg-red-950/40 dark:border-red-800 dark:text-red-300">
|
|
{{ error.as_ref().unwrap() }}
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="flex flex-col items-center text-center gap-3">
|
|
{% call icons::spinner("h-10 w-10") %}
|
|
<h1 class="text-2xl font-semibold text-accent">CLI Authentication</h1>
|
|
<p class="text-sm text-text-secondary">
|
|
Processing authentication…
|
|
</p>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|