From 675845bebc1365ccd0bd30fa2123eeb689b85350 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Wed, 19 Oct 2022 17:29:22 +0800
Subject: [PATCH] Force non-themed colours on login forms as these pages are
 unthemed

---
 .../web/components/templates/ConfirmProfileModal.tsx |  2 +-
 .../templates/auth/EmailForgotPassword.tsx           |  2 +-
 .../web/components/templates/auth/EmailLogin.tsx     |  4 ++--
 .../components/templates/auth/EmailResetPassword.tsx |  2 +-
 .../web/components/templates/auth/EmailSignup.tsx    | 12 ++++++------
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/web/components/templates/ConfirmProfileModal.tsx b/packages/web/components/templates/ConfirmProfileModal.tsx
index 6c36c580a..72a939947 100644
--- a/packages/web/components/templates/ConfirmProfileModal.tsx
+++ b/packages/web/components/templates/ConfirmProfileModal.tsx
@@ -139,7 +139,7 @@ export function ConfirmProfileModal(): JSX.Element {
               {isUsernameValid && (
                 <StyledText
                   style="caption"
-                  css={{ m: 0, pl: '$2', alignSelf: 'flex-start' }}
+                  css={{ m: 0, pl: '$2', alignSelf: 'flex-start', color: '$omnivoreGray' }}
                 >
                   Username is available.
                 </StyledText>
diff --git a/packages/web/components/templates/auth/EmailForgotPassword.tsx b/packages/web/components/templates/auth/EmailForgotPassword.tsx
index 888cee302..11867cce5 100644
--- a/packages/web/components/templates/auth/EmailForgotPassword.tsx
+++ b/packages/web/components/templates/auth/EmailForgotPassword.tsx
@@ -51,7 +51,7 @@ export function EmailForgotPassword(): JSX.Element {
               name="email"
               value={email}
               placeholder="Email"
-              css={{ bg: 'white '}}
+              css={{ bg: 'white', color: 'black' }}
               onChange={(e) => { e.preventDefault(); setEmail(e.target.value); }}
             />
           </SpanBox>
diff --git a/packages/web/components/templates/auth/EmailLogin.tsx b/packages/web/components/templates/auth/EmailLogin.tsx
index 63541f4e0..ced660e4d 100644
--- a/packages/web/components/templates/auth/EmailLogin.tsx
+++ b/packages/web/components/templates/auth/EmailLogin.tsx
@@ -55,7 +55,7 @@ export function EmailLogin(): JSX.Element {
               name="email"
               value={email}
               placeholder="Email"
-              css={{ bg: 'white '}}
+              css={{ backgroundColor: 'white', color: 'black' }}
               onChange={(e) => { e.preventDefault(); setEmail(e.target.value); }}
             />
           </SpanBox>
@@ -68,7 +68,7 @@ export function EmailLogin(): JSX.Element {
               name="password"
               value={password}
               placeholder="Password"
-              css={{ bg: 'white '}}
+              css={{ bg: 'white', color: 'black' }}
               onChange={(e) => setPassword(e.target.value)}
             />
           </SpanBox>
diff --git a/packages/web/components/templates/auth/EmailResetPassword.tsx b/packages/web/components/templates/auth/EmailResetPassword.tsx
index 67d97ead8..e58dbbf75 100644
--- a/packages/web/components/templates/auth/EmailResetPassword.tsx
+++ b/packages/web/components/templates/auth/EmailResetPassword.tsx
@@ -61,7 +61,7 @@ export function EmailResetPassword(): JSX.Element {
               name="password"
               value={password}
               placeholder="Password"
-              css={{ bg: 'white '}}
+              css={{ bg: 'white', color: 'black' }}
               onChange={(e) => { e.preventDefault(); setPassword(e.target.value); }}
             />
             <FormLabel css={{ fontSize: '12px' }}>(Password must be at least 8 chars)</FormLabel>
diff --git a/packages/web/components/templates/auth/EmailSignup.tsx b/packages/web/components/templates/auth/EmailSignup.tsx
index 3139b3b74..9a8a9b9c5 100644
--- a/packages/web/components/templates/auth/EmailSignup.tsx
+++ b/packages/web/components/templates/auth/EmailSignup.tsx
@@ -63,7 +63,7 @@ export function EmailSignup(): JSX.Element {
   return (
     <form action={`${fetchEndpoint}/auth/email-signup`} method="POST">
       <VStack alignment="center" css={{ padding: '16px' }}>
-        <StyledText style="subHeadline">Sign Up</StyledText>
+        <StyledText style="subHeadline" css={{ color: '$omnivoreGray' }}>Sign Up</StyledText>
         <VStack css={{ width: '100%', minWidth: '320px', gap: '16px', pb: '16px' }}>
           <SpanBox css={{ width: '100%' }}>
             <FormLabel>Email</FormLabel>
@@ -73,7 +73,7 @@ export function EmailSignup(): JSX.Element {
               name="email"
               value={email}
               placeholder="Email"
-              css={{ bg: 'white '}}
+              css={{ backgroundColor: 'white', color: 'black' }}
               onChange={(e) => { e.preventDefault(); setEmail(e.target.value); }}
             />
           </SpanBox>
@@ -86,7 +86,7 @@ export function EmailSignup(): JSX.Element {
               name="password"
               value={password}
               placeholder="Password"
-              css={{ bg: 'white '}}
+              css={{ bg: 'white', color: 'black' }}
               onChange={(e) => setPassword(e.target.value)}
             />
           </SpanBox>
@@ -99,7 +99,7 @@ export function EmailSignup(): JSX.Element {
               name="name"
               value={fullname}
               placeholder="Full Name"
-              css={{ bg: 'white '}}
+              css={{ bg: 'white', color: 'black' }}
               onChange={(e) => setFullname(e.target.value)}
             />
           </SpanBox>
@@ -112,7 +112,7 @@ export function EmailSignup(): JSX.Element {
               name="username"
               value={username}
               placeholder="Username"
-              css={{ bg: 'white '}}
+              css={{ bg: 'white', color: 'black' }}
               onChange={handleUsernameChange}
             />
           </SpanBox>
@@ -132,7 +132,7 @@ export function EmailSignup(): JSX.Element {
           {isUsernameValid && (
             <StyledText
               style="caption"
-              css={{ m: 0, pl: '$2', alignSelf: 'flex-start' }}
+              css={{ m: 0, pl: '$2', alignSelf: 'flex-start', color: '$omnivoreGray' }}
             >
               Username is available.
             </StyledText>