added style, fixed login issue

Adjust css for login page

frontend/src/components/navPanel/NavPanel.css

@@ -76,3 +76,14 @@
   cursor: pointer;
   transition: all 0.15s ease;
 }
+
+
+@media (max-width: 480px) {
+  .nav-panel__overlay {
+    position: fixed;
+    inset: 0;
+    background-color: rgba(0, 0, 0, 0.45);
+    opacity: 0;
+    z-index: 900;
+  }
+}

frontend/src/contexts/AuthContext.jsx

@@ -42,10 +42,12 @@ export function AuthProvider({ children }) {
 
   useEffect(() => {
     const unsubscribe = onAuthStateChanged(auth, async (user) => {
-      setCurrentUser(user);
       if (user) {
+        setLoading(true);
+        setCurrentUser(user);
         await fetchAccount();
       } else {
+        setCurrentUser(null);
         setUserTier("free");
         setTierLimits(DEFAULT_TIER_LIMITS);
         setIsSubscribed(false);
@@ -79,7 +81,9 @@ export function AuthProvider({ children }) {
     if (auth.currentUser) {
       await auth.currentUser.reload();
       setCurrentUser({ ...auth.currentUser });
+      return auth.currentUser;
     }
+    return null;
   }
 
   const value = {

frontend/src/index.css

@@ -82,8 +82,10 @@ button {
 
 .page {
   max-width: 800px;
+  height: 100%;
   margin: 0 auto;
   padding: 2rem;
+  background-color: red;
 }
 
 .page--wide {
@@ -422,7 +424,7 @@ button {
 
   .btn {
     padding: 0.45rem 0.85rem;
-    font-size: 0.95rem;
+    font-size: 1.45rem !important;
   }
 
   .btn--lg {
@@ -433,4 +435,8 @@ button {
   .section {
     padding: 0.75rem;
   }
+
+  .mb-lg {
+    color: white;
+  }
 }

frontend/src/pages/login/Login.css

@@ -40,6 +40,7 @@
   text-align: center;
   position: relative;
   top: -20px;
+  white-space: nowrap;
 }
 
 .login-brand {
@@ -114,4 +115,21 @@
     padding-right: 1rem;
     font-size: 1.25rem;
   }
+
+  .login-span {
+    color: red
+  }
+
+  h1 {
+    font-weight: 400 !important
+  }
+
+  .login-bg-video {
+    opacity: 0.135;
+    left: 47%;
+  }
+
+  .login-button {
+    font-size: 1rem;
+  }
 }

frontend/src/pages/login/Login.jsx

@@ -47,7 +47,7 @@ export default function Login() {
 
       <div className="login-card login-card-fadein">
         <h1 className="login-heading">
-          <span className="login-brand">Koin Ping</span> - Login
+          <span className="login-brand">Koin Ping</span><span className="login-span"> - Login</span>
         </h1>
 
         <div className="login-interactive-fadein">

frontend/src/pages/subscribe/Subscribe.jsx

@@ -82,10 +82,7 @@ export default function Subscribe() {
     setError("");
     setLoading(true);
     try {
-      await reloadUser();
-      const { currentUser: user } = await import("../../firebase/config").then(
-        (m) => ({ currentUser: m.auth.currentUser })
-      );
+      const user = await reloadUser();
       if (user?.emailVerified) {
         setStep(3);
       } else {