SIU_Dran_net/frontend/src/Registro.jsx

121 lines
4.8 KiB
JavaScript

import React from 'react';
import './Registro.css'; // Estilo para el formulario
import Encabezado from './Encabezado';
const Registro = () => {
return (
<div className="bodyRegistro">
<Encabezado/>
<h1 className='titRegistro'>Registro</h1>
<h4>Datos Personales</h4>
<form className='formRegistro'>
<div className="campo">
<label htmlFor="nombre">Nombre:</label>
<input type="text" id="nombre" name='nombre'/>
</div>
<div className="campo">
<label htmlFor="apellidoPaterno">Apellido Paterno:</label>
<input type="text" id="apellidoPaterno" name='apellidoPaterno'/>
</div>
<div className="campo">
<label htmlFor="apellidoMaterno">Apellido Materno:</label>
<input type="text" id="apellidoMaterno" name="apellidoMaterno" />
</div>
<div className="campo">
<label htmlFor="sexo">Sexo:</label>
<select id="sexo" name="sexo">
<option value="Masculino">Masculino</option>
<option value="Femenino">Femenino</option>
</select>
</div>
<div className="campo">
<label htmlFor="nacimiento">Fecha Nacimiento:</label>
<input type="date" id="nacimiento" name="nacimiento"/>
</div>
<div className="campo">
<label htmlFor="nacionalidad">Nacionalidad:</label>
<input type="text" id="nacionalidad" name="nacionalidad"/>
</div>
<div className="campo">
<label htmlFor="ciudad">Ciudad:</label>
<input type="text" id="ciudad" name="ciudad"/>
</div>
<div className="campo">
<label htmlFor="direccion">Dirección:</label>
<input type="text" id="direccion" name="direccion"/>
</div>
<div className="campo">
<label htmlFor="codigoPostal">Código Postal:</label>
<input type="text" id="codigoPostal" name="codigoPostal"/>
</div>
<div className="campo" id='campoTelefono'>
<label htmlFor="telefono">Teléfono:</label>
<input type="text" id="telefono" name="telefono"/>
</div>
<div className="campo" id='campoTelefonoCasa'>
<label htmlFor="telefonoCasa">Teléfono Casa:</label>
<input type="text" id="telefonoCasa" name="telefonoCasa"/>
</div>
<div className="campo" id='campoCorreo'>
<label htmlFor="correo">Correo:</label>
<input type="email" id="correo" name="correo"/>
</div>
<div className="campo"id='campoContraseña'>
<label htmlFor="contrasena">Contraseña:</label>
<input type="password" id="contrasena" name="contrasena"/>
</div>
</form>
<h4>Datos de Tutor</h4>
<form className='formRegistro'>
<div className="campo">
<label htmlFor="nombre">Nombre:</label>
<input type="text" id="nombre" name='nombre'/>
</div>
<div className="campo">
<label htmlFor="apellidoPaterno">Apellido Paterno:</label>
<input type="text" id="apellidoPaterno" name='apellidoPaterno'/>
</div>
<div className="campo">
<label htmlFor="apellidoMaterno">Apellido Materno:</label>
<input type="text" id="apellidoMaterno" name="apellidoMaterno" />
</div>
<div className="campo">
<label htmlFor="sexo">Sexo:</label>
<select id="sexo" name="sexo">
<option value="Masculino">Masculino</option>
<option value="Femenino">Femenino</option>
</select>
</div>
<div className="campo">
<label htmlFor="parentesco">Parentesco:</label>
<input type="text" id="parentesco" name="parentesco"/>
</div>
<div className="campo">
<label htmlFor="Numero Celular">Numero Celular:</label>
<input type="text" id="Numero Celular" name="Numero Celular"/>
</div>
<div className="campo">
<label htmlFor="Numero Casa">Numero Casa:</label>
<input type="text" id="Numero Casa" name="Numero Casa"/>
</div>
<div className="campo">
<label htmlFor="edad">Edad:</label>
<input type="text" id="edad" name="edad"/>
</div>
<div className="campo">
<label htmlFor="direccion">Dirección:</label>
<input type="text" id="direccion" name="direccion"/>
</div>
</form>
<div className="btnenviar">
<input type="submit" className="boton" value="Registrar" />
</div>
</div>
);
}
export default Registro;