đổi layout login

RobotApp/Components/Account/Pages/Login.razor

@@ -14,7 +14,13 @@
 <PageTitle>Log in</PageTitle>
 
 <div class="w-100 h-100 d-flex flex-column justify-content-center align-items-center">
-    <h1>Log in</h1>
+    <header class="brand">
+        <img src="images/logoD.svg" alt="RobotApp" class="brand-logo" />
+        <div class="brand-text">
+            <h1>RobotApp</h1>
+            <p>Sign in to your workspace</p>
+        </div>
+    </header>
     @if (!string.IsNullOrEmpty(errorMessage))
     {
         var statusMessageClass = errorMessage.StartsWith("Error") ? "danger" : "success";

RobotApp/Components/Account/Pages/Login.razor.css

@@ -0,0 +1,38 @@
+.brand {
+    display: flex;
+    align-items: center;
+    gap: 14px;
+    margin-bottom: 18px;
+    position: relative;
+}
+
+.brand-logo {
+    width: 56px;
+    height: 56px;
+    display: block;
+    filter: drop-shadow(0 10px 22px rgba(255,122,26,.25));
+}
+
+.brand::before {
+    content: "";
+    position: absolute;
+    inset: -8px -10px auto auto;
+    height: 3px;
+    width: 120px;
+    background: linear-gradient(90deg, var(--brand-pink), var(--brand-blue));
+    border-radius: 8px;
+    opacity: .9;
+}
+
+.brand-text h1 {
+    margin: 0;
+    font-size: 20px;
+    font-weight: 800;
+    letter-spacing: .2px;
+}
+
+.brand-text p {
+    margin: 2px 0 0 0;
+    color: var(--muted);
+    font-size: 13px;
+}

RobotApp/wwwroot/images/logoD.svg

@@ -0,0 +1,10 @@
+<svg
+  id="Layer_1"
+  data-name="Layer 1"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 32 32"
+>
+	<path d="M31.81,1.79,21.29,14.32l-2.48-3a2.6,2.6,0,0,1,0-3.34l4.45-5.31a2.64,2.64,0,0,1,2-.93Z" fill="#e06e2e"/>
+	<path d="M.19,1.8,10.71,14.34l2.48-2.95a2.6,2.6,0,0,0,0-3.34L8.75,2.74a2.66,2.66,0,0,0-2-.94Z" fill="#e06e2e"/>
+	<path d="M32,30.21H25.36a2.61,2.61,0,0,1-2-.92L16.5,21.1a.65.65,0,0,0-1,0L8.63,29.29a2.58,2.58,0,0,1-2,.92H0L12.07,15.83,14,13.57a2.67,2.67,0,0,1,4.08,0l1.89,2.26Z" fill="#233871"/>
+  </svg>

RobotApp/wwwroot/images/logoL.svg

@@ -0,0 +1,48 @@
+<svg
+  id="Layer_1"
+  data-name="Layer 1"
+  xmlns="http://www.w3.org/2000/svg"
+  viewBox="0 0 370.84 59.64"
+>
+    <path
+      d="M66.68,0,44.62,26.28,39.43,20.1a5.45,5.45,0,0,1,0-7L48.75,2A5.53,5.53,0,0,1,53,0Z"
+      fill="#e06e2e"
+    />
+    <path
+      d="M.4,0,22.46,26.31l5.19-6.18a5.45,5.45,0,0,0,0-7L18.33,2a5.53,5.53,0,0,0-4.22-2Z"
+      fill="#e06e2e"
+    />
+    <path
+      d="M67.08,59.59H53.15A5.44,5.44,0,0,1,49,57.65L34.58,40.49a1.36,1.36,0,0,0-2.09,0L18.09,57.65a5.46,5.46,0,0,1-4.17,1.94H0L25.31,29.43l4-4.72a5.57,5.57,0,0,1,8.54,0l4,4.72Z"
+      fill="#ffffff"
+    />
+    <path
+      d="M98.34,24.3A12.87,12.87,0,0,1,104,42.84a12.29,12.29,0,0,1-5.61,4.56A21.47,21.47,0,0,1,89.74,49H81.17v7.93a2.72,2.72,0,0,1-2.72,2.73H74.13V22.72H89.74a21.64,21.64,0,0,1,8.6,1.58m-1.93,17a6.52,6.52,0,0,0,2.39-5.43,6.54,6.54,0,0,0-2.39-5.43q-2.39-1.91-7-1.9H81.17V43.18h8.25q4.6,0,7-1.9"
+      fill="#ffffff"
+    />
+    <path
+      d="M145.86,25.44V56.91a2.72,2.72,0,0,1-2.72,2.73h-4.33V43.81H119.18V59.64h-4.32a2.73,2.73,0,0,1-2.73-2.73V25.44a2.72,2.72,0,0,1,2.73-2.72h4.32V38h19.63V22.72h4.33a2.72,2.72,0,0,1,2.72,2.72"
+      fill="#ffffff"
+    />
+    <path
+      d="M183,56.58v3h-24.8a3.6,3.6,0,0,1-3.6-3.6V26.36a3.6,3.6,0,0,1,3.6-3.6h24.05v3a2.73,2.73,0,0,1-2.73,2.73H161.62v9.57h18.29V43.7H161.62V53.86h18.65A2.72,2.72,0,0,1,183,56.58"
+      fill="#ffffff"
+    />
+    <path
+      d="M222.73,22.76V59.59h-4.52a2.71,2.71,0,0,1-2.09-1l-20.06-24V59.59h-7V22.76h4.51a2.72,2.72,0,0,1,2.09,1l20.07,24V22.76Z"
+      fill="#ffffff"
+    />
+    <rect x="231.85" y="22.76" width="7.03" height="36.83" fill="#ffffff" />
+    <path
+      d="M261,44.18l-6,6v9.42h-7V22.76h7V41.65L273,23.57a2.71,2.71,0,0,1,1.93-.81h6.77L265.75,39.23l16.88,20.36h-7a2.72,2.72,0,0,1-2.06-.94Z"
+      fill="#ffffff"
+    />
+    <path
+      d="M315.59,51.07H296.65l-3,6.89a2.74,2.74,0,0,1-2.5,1.63h-5.47l16.08-34.74A3.6,3.6,0,0,1,305,22.76h2.32a3.61,3.61,0,0,1,3.27,2.08l16.13,34.75h-5.59A2.72,2.72,0,0,1,318.66,58Zm-2.33-5.37-7.14-16.1L299,45.7Z"
+      fill="#ffffff"
+    />
+    <path
+      d="M359.69,51.07H340.76l-3,6.89a2.71,2.71,0,0,1-2.49,1.63h-5.47l16.07-34.74a3.62,3.62,0,0,1,3.27-2.09h2.33a3.59,3.59,0,0,1,3.26,2.08l16.13,34.75h-5.59A2.7,2.7,0,0,1,362.77,58Zm-2.32-5.37-7.14-16.1-7.09,16.1Z"
+      fill="#ffffff"
+    />
+  </svg>