Vistas y estilo modificado

parent 903e7b66
...@@ -14,12 +14,22 @@ ...@@ -14,12 +14,22 @@
<ul class="nav-links"> <ul class="nav-links">
<li><a href="index.html">Inicio</a></li> <li><a href="index.html">Inicio</a></li>
<li><a href="registro.html">Registrarse</a></li> <li><a href="registro.html">Registrarse</a></li>
<li><a href="login.html">Iniciar Sesión</a></li>
<li><a href="ofertas.html">Ofertas de Prácticas</a></li> <li><a href="ofertas.html">Ofertas de Prácticas</a></li>
</ul> </ul>
</nav> </nav>
<div class="hero-section"> <div class="hero-section">
<h1>Conectando Talento con Oportunidades</h1> <h1>Conectando Talento con Oportunidades</h1>
<p>Encuentra la práctica perfecta para avanzar en tu carrera.</p> <p>Encuentra la práctica perfecta para avanzar en tu carrera.</p>
<br>
<p>La plataforma líder para conectar a los estudiantes de la Universidad de
Jaén con oportunidades de prácticas en empresas, facultades y con profesores.
En UJAdin, nuestra misión es facilitar el puente entre la educación y el mundo
profesional, proporcionando una plataforma donde los alumnos pueden encontrar
prácticas que enriquezcan su aprendizaje y experiencia profesional.
Ya sea que estés buscando dar tus primeros pasos en el mundo laboral o una
empresa buscando talento fresco y motivado, UJAdin es tu punto de encuentro.</p>
<a href="ofertas.html" class="btn">Ver Ofertas de Prácticas</a>
</div> </div>
</div> </div>
</header> </header>
......
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Registro - UJAdin</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<div class="container">
<nav class="navbar">
<a href="index.html" class="logo">UJAdin</a>
<ul class="nav-links">
<li><a href="index.html">Inicio</a></li>
<li><a href="registro.html">Registrarse</a></li>
<li><a href="login.html">Iniciar Sesión</a></li>
<li><a href="ofertas.html">Ofertas de Prácticas</a></li>
</ul>
</nav>
</div>
</header>
<main>
<div class="form-container">
<form class="registration-form">
<h2>Iniciar sesión</h2>
<div class="form-group">
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
</div>
<div class="form-group">
<label for="password">Contraseña:</label>
<input type="password" id="password" name="password" required>
</div>
<button type="submit">Entrar</button>
</form>
</div>
</main>
<footer>
<div class="container">
<p>&copy; 2024 UJAdin. Todos los derechos reservados.</p>
</div>
</footer>
</body>
</html>
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
<ul class="nav-links"> <ul class="nav-links">
<li><a href="index.html">Inicio</a></li> <li><a href="index.html">Inicio</a></li>
<li><a href="registro.html">Registrarse</a></li> <li><a href="registro.html">Registrarse</a></li>
<li><a href="login.html">Iniciar Sesión</a></li>
<li><a href="ofertas.html">Ofertas de Prácticas</a></li> <li><a href="ofertas.html">Ofertas de Prácticas</a></li>
</ul> </ul>
</nav> </nav>
...@@ -24,8 +25,18 @@ ...@@ -24,8 +25,18 @@
<section class="offers-section"> <section class="offers-section">
<h2>Ofertas de Prácticas</h2> <h2>Ofertas de Prácticas</h2>
<div class="offer-card"> <div class="offer-card">
<h3>Oferta de Práctica 1</h3> <h3>Asistente web de la Facultad de ciencias experimentales</h3>
<p>Descripción breve de la oferta de práctica...</p> <p>Se necesita un estudiante en el grado de Ingerniería Informática para ayudar en la gestión de la web de la facultad</p>
<button class="btn">Solicitar</button>
</div>
<div class="offer-card">
<h3>Ayuda en laboratorio Biología</h3>
<p>Se necesita un estudiante en el grado de Biología o Química para ayudar en la investigación del departamento</p>
<button class="btn">Solicitar</button>
</div>
<div class="offer-card">
<h3>Asistente de documentos</h3>
<p>Se necesita un estudiante en el grado de derecho para ayudar en la gestión documental de la facultad</p>
<button class="btn">Solicitar</button> <button class="btn">Solicitar</button>
</div> </div>
</section> </section>
......
...@@ -14,38 +14,37 @@ ...@@ -14,38 +14,37 @@
<ul class="nav-links"> <ul class="nav-links">
<li><a href="index.html">Inicio</a></li> <li><a href="index.html">Inicio</a></li>
<li><a href="registro.html">Registrarse</a></li> <li><a href="registro.html">Registrarse</a></li>
<li><a href="login.html">Iniciar Sesión</a></li>
<li><a href="ofertas.html">Ofertas de Prácticas</a></li> <li><a href="ofertas.html">Ofertas de Prácticas</a></li>
</ul> </ul>
</nav> </nav>
</div> </div>
</header> </header>
<main> <main>
<div class="container"> <div class="form-container">
<section class="form-section"> <form class="registration-form">
<h2>Registro</h2> <h2>Registro</h2>
<form action="submit_registration" method="post"> <div class="form-group">
<div class="form-group"> <label for="tipoUsuario">Tipo de Usuario:</label>
<label for="nombre">Nombre:</label> <select id="tipoUsuario" name="tipoUsuario">
<input type="text" id="nombre" name="nombre" required> <option value="alumno">Alumno</option>
</div> <option value="empresa">Empresa/Facultad/Profesor</option>
<div class="form-group"> </select>
<label for="email">Correo electrónico:</label> </div>
<input type="email" id="email" name="email" required> <div class="form-group">
</div> <label for="nombre">Nombre:</label>
<div class="form-group"> <input type="text" id="nombre" name="nombre" required>
<label for="password">Contraseña:</label> </div>
<input type="password" id="password" name="password" required> <div class="form-group">
</div> <label for="email">Email:</label>
<div class="form-group"> <input type="email" id="email" name="email" required>
<label for="tipo_usuario">Tipo de usuario:</label> </div>
<select id="tipo_usuario" name="tipo_usuario"> <div class="form-group">
<option value="alumno">Alumno</option> <label for="password">Contraseña:</label>
<option value="empresa">Empresa/Facultad/Profesor</option> <input type="password" id="password" name="password" required>
</select> </div>
</div> <button type="submit">Registrarse</button>
<button type="submit" class="btn">Registrarse</button> </form>
</form>
</section>
</div> </div>
</main> </main>
<footer> <footer>
......
...@@ -25,6 +25,8 @@ body { ...@@ -25,6 +25,8 @@ body {
} }
.navbar { .navbar {
background-color: var(--primary-color);
color: var(--background-color);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -32,7 +34,7 @@ body { ...@@ -32,7 +34,7 @@ body {
} }
.logo { .logo {
color: var(--primary-color); /* Logo en dorado */ color: var(--secondary-color);
text-decoration: none; text-decoration: none;
font-weight: bold; font-weight: bold;
font-size: 24px; font-size: 24px;
...@@ -54,6 +56,9 @@ body { ...@@ -54,6 +56,9 @@ body {
.hero-section h1, .hero-section p { .hero-section h1, .hero-section p {
color: var(--secondary-color); color: var(--secondary-color);
display: flex;
justify-content: center; /* Centra el contenido horizontalmente */
margin-top: 20px; /* Espacio arriba del botón */
} }
footer { footer {
...@@ -69,3 +74,72 @@ footer { ...@@ -69,3 +74,72 @@ footer {
footer p { footer p {
color: var(--background-color); color: var(--background-color);
} }
.form-container {
max-width: 400px;
margin: 50px auto;
padding: 20px;
background-color: #1a1a1a;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.registration-form {
display: flex;
flex-direction: column;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
color: #d4af37;
margin-bottom: 5px;
}
.form-group input,
.form-group select {
width: 100%;
padding: 10px;
margin-top: 5px;
border-radius: 5px;
border: 1px solid #ccc;
box-sizing: border-box;
}
button {
background-color: #d4af37;
color: #ffffff;
padding: 10px;
border: none;
border-radius: 5px;
cursor: pointer;
margin-top: 20px;
}
button:hover {
background-color: #b7950b;
}
h2 {
text-align: center;
color: #ffffff;
}
.btn {
display: inline-block;
background-color: var(--primary-color);
color: #ffffff;
padding: 10px 20px;
margin-top: 20px;
margin-bottom: 20px;
text-align: center;
text-decoration: none;
border-radius: 5px;
transition: background-color 0.3s;
}
.btn:hover {
background-color:var(--primary-color), 10%;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment