Per Google's branding guidelines, the gsi-material-button requires Roboto Medium. Add Google Fonts preconnect + stylesheet link to AuthLayout head. Also add display:block + 100% dimensions to the SVG inside the icon container to prevent inline baseline gaps. Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
40 lines
1.6 KiB
Text
40 lines
1.6 KiB
Text
package templates
|
|
|
|
// AuthLayout is the standalone HTML shell for auth pages (/login, /signup).
|
|
//
|
|
// It replaces @Layout(...) for these pages. Differences from Layout:
|
|
// - No header, footer, or <main> wrapper — auth pages are full-viewport centered
|
|
// - Body uses .login-screen (gradient bg, flex center) instead of min-h-screen bg-white
|
|
// - @AnimatedBackground() renders 35 animated logo elements behind the card
|
|
// - No auth.User param — auth pages are always unauthenticated (T-14-01-04)
|
|
// - Scripts: only htmx.min.js — sortable.min.js and discussion-sse.js are not needed
|
|
//
|
|
// csrfToken is threaded so page children (LoginPage, SignupPage) can forward it
|
|
// into their form fragments via ui.CSRFField(csrfToken). AuthLayout itself does
|
|
// not embed a CSRF field — only the form fragments do.
|
|
templ AuthLayout(title string, csrfToken string) {
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
|
<title>{ title }</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com"/>
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/>
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap"/>
|
|
<link rel="stylesheet" href="/static/tailwind.css"/>
|
|
</head>
|
|
<body>
|
|
<div class="login-screen">
|
|
@AnimatedBackground()
|
|
<div class="card-wrap">
|
|
<div class="card-glow"></div>
|
|
<div class="auth-card-shell">
|
|
{ children... }
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="/static/htmx.min.js" defer></script>
|
|
</body>
|
|
</html>
|
|
}
|