From 4c029826d08672645048cb52e9f42ee77cf9b045 Mon Sep 17 00:00:00 2001
From: "christian.julian" <zs22016079@estudiantes.uv.mx>
Date: Sun, 15 Jun 2025 20:33:45 -0600
Subject: [PATCH] fix: pruebas

---
 views/inicio.html | 384 ++++++++--------------------------------------
 1 file changed, 60 insertions(+), 324 deletions(-)
diff --git a/views/inicio.html b/views/inicio.html
index 3a0c44a..0c86d36 100644
--- a/views/inicio.html
+++ b/views/inicio.html
@@ -1,143 +1,85 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-	<meta charset="UTF-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	<link href='https://unpkg.com/boxicons@2.0.9/css/boxicons.min.css' rel='stylesheet'>
-	<link rel="stylesheet" href="../css/inicio.css">
-	
-	<title>AdminSite</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link href='https://unpkg.com/boxicons@2.0.9/css/boxicons.min.css' rel='stylesheet'>
+    <link rel="stylesheet" href="assets/fontawesome/css/fontawesome.css">
+    <link rel="stylesheet" href="assets/fontawesome/css/brands.css">
+    <link rel="stylesheet" href="assets/fontawesome/css/solid.css">
+    <style>
+        /* Selects e inputs de fecha */
+        select#id_rango_edad,
+        select#id_genero,
+        select#id_examen,
+        input[type="date"] {
+            width: 100%;
+            padding: 8px 12px;
+            border: 1px solid #ccc;
+            border-radius: 6px;
+            font-size: 14px;
+            background-color: #fff;
+            color: #333;
+            font-family: inherit;
+            transition: border-color 0.2s ease;
+        }
+
+        select#id_rango_edad:focus,
+        select#id_genero:focus,
+        select#id_examen:focus,
+        input[type="date"]:focus {
+            border-color: #4a90e2;
+            outline: none;
+        }
+
+        /* Botones Buscar y Limpiar */
+        button#buscar,
+        button#limpiar,
+        button#limpiar2 {
+            padding: 8px 20px;
+            font-size: 14px;
+            border: 1px solid #4a90e2;
+            border-radius: 6px;
+            background-color: #fff;
+            color: #4a90e2;
+            cursor: pointer;
+            font-family: inherit;
+            transition: background-color 0.2s ease, color 0.2s ease;
+            margin-top: 10px;
+            margin-right: 10px;
+        }
+
+        button#buscar:hover,
+        button#limpiar:hover,
+        button#limpiar2:hover {
+            background-color: #4a90e2;
+            color: white;
+        }
+    </style>
+
     <link rel="stylesheet" href="../css/inicio.css">
     <title>AdminSite</title>
 </head>
 <body>
-	
-	<!-- SIDEBAR -->
-	<section id="sidebar">
-		<a href="inicio.html" class="brand"><i class='bx bx-code-alt icon' ></i> LANIA</a>
     <!-- SIDEBAR -->
     <section id="sidebar">
         <a href="inicio.html" class="brand"><i class='bx bx-code-alt icon'></i> LANIA</a>
         <ul class="side-menu">
-            <li><a href="#" class="active"><i class='bx bxs-dashboard icon'></i> Dashboard</a></li>
-            <li class="divider" data-text="main">Main</li>
-            <li>
-                <a href="#"><i class='bx bxs-inbox icon'></i> Elements <i class='bx bx-chevron-right icon-right'></i></a>
-                <ul class="side-dropdown">
-                    <li><a href="#">Alert</a></li>
-                    <li><a href="#">Badges</a></li>
-                    <li><a href="#">Breadcrumbs</a></li>
-                    <li><a href="#">Button</a></li>
-                </ul>
-            </li>
-            <li><a href="#"><i class='bx bxs-chart icon'></i> Charts</a></li>
-            <li><a href="#"><i class='bx bxs-widget icon'></i> Widgets</a></li>
-            <li class="divider" data-text="tablas y formularios">Tablas y formularios</li>
-            <li><a href="#"><i class='bx bx-table icon'></i> Tablas</a></li>
-            <li>
-                <a href="#"><i class='bx bxs-notepad icon'></i> Formularios <i class='bx bx-chevron-right icon-right'></i></a>
-                <ul class="side-dropdown">
-                    <li><a href="formulario-candidato.html">Registro de candidato</a></li>
-                    <li><a href="formulario-datos-candidato.php">Datos de candidato</a></li>
-                </ul>
-            </li>
-        </ul>
+            <li><a href="inicio.html" class="active"><i class="fa-solid fa-home-user icon"></i> Dashboard</a></li>
+            <li><a href="formulario-candidato.html" target="_blank"><i class="fa-solid fa-list icon"></i> Formulario de registro</a></li>
+            <li><a href="control-candidatos.php"><i class="fa-solid fa-users-line icon"></i>Control candidatos</a></li>
+            <li><a href="control-usuarios.php"><i class="fa-solid fa-users-gear icon"></i>Control usuario</a></li>
+			<li><a href="consultar-api.html"><i class="fa-solid fa-globe icon"></i> API</a></li>
+            <li><a href="../controllers/cerrarSesion.php"><i class="fa-solid fa-right-to-bracket icon"></i> Cerrar sesión</a></li>
+		</ul>
     </section>
     <!-- SIDEBAR -->
 
