From 1ac771c7a61936df3feb570d8b84a4348db5cee3 Mon Sep 17 00:00:00 2001
From: Graham McIntire <graham@mcintire.me>
Date: Wed, 28 Jan 2026 15:26:03 -0600
Subject: [PATCH] mfa enroll page design update

---
 .../live/account_live/totp_enrollment.ex             | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/lib/towerops_web/live/account_live/totp_enrollment.ex b/lib/towerops_web/live/account_live/totp_enrollment.ex
index d316c354..183cfd13 100644
--- a/lib/towerops_web/live/account_live/totp_enrollment.ex
+++ b/lib/towerops_web/live/account_live/totp_enrollment.ex
@@ -148,13 +148,13 @@ defmodule ToweropsWeb.AccountLive.TotpEnrollment do
                 for={%{}}
                 as={:form}
                 phx-submit="verify_code"
-                class="ml-11"
+                class="ml-11 flex flex-col items-center"
               >
-                <div class="space-y-4">
+                <div class="space-y-4 w-full max-w-xs">
                   <div>
                     <label
                       for="code"
-                      class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2"
+                      class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 text-center"
                     >
                       6-digit code
                     </label>
@@ -168,13 +168,13 @@ defmodule ToweropsWeb.AccountLive.TotpEnrollment do
                       placeholder="000000"
                       required
                       autocomplete="off"
-                      class="block w-full max-w-xs rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-800 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500 text-2xl text-center tracking-widest font-mono"
+                      class="block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-800 dark:text-white shadow-sm focus:border-blue-500 focus:ring-blue-500 text-2xl text-center tracking-widest font-mono"
                       phx-mounted={JS.focus()}
                     />
                   </div>
 
                   <%= if @error do %>
-                    <div class="rounded-md bg-red-50 dark:bg-red-900/30 p-4 max-w-xs">
+                    <div class="rounded-md bg-red-50 dark:bg-red-900/30 p-4">
                       <div class="flex">
                         <.icon name="hero-exclamation-circle" class="h-5 w-5 text-red-400" />
                         <div class="ml-3">
@@ -187,7 +187,7 @@ defmodule ToweropsWeb.AccountLive.TotpEnrollment do
                   <% end %>
 
                   <div>
-                    <.button type="submit" variant="primary" class="w-full max-w-xs">
+                    <.button type="submit" variant="primary" class="w-full">
                       <.icon name="hero-shield-check" class="w-5 h-5 mr-2" /> Verify and Enable
                     </.button>
                   </div>