Render the OAuth callback page. Styled to match matterai.so: dark * background, cyan/teal accents, centered card, clean typography.
(kind: "success" | "error" | "not-found", detail?: string)
| 224 | /** Render the OAuth callback page. Styled to match matterai.so: dark |
| 225 | * background, cyan/teal accents, centered card, clean typography. */ |
| 226 | function callbackPage(kind: "success" | "error" | "not-found", detail?: string): string { |
| 227 | const isSuccess = kind === "success" |
| 228 | const title = isSuccess ? "Authorized" : kind === "not-found" ? "Not Found" : "Authorization Failed" |
| 229 | const message = isSuccess |
| 230 | ? "You can close this tab and return to OrbCode." |
| 231 | : kind === "not-found" |
| 232 | ? "This page was not found." |
| 233 | : detail ?? "An unexpected error occurred during authentication." |
| 234 | const icon = isSuccess ? "✓" : "✗" |
| 235 | const accent = isSuccess ? "#43df94" : "#e86464" |
| 236 | |
| 237 | return `<!DOCTYPE html> |
| 238 | <html lang="en"> |
| 239 | <head> |
| 240 | <meta charset="utf-8"> |
| 241 | <meta name="viewport" content="width=device-width, initial-scale=1"> |
| 242 | <title>OrbCode · ${title}</title> |
| 243 | <style> |
| 244 | * { margin: 0; padding: 0; box-sizing: border-box; } |
| 245 | body { |
| 246 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif; |
| 247 | background: #0d1117; |
| 248 | color: #e6edf3; |
| 249 | min-height: 100vh; |
| 250 | display: flex; |
| 251 | align-items: center; |
| 252 | justify-content: center; |
| 253 | -webkit-font-smoothing: antialiased; |
| 254 | } |
| 255 | .card { |
| 256 | text-align: center; |
| 257 | padding: 3rem 2.5rem; |
| 258 | max-width: 440px; |
| 259 | width: 90%; |
| 260 | } |
| 261 | .icon { |
| 262 | width: 72px; |
| 263 | height: 72px; |
| 264 | border-radius: 50%; |
| 265 | display: flex; |
| 266 | align-items: center; |
| 267 | justify-content: center; |
| 268 | margin: 0 auto 1.75rem; |
| 269 | font-size: 36px; |
| 270 | font-weight: 700; |
| 271 | background: ${accent}1a; |
| 272 | border: 2px solid ${accent}; |
| 273 | color: ${accent}; |
| 274 | } |
| 275 | h1 { |
| 276 | font-size: 1.6rem; |
| 277 | font-weight: 600; |
| 278 | letter-spacing: -0.02em; |
| 279 | margin-bottom: 0.6rem; |
| 280 | } |
| 281 | p { |
| 282 | font-size: 0.95rem; |
| 283 | line-height: 1.5; |
no outgoing calls
no test coverage detected