From 939a55c44b0ecb245212e8deb1f2162f715e17de Mon Sep 17 00:00:00 2001
From: Gregory Wells <gawells@astraltech.xyz>
Date: Tue, 31 Mar 2026 21:15:26 -0400
Subject: [PATCH] finish styling for change password page

---
 src/pages/profile_page.html |  2 +-
 static/card.css             | 11 +++++++++++
 static/login_page.css       |  5 -----
 static/profile_page.css     |  6 ++++++
 static/style.css            |  2 +-
 5 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/src/pages/profile_page.html b/src/pages/profile_page.html
index 5e5332f..17eeef4 100644
--- a/src/pages/profile_page.html
+++ b/src/pages/profile_page.html
@@ -12,7 +12,7 @@
 
 <div id="popup_background" class="blocked hidden"></div>
 
-<div id="change_password_dialouge" class="hidden card">
+<div id="change_password_dialouge" class="hidden card static_center">
     <div id="password_error" class="error hidden">
         <div id="password_text"></div>
         <button id="password_error_close_button" class="close_error_button">
diff --git a/static/card.css b/static/card.css
index 683996b..f485210 100644
--- a/static/card.css
+++ b/static/card.css
@@ -10,4 +10,15 @@
     padding: 2.5rem;
     box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
     transition: transform 0.2s ease;
+
+    display: flex;
+    flex-direction: column;
+    gap: 15px;
+}
+
+.static_center {
+    position: fixed;
+    left: 50%;
+    top: 50%;
+    transform: translateX(-50%) translateY(-50%);
 }
diff --git a/static/login_page.css b/static/login_page.css
index d901841..423fbc7 100644
--- a/static/login_page.css
+++ b/static/login_page.css
@@ -6,11 +6,6 @@
 }
 
 #login_card {
-    /* The Magic Three */
-    display: flex;
-    flex-direction: column; /* Stack vertically */
-    gap: 15px; /* Space between inputs */
-
     position: fixed;
     top: 50%;
     left: 50%;
diff --git a/static/profile_page.css b/static/profile_page.css
index acc4ac0..9d341e7 100644
--- a/static/profile_page.css
+++ b/static/profile_page.css
@@ -33,6 +33,8 @@
     max-width: 500px;
     text-align: center;
 
+    gap: 0px !important;
+
     position: fixed;
     left: 50%;
     top: 50%;
@@ -120,3 +122,7 @@
     z-index: 10000;
     position: fixed;
 }
+
+#change_password_dialouge input {
+    width: 350px;
+}
diff --git a/static/style.css b/static/style.css
index b6f94af..6d4b7b4 100644
--- a/static/style.css
+++ b/static/style.css
@@ -52,7 +52,7 @@ input::placeholder {
 }
 
 .hidden {
-    display: none;
+    display: none !important;
 }
 
 .blocked {