daab6750fe
Bring the terminal dev-tool/OSS-docs theme to full Wave A OVERRIDE-CONTRACT compliance. - 49 mandatory builtin overrides in templates/overrides/terminal/ (TTY chrome, re-skinned from the frozen builtin defaults; every content field, provider var, custom tag, data-bn-* attr and inline script preserved verbatim). - 7 page templates (default, full-width, landing, article, blog-index, contact, auth) with TTY-window chrome, man-page article layout, and theme_mode-driven light/dark switching. - GO BIG motion: dependency-free ASCII glyph-rain canvas on the hero override only (lazy-init, prefers-reduced-motion honored, static phosphor fallback). - 4 persona blocks (manpage_header, code_console, keybind_table, boot_log); ascii_header/toc/footer blocks retired in favour of overrides + template furniture. - 5 dual-mode presets (mode "both", all 19 tokens) with intentional paper-teletype light and phosphor dark sides. - Bundled OFL mono fonts (JetBrains Mono, IBM Plex Mono) with LICENSES record; all font-family via var(--font-heading|body|mono, fallback). - Themed email-safe wrapper (retained), master pages, and a seeded "grid" OSS dev-tool demo site (home, about, changelog + 3 posts, contact with row_inserted -> email-admins workflow, login). - Declared required_icon_packs = [lucide, simple-icons]. Verified: make build exit 0, make verify exit 0, check-safety exit 0. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
78 lines
7.1 KiB
Plaintext
78 lines
7.1 KiB
Plaintext
{# auth-form terminal override — reproduces the builtin's security-critical wiring: hardcoded HTMX endpoints /api/auth/login + /api/auth/register (target #auth-message), /forgot-password link, OAuth start URLs gated on context.site.*, and the exact Cap widget markup when captchaEnabled. Only the chrome is themed. #}
|
|
{% if context.isPublicLoggedIn %}
|
|
<div class="auth-form-logged-in mx-auto max-w-md text-center py-6">
|
|
<p class="terminal-mono text-sm uppercase tracking-wide text-muted-foreground">Session active as <strong class="text-primary">{{ context.publicUsername }}</strong></p>
|
|
<a href="/account" class="terminal-mono mt-3 inline-flex items-center rounded-md bg-primary px-4 py-2 text-sm font-medium uppercase tracking-wide text-primary-foreground hover:bg-primary/90">My Account</a>
|
|
</div>
|
|
{% else %}
|
|
{% set loginActive = "border-primary text-primary" %}
|
|
{% set registerActive = "border-transparent text-muted-foreground" %}
|
|
{% set loginHidden = "" %}
|
|
{% set registerHidden = "hidden" %}
|
|
{% if default_tab == "register" %}{% set loginActive = "border-transparent text-muted-foreground" %}{% set registerActive = "border-primary text-primary" %}{% set loginHidden = "hidden" %}{% set registerHidden = "" %}{% endif %}
|
|
{% set tabbase = "flex-1 py-2 text-center terminal-mono text-sm font-medium uppercase tracking-wider border-b-2 transition-colors" %}
|
|
{% macro captcha() %}<script>
|
|
window.CAP_CUSTOM_WASM_URL = "/assets/captcha/cap_wasm_bg.wasm";
|
|
window.CAP_PAKO_URL = "/assets/captcha/pako_inflate.min.js";
|
|
</script>
|
|
<cap-widget data-cap-api-endpoint="/api/captcha/" data-cap-worker-count="2"></cap-widget>
|
|
<script src="/assets/captcha/cap.min.js" defer></script>
|
|
<script>
|
|
(function(){
|
|
var s = document.currentScript;
|
|
var form = s && s.closest ? s.closest('form') : null;
|
|
if (!form) return;
|
|
form.addEventListener('htmx:afterRequest', function(){
|
|
var w = form.querySelector('cap-widget');
|
|
if (w && typeof w.reset === 'function') w.reset();
|
|
});
|
|
})();
|
|
</script>{% endmacro %}
|
|
{% macro social() %}{% if show_social != false and (context.site.google_oauth_client_id or context.site.facebook_app_id) %}<div class="auth-social my-4">
|
|
<div class="relative my-4"><hr class="border-border"/><span class="terminal-mono absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-background px-3 text-xs uppercase tracking-widest text-muted-foreground">or</span></div>
|
|
{% if context.site.google_oauth_client_id %}<a href="/api/auth/google/start" class="terminal-mono mb-2 flex w-full items-center justify-center gap-3 rounded-md border border-border px-4 py-2.5 uppercase tracking-wide transition-colors hover:bg-accent/10"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#google"></use></svg><span class="text-sm font-medium text-foreground/80">Continue with Google</span></a>{% endif %}
|
|
{% if context.site.facebook_app_id %}<a href="/api/auth/facebook/start" class="terminal-mono flex w-full items-center justify-center gap-3 rounded-md border border-border px-4 py-2.5 uppercase tracking-wide transition-colors hover:bg-accent/10"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#facebook"></use></svg><span class="text-sm font-medium text-foreground/80">Continue with Facebook</span></a>{% endif %}
|
|
</div>{% endif %}{% endmacro %}
|
|
<div class="auth-form tty-corners mx-auto max-w-md rounded-md border border-primary/40 bg-card p-6 text-card-foreground tty-frame">
|
|
<div id="auth-message"></div>
|
|
<div class="mb-5 flex border-b border-border">
|
|
<button type="button" data-auth-tab="login" data-tabbase="{{ tabbase }}" class="{{ tabbase }} {{ loginActive }}">Login</button>
|
|
<button type="button" data-auth-tab="register" data-tabbase="{{ tabbase }}" class="{{ tabbase }} {{ registerActive }}">Register</button>
|
|
</div>
|
|
<div id="login-panel" class="{{ loginHidden }}">
|
|
<form hx-post="/api/auth/login" hx-target="#auth-message" hx-swap="innerHTML">
|
|
<div class="mb-3"><label class="terminal-mono mb-1 block text-xs font-medium uppercase tracking-wide text-accent">Email</label><input type="email" name="email" required class="w-full rounded-md border border-primary/40 bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"/></div>
|
|
<div class="mb-4"><label class="terminal-mono mb-1 block text-xs font-medium uppercase tracking-wide text-accent">Password</label><input type="password" name="password" required class="w-full rounded-md border border-primary/40 bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"/></div>
|
|
{% if captchaEnabled %}{{ captcha() }}{% endif %}
|
|
<button type="submit" class="terminal-mono w-full rounded-md bg-primary px-4 py-2.5 font-semibold uppercase tracking-wider text-primary-foreground hover:bg-primary/90" hx-disabled-elt="this">Login</button>
|
|
<p class="mt-3 text-center text-sm"><a href="/forgot-password" class="terminal-mono uppercase tracking-wide text-primary hover:underline">Forgot password?</a></p>
|
|
</form>
|
|
{{ social() }}
|
|
</div>
|
|
<div id="register-panel" class="{{ registerHidden }}">
|
|
<form hx-post="/api/auth/register" hx-target="#auth-message" hx-swap="innerHTML">
|
|
<div class="mb-3"><label class="terminal-mono mb-1 block text-xs font-medium uppercase tracking-wide text-accent">Username</label><input type="text" name="username" required pattern="[a-zA-Z0-9_-]{3,30}" class="w-full rounded-md border border-primary/40 bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"/></div>
|
|
<div class="mb-3"><label class="terminal-mono mb-1 block text-xs font-medium uppercase tracking-wide text-accent">Email</label><input type="email" name="email" required class="w-full rounded-md border border-primary/40 bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"/></div>
|
|
<div class="mb-4"><label class="terminal-mono mb-1 block text-xs font-medium uppercase tracking-wide text-accent">Password</label><input type="password" name="password" required minlength="8" class="w-full rounded-md border border-primary/40 bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"/></div>
|
|
{% if captchaEnabled %}{{ captcha() }}{% endif %}
|
|
<button type="submit" class="terminal-mono w-full rounded-md bg-primary px-4 py-2.5 font-semibold uppercase tracking-wider text-primary-foreground hover:bg-primary/90" hx-disabled-elt="this">Create Account</button>
|
|
</form>
|
|
{{ social() }}
|
|
</div>
|
|
</div>
|
|
<script>
|
|
(function(){
|
|
var f=document.currentScript.closest('.auth-form')||document.querySelector('.auth-form');
|
|
if(!f)return;
|
|
var tabs=f.querySelectorAll('[data-auth-tab]');
|
|
tabs.forEach(function(btn){btn.addEventListener('click',function(){
|
|
var t=btn.getAttribute('data-auth-tab');
|
|
var lp=f.querySelector('#login-panel'),rp=f.querySelector('#register-panel');
|
|
if(lp)lp.classList.toggle('hidden',t!=='login');
|
|
if(rp)rp.classList.toggle('hidden',t!=='register');
|
|
tabs.forEach(function(b){var on=b===btn;b.className=b.getAttribute('data-tabbase')+(on?' border-primary text-primary':' border-transparent text-muted-foreground');});
|
|
});});
|
|
})();
|
|
</script>
|
|
{% endif %}
|