-		<ul class="side-menu">
-			<li><a href="#" class="active"><i class='bx bxs-dashboard icon' ></i> Dashboard</a></li>
-			<li class="divider" data-text="main">Main</li>
-			<li>
-				<a href="#"><i class='bx bxs-inbox icon' ></i> Elements <i class='bx bx-chevron-right icon-right' ></i></a>
-				<ul class="side-dropdown">
-					<li><a href="#">Alert</a></li>
-					<li><a href="#">Badges</a></li>
-					<li><a href="#">Breadcrumbs</a></li>
-					<li><a href="#">Button</a></li>
-				</ul>
-			</li>
-			<li><a href="#"><i class='bx bxs-chart icon' ></i> Charts</a></li>
-			<li><a href="#"><i class='bx bxs-widget icon' ></i> Widgets</a></li>
-			<li class="divider" data-text="tablas y formularios">Tablas y formularios</li>
-			<li><a href="#"><i class='bx bx-table icon' ></i> Tablas</a></li>
-			<li>
-				<a href="#"><i class='bx bxs-notepad icon' ></i> Formularios <i class='bx bx-chevron-right icon-right' ></i></a>
-				<ul class="side-dropdown">
-					<li><a href="formulario-candidato.html">Registro de candidato</a></li>
-					<li><a href="formulario-datos-candidato.php">Datos de candidato</a></li>
-				</ul>
-			</li>
-		</ul>
-		<!-- <div class="ads">
-			<div class="wrapper">
-				<a href="#" class="btn-upgrade">Upgrade</a>
-				<p>Become a <span>PRO</span> member and enjoy <span>All Features</span></p>
-			</div>
-		</div> -->
-	</section>
-	<!-- SIDEBAR -->
     <section id="content">
         <nav>
             <i class='bx bx-menu toggle-sidebar'></i>
-            <form action="#">
-                <div class="form-group">
-                    <input type="text" placeholder="Buscar...">
-                    <i class='bx bx-search icon'></i>
-                </div>
-            </form>
-            <a href="#" class="nav-link">
-                <i class='bx bxs-bell icon'></i>
-                <span class="badge">5</span>
-            </a>
-            <a href="#" class="nav-link">
-                <i class='bx bxs-message-square-dots icon'></i>
-                <span class="badge">8</span>
-            </a>
-            <span class="divider"></span>
-            <div class="profile">
-                <img src="https://images.unsplash.com/photo-1517841905240-472988babdf9?ixid=MnwxMjA3fDB8MHxzZWFyY2h8NHx8cGVvcGxlfGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="">
-                <ul class="profile-link">
-                    <li><a href="#"><i class='bx bxs-user-circle icon'></i> Profile</a></li>
-                    <li><a href="#"><i class='bx bxs-cog'></i> Settings</a></li>
-                    <li><a href="#"><i class='bx bxs-log-out-circle'></i> Logout</a></li>
-                </ul>
-            </div>
         </nav>
 
