auth-success-template.html 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>{{title}}</title>
  7. <style>
  8. :root {
  9. color-scheme: light dark;
  10. }
  11. body {
  12. margin: 0;
  13. padding: 0;
  14. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  15. background: #f5f7fb;
  16. color: #1f2d3d;
  17. display: flex;
  18. min-height: 100vh;
  19. align-items: center;
  20. justify-content: center;
  21. }
  22. .card {
  23. background: #fff;
  24. border-radius: 16px;
  25. box-shadow: 0 12px 30px rgba(45, 79, 120, 0.15);
  26. padding: 48px 40px;
  27. text-align: center;
  28. max-width: 360px;
  29. width: 90%;
  30. }
  31. .icon {
  32. width: 72px;
  33. height: 72px;
  34. margin: 0 auto 24px;
  35. border-radius: 50%;
  36. background: linear-gradient(120deg, #3ec5ff, #2da39d);
  37. display: flex;
  38. align-items: center;
  39. justify-content: center;
  40. color: #fff;
  41. font-size: 36px;
  42. }
  43. h1 {
  44. margin: 0 0 12px;
  45. font-size: 24px;
  46. }
  47. p {
  48. margin: 0;
  49. line-height: 1.6;
  50. color: #6b7c93;
  51. }
  52. </style>
  53. </head>
  54. <body>
  55. <div class="card">
  56. <div class="icon">✔</div>
  57. <h1>{{heading}}</h1>
  58. <p>{{message}}</p>
  59. </div>
  60. </body>
  61. </html>