chg: usr: improve the gfx on homepage - implement login/register and activation for authentication - and add the first version of profile page #4

2026-04-11 20:45:51 +02:00
parent eff849549b
commit 6b3e19b063
43 changed files with 3375 additions and 1806 deletions
--- a/templates/emails/activation.html.twig
+++ b/templates/emails/activation.html.twig
@@ -0,0 +1,103 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1"/>
+    <title>Activate your MineSeeker account</title>
+    <style>
+        body {
+            margin: 0; padding: 0;
+            background: #07090d;
+            font-family: Arial, sans-serif;
+            color: #ffffff;
+        }
+        .wrapper {
+            max-width: 560px;
+            margin: 0 auto;
+            padding: 40px 20px;
+        }
+        .logo {
+            text-align: center;
+            margin-bottom: 36px;
+        }
+        .logo img {
+            width: 200px;
+        }
+        .card {
+            background: #0f1923;
+            border: 1px solid rgba(35, 111, 135, 0.25);
+            border-radius: 10px;
+            padding: 40px 36px;
+        }
+        h1 {
+            font-size: 26px;
+            font-weight: 800;
+            letter-spacing: 1px;
+            margin: 0 0 10px;
+            color: #ffffff;
+        }
+        .sub {
+            font-size: 14px;
+            color: rgba(149, 207, 245, 0.7);
+            margin: 0 0 28px;
+        }
+        p {
+            font-size: 15px;
+            color: rgba(255, 255, 255, 0.65);
+            line-height: 1.7;
+            margin: 0 0 24px;
+        }
+        .btn {
+            display: inline-block;
+            background: linear-gradient(to bottom, #ad0a05, #f67d52);
+            color: #ffffff !important;
+            text-decoration: none;
+            font-size: 15px;
+            font-weight: bold;
+            letter-spacing: 2px;
+            text-transform: uppercase;
+            padding: 16px 48px;
+            border-radius: 5px;
+        }
+        .fallback {
+            margin-top: 24px;
+            font-size: 12px;
+            color: rgba(255, 255, 255, 0.3);
+            word-break: break-all;
+        }
+        .fallback a { color: rgba(149, 207, 245, 0.5); }
+        .footer {
+            text-align: center;
+            margin-top: 32px;
+            font-size: 12px;
+            color: rgba(255, 255, 255, 0.2);
+        }
+    </style>
+</head>
+<body>
+<div class="wrapper">
+    <div class="logo">
+        <img src="{{ absolute_url(asset('images/mine-logo-txt.png')) }}" alt="MineSeeker"/>
+    </div>
+    <div class="card">
+        <h1>One step to go</h1>
+        <p class="sub">Activate your account, commander</p>
+        <p>
+            Hi <strong>{{ username }}</strong>,<br>
+            Thanks for registering on MineSeeker. Click the button below to verify your
+            email address and activate your account.
+        </p>
+        <p>
+            <a class="btn" href="{{ activation_url }}">Activate account</a>
+        </p>
+        <p class="fallback">
+            If the button doesn't work, copy and paste this link into your browser:<br>
+            <a href="{{ activation_url }}">{{ activation_url }}</a>
+        </p>
+    </div>
+    <div class="footer">
+        &copy; {{ "now"|date("Y") }} MineSeeker &bull; This link expires in 24 hours.
+    </div>
+</div>
+</body>
+</html>