-	<!-- NAVBAR -->
-	<section id="content">
-		<!-- NAVBAR -->
-		<nav>
-			<i class='bx bx-menu toggle-sidebar' ></i>
-			<form action="#">
-				<div class="form-group">
-					<input type="text" placeholder="Buscar...">
-					<i class='bx bx-search icon' ></i>
-				</div>
-			</form>
-			<a href="#" class="nav-link">
-				<i class='bx bxs-bell icon' ></i>
-				<span class="badge">5</span>
-			</a>
-			<a href="#" class="nav-link">
-				<i class='bx bxs-message-square-dots icon' ></i>
-				<span class="badge">8</span>
-			</a>
-			<span class="divider"></span>
-			<div class="profile">
-				<img src="https://images.unsplash.com/photo-1517841905240-472988babdf9?ixid=MnwxMjA3fDB8MHxzZWFyY2h8NHx8cGVvcGxlfGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="">
-				<ul class="profile-link">
-					<li><a href="#"><i class='bx bxs-user-circle icon' ></i> Profile</a></li>
-					<li><a href="#"><i class='bx bxs-cog' ></i> Settings</a></li>
-					<li><a href="#"><i class='bx bxs-log-out-circle' ></i> Logout</a></li>
-				</ul>
-			</div>
-		</nav>
-		<!-- NAVBAR -->
         <main>
             <h1 class="title">Dashboard</h1>
             <ul class="breadcrumbs">
@@ -146,14 +88,6 @@
                 <li><a href="#" class="active">Dashboard</a></li>
             </ul>
 
-		<!-- MAIN -->
-		<main>
-			<h1 class="title">Dashboard</h1>
-			<ul class="breadcrumbs">
-				<li><a href="#">Home</a></li>
-				<li class="divider">/</li>
-				<li><a href="#" class="active">Dashboard</a></li>
-			</ul>
             <div class="select-data">
                 <div class="card">
                     <div class="head">
@@ -230,12 +164,6 @@
                 </div>
             </div>
 
-			<!--Añadido nuevo -->
-			<div class="select-data">
-				<div class="card">
-					<div class="head">
-					<i class='bx bx-trending-up icon'></i>
-					</div>
             <div>
                 <br>
                 <h3>Promedio de géneros:</h3>
@@ -276,22 +204,6 @@
                 </div>
             </div>
 
-					
-					<div style="display: flex; gap: 20px; margin: 10px 0;">
-					<!-- Campo: Edad -->
-					<div style="flex: 1;">
-						<label class="form-label" for="id_rango_edad">Edad</label>
-						<select class="border rounded-pill shadow-sm form-select" id="id_rango_edad" required>
-						<option value="NULL">Seleccione una opción</option>
-						<option value="1">18-24</option>
-						<option value="2">24-34</option>
-						<option value="3">35-44</option>
-						<option value="4">44-54</option>
-						<option value="4">55-64</option>
-						<option value="5">65 o más</option>
-						<option value="6">Menor de 18</option>
-						</select>
-					</div>
             <div class="data">
                 <div class="content-data">
                     <div class="head">
@@ -361,182 +273,6 @@
         </main>
     </section>
 
-					<!-- Campo: Género -->
-					<div style="flex: 1;">
-   					<label class="form-label" for="id_genero" style="margin: 10px 0px 5px;">Género</label>
-    				<select class="border rounded-pill shadow-sm form-select" id="id_genero" required>
-        						<option value="NULL">Seleccione una opción</option>
-								<option value="1">Masculino</option>
-								<option value="2">Femenino</option>
-								<option value="3">Prefiero no decir</option>
-							</select>
-					</div>
-
-					<div style="flex: 1;">
-						<label class="form-label" for="id_examen" style="margin: 10px 0px 5px;">Examen</label>
-						<select class="border rounded-pill shadow-sm form-select" id="id_examen" required="">
-							<option value="NULL">Seleccione una opción</option>
-							<option value="1">Amazon Web Services</option>
-							<option value="2">Cisco</option>
-							<option value="3">CompTIA</option>
-							<option value="4">Fortinet</option>
-							<option value="5">Google Cloud Platform</option>
-							<option value="6">IBM</option>
-							<option value="7">Juniper Networks</option>
-							<option value="8">Microsoft</option>
-							<option value="9">Oracle</option>
-							<option value="10">Otros</option>
-							<option value="11">Palo Alto Networks</option>
-							<option value="12">Red Hat</option>
-							<option value="13">Salesforce</option>
-							<option value="14">SAP</option>
-							<option value="15">VMware</option>
-						</select>
-					</div>
-				</div>
-
-			<h2>Fecha</h2>
-			<h3>Ingresa una fecha de inicio:</h3>
-			<br>
-			<input type="date" id="date1" name="date1">
-			<h3>Ingresa una fecha de final:</h3>
-			<input type="date" id="date2" name="date2">
-			<br>
-			<button type="button" id="buscar">Buscar</button>
-			<button type="button" id="limpiar">Limpiar</button>
-			<br>
-				<div class="content-data">
-					<div class="head">
-						<h3>Resultado de registros en el rango de fecha ingresado</h3>
-						<div class="menu">
-						</div>
-					</div>
-					<div class="chart">
-						<div id="chart5"></div>
-					</div>
-				</div>
-			</div>
-
-			<div>
-				<br>
-				<h3>Promedio de géneros:</h3>
-				<div class="info-data">
-					<div class="card" id="card-femenino">
-					<div class="head">
-						<div style="display: flex; align-items: center; gap: 8px;">
-						<i class='bx bx-female' style="font-size: 24px; color: #e91e63;"></i>
-						<div>
-							<h2>0</h2>
-							<p>Femenino</p>
-						</div>
-						</div>
-					</div>
-					</div>
-
-					<div class="card" id="card-masculino">
-					<div class="head">
-						<div style="display: flex; align-items: center; gap: 8px;">
-						<i class='bx bx-male' style="font-size: 24px; color: #2196f3;"></i>
-						<div>
-							<h2>0</h2>
-							<p>Masculino</p>
-						</div>
-						</div>
-						
-					</div>
-					</div>
-
-					<div class="card" id="card-nodefinido">
-					<div class="head">
-						<div style="display: flex; align-items: center; gap: 8px;">
-						<i class='bx bx-male' style="font-size: 24px; color: black;"></i>
-						<div>
-							<h2>0</h2>
-							<p>Prefiero no decirlo</p>
-						</div>
-						</div>
-					</div>
-					</div>
-				</div>
-			</div>
-
-
-			<div class="data">
-				<div class="content-data">
-					<div class="head">
-						<h3>Generos</h3>
-						<div class="menu">
-							<i class='bx bx-dots-horizontal-rounded icon'></i>
-							<ul class="menu-link">
-								<li><a href="#">Edit</a></li>
-								<li><a href="#">Save</a></li>
-								<li><a href="#">Remove</a></li>
-							</ul>
-						</div>
-					</div>
-					<div class="chart">
-						<div id="chart"></div>
-					</div>
-				</div>
-				<div class="content-data">
-					<div class="head">
-						<h3>Edades</h3>
-						<div class="menu">
-							<i class='bx bx-dots-horizontal-rounded icon'></i>
-							<ul class="menu-link">
-								<li><a href="#">Edit</a></li>
-								<li><a href="#">Save</a></li>
-								<li><a href="#">Remove</a></li>
-							</ul>
-						</div>
-					</div>
-					<div class="chart">
-						<div id="chart2"></div>
-					</div>
-				</div>
-				<div class="content-data">
-					<div class="head">
-						<h3>Estados</h3>
-						<div class="menu">
-							<i class='bx bx-dots-horizontal-rounded icon'></i>
-							<ul class="menu-link">
-								<li><a href="#">Edit</a></li>
-								<li><a href="#">Save</a></li>
-								<li><a href="#">Remove</a></li>
-							</ul>
-						</div>
-					</div>
-					<div class="chart">
-						<div id="chart3"></div>
-					</div>
-				</div>
-				<div class="content-data">
-					<div class="head">
-						<h3>Examenes</h3>
-						<div class="menu">
-							<i class='bx bx-dots-horizontal-rounded icon'></i>
-							<ul class="menu-link">
-								<li><a href="#">Edit</a></li>
-								<li><a href="#">Save</a></li>
-								<li><a href="#">Remove</a></li>
-							</ul>
-						</div>
-					</div>
-					<div class="chart">
-						<div id="chart4"></div>
-					</div>
-				</div>
-			</div>
-			</div>
-		</main>
-		<!-- MAIN -->
-	</section>
-	<!-- NAVBAR -->
-
-	<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
-	<script type="module" src="../js/inicio.js"></script>
-	<script src="https://website-widgets.pages.dev/dist/sienna.min.js" defer></script>
-	<script src="../js/tarjetasPromedio.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
     <script type="module" src="../js/inicio.js"></script>
     <script src="https://website-widgets.pages.dev/dist/sienna.min.js" defer></script>
