Update sign in and sign up pages with new styles and French text.

H1B0B0 · Feb 6, 2024 · da582ea · da582ea
1 parent 8ad4640
commit da582ea
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 13 deletions.
diff --git a/front/src/pages/SignIn/index.tsx b/front/src/pages/SignIn/index.tsx
@@ -23,22 +23,22 @@ const SignIn: React.FC = () => {
   return (
     <Container>
       <form data-testid='login-form' onSubmit={handleSubmit}>
-        <h2>Faça seu login</h2>
+        <h2>Se connecter</h2>
         <input
           type='text'
-          placeholder='Digite seu nome de usuário'
+          placeholder="Entrez votre nom d'utilisateur "
           value={username}
           onChange={(event) => setUsername(event.target.value)}
         />
         <input
           type='password'
-          placeholder='Digite sua senha'
+          placeholder='Taper votre mot de passe'
           value={password}
           onChange={(event) => setPassword(event.target.value)}
         />
-        <button type='submit'>Entrar</button>
+        <button type='submit'>Entrer</button>
       </form>
-      <Link to='/signup'>Me cadastrar</Link>
+      <Link to='/signup'>Inscrivez-vous</Link>
     </Container>
   );
 };

diff --git a/front/src/pages/SignIn/styles.ts b/front/src/pages/SignIn/styles.ts
@@ -18,6 +18,8 @@ export const Container = styled.div`
     h2 {
       align-self: center;
       color: #222;
+      color: #C70039;
+      font-size: 30px;
     }
 
     input {
@@ -28,9 +30,11 @@ export const Container = styled.div`
       padding: 0 20px;
       font-size: 16px;
       color: #666;
+      border-radius: 12px;
 
       & + input {
         margin-top: 5px;
+        
       }
     }
 
@@ -40,12 +44,13 @@ export const Container = styled.div`
       border-radius: 4px;
       height: 48px;
       font-size: 16px;
-      background: #3bafda;
+      background: #C70039;
       font-weight: bold;
       color: #fff;
+      border-radius: 30px;
 
       &:hover {
-        background-color: ${darken(0.08, '#3bafda')};
+        background-color: ${darken(0.08, '#C70039')};
       }
     }
   }

diff --git a/front/src/pages/SignUp/index.tsx b/front/src/pages/SignUp/index.tsx
@@ -30,28 +30,28 @@ const SignUp: React.FC = () => {
   return (
     <Container>
       <form data-testid='login-form' onSubmit={handleSubmit}>
-        <h2>Faça seu cadastro</h2>
+        <h2>Inscription</h2>
         <input
           type='text'
-          placeholder='Digite seu nome'
+          placeholder='Votre nom'
           value={name}
           onChange={(event) => setName(event.target.value)}
         />
         <input
           type='text'
-          placeholder='Digite seu nome de usuário'
+          placeholder="Votre nom d'utilisateur"
           value={username}
           onChange={(event) => setUsername(event.target.value)}
         />
         <input
           type='password'
-          placeholder='Digite sua senha'
+          placeholder='Tapez votre mot de passe'
           value={password}
           onChange={(event) => setPassword(event.target.value)}
         />
-        <button type='submit'>Entrar</button>
+        <button type='submit'>Entrer</button>
       </form>
-      <Link to='/'>Já possuo uma conta</Link>
+      <Link to='/'>J'ai déja un compte</Link>
     </Container>
   );
 };