login en es

uniEmpleos/src/components/LanguageButton/LanguageButton.jsx

@@ -4,14 +4,16 @@ import i18n from "../../i18n"
 import style from "./LanguageButton.module.css"
 
 const LanguageButton = () => {
-  const [language, setLanguage] = useState("es")
+  const [language, setLanguage] = useState("en")
 
   const changeLanguage = () => {
     if (language === "es") {
       setLanguage("en")
+      console.log("en")
       i18n.changeLanguage("en")
     } else {
       setLanguage("es")
+        console.log("es")
       i18n.changeLanguage("es")
     }
   }
@@ -24,7 +26,7 @@ const LanguageButton = () => {
         onClick={changeLanguage}
       >
         <img
-          src={language === "es" ? "/images/en.svg" : "/images/es.svg"}
+          src={language === "en" ? "/images/es.svg" : "/images/en.svg"}
           alt="English"
           className={style.imgButton}
         />

uniEmpleos/src/locales/en/translation.json

@@ -5,8 +5,12 @@
     "title2": "How does it work?",
     "desc2": "Companies publish their job offers and students can apply to them. The companies can view the profiles of the students and contact them."
 },
-  "intro": {
-    "description": "Guatemalan lawyer with experience in strategic analysis, political analysis and advisory to boards. Currently, I am the Executive President of the National Civic Movement. I participated in the 2022-2023 cohort of the Millennium Leadership Program at the Atlantic Council. On this website, I share reflections and resources to understand the sociopolitical environment in which we live."
+  "login": {
+    "email": "Enter your email",
+    "password": "Enter your password",
+    "new":"New to UniEmpleos?",
+    "register": "Register",
+    "login": "Login"
   },
   "podcast": {
     "title": "Podcast",

uniEmpleos/src/locales/es/translation.json

@@ -5,8 +5,12 @@
     "title2": "¿Cómo funciona?",
     "desc2": "Las empresas publican sus ofertas de trabajo y los estudiantes pueden postular a ellas. Las empresas pueden ver los perfiles de los estudiantes y contactarlos."
   },
-  "intro": {
-    "description": "Abogado guatemalteco con experiencia en análisis estratégico, análisis político y asesorías a directivas. Actualmente soy Presidente Ejecutivo del Movimiento Cívico Nacional. Participé en el cohorte 2022-2023 del Millenium Leadership Program del Atlantic Council. En este website comparto reflexiones y recursos para comprender el entorno sociopolítico en el que vivimos."
+  "login": {
+    "email": "Ingrese su correo",
+    "password": "Ingrese su contraseña",
+    "new":"¿Eres nuevo?",
+    "register": "Regístrate",
+    "login": "Iniciar Sesión"
   },
   "podcast": {
     "title": "Podcast",

uniEmpleos/src/pages/Login/Login.jsx

@@ -6,8 +6,11 @@ import styles from "./Login.module.css"
 import Popup from "../../components/Popup/Popup"
 import API_URL from "../../api"
 import { useStoreon } from "storeon/react"
+import { useTranslation } from "react-i18next"
+import LanguageButton from "../../components/LanguageButton/LanguageButton"
 
 const LogIn = () => {
+  const { t } = useTranslation()
   const { dispatch } = useStoreon("user")
 
   const [emailInput, setEmailInput] = useState("")
@@ -82,7 +85,7 @@ const LogIn = () => {
       <h1>UniEmpleos</h1>
       <div className={styles.inputsContainer}>
         <div className={styles.usuarioContainer}>
-          <span>Ingrese su correo</span>
+          <span>{t("login.email")}</span>
           <ComponentInput
             name="correo"
             type="text"
@@ -91,26 +94,26 @@ const LogIn = () => {
           />
         </div>
         <div className={styles.usuarioContainer}>
-          <span>Ingrese su contraseña</span>
+          <span>{t("login.password")}</span>
           <ComponentInput
             name="password"
             type="password"
             placeholder="micontraseña123"
             onChange={handlePass}
-            eye = {true}
+            eye
             onClickButton = {handlePassword}
             isOpen={showPassword}
           />
         </div>
         <Button
-          label="Iniciar sesión"
+          label={t("login.login")}
           onClick={(event) => {
             event.preventDefault()
             logIn()
           }}
         />
         <a href="/signup">
-          ¿Eres nuevo? <span> Únete al equipo </span>
+          {t("login.new")} <span> {t("login.register")}</span>
         </a>
       </div>
       <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
@@ -122,6 +125,9 @@ const LogIn = () => {
           320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"
         />
       </svg>
+      <div className={styles.footer}>
+        <LanguageButton />
+      </div>
     </div>
   )
 }

uniEmpleos/src/pages/Login/Login.module.css

@@ -18,7 +18,7 @@
   color: #a08ae5;
 }
 
-.logInCointainer>div {
+.inputsContainer {
   z-index: 1;
   border-radius: 5px;
   width: 300px;