diff --git a/backend/templates/auth_components.templ b/backend/templates/auth_components.templ new file mode 100644 index 0000000..e5c115e --- /dev/null +++ b/backend/templates/auth_components.templ @@ -0,0 +1,174 @@ +package templates + +// AnimatedBackground renders 35 decorative logo elements that animate across +// the auth page background. The .background-layer carries aria-hidden="true" +// so screen readers ignore all decorative content (T-14-01-03). +// +// Each element uses a single logo_dark.png image (dark-mode swap deferred per +// DEFERRED/DARK-01). Image paths use /static/logo_dark.png — backend serves +// static files under /static/ unlike go-backend which serves from /. +templ AnimatedBackground() { + +} + +// GoogleButton renders the Material Design Google Sign-In button. +// +// When configured=true the button is an element linking to the OAuth start +// URL. When configured=false the button is rendered as a disabled + } +} + +// AuthDivider renders a horizontal divider with an "or" pill separator. +// English label per D-G03 convention (not "Ou continuer avec" from go-backend). +templ AuthDivider() { +
+
+ or +
+
+} diff --git a/backend/templates/auth_layout.templ b/backend/templates/auth_layout.templ new file mode 100644 index 0000000..6a7103e --- /dev/null +++ b/backend/templates/auth_layout.templ @@ -0,0 +1,37 @@ +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
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) { + + + + + + { title } + + + +
+ @AnimatedBackground() +
+
+
+ { children... } +
+
+
+ + + +}