111 lines
4.2 KiB
HTML
111 lines
4.2 KiB
HTML
<!doctype html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport"
|
|
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<title>OncoDiario</title>
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="css/estilos.css">
|
|
</head>
|
|
<body>
|
|
<div class="page-shell">
|
|
<header class="topbar container">
|
|
<div class="brand" aria-label="OncoDiario logo">
|
|
<span class="brand-mark">O</span>
|
|
<span>OncoDiario</span>
|
|
</div>
|
|
|
|
<nav class="topbar-nav" aria-label="Navegación principal">
|
|
<a href="#info">Inicio</a>
|
|
<a href="#info">Qué incluye</a>
|
|
<a href="seguimiento.html">Seguimiento</a>
|
|
</nav>
|
|
|
|
<a class="btn btn-primary" href="seguimiento.html">Abrir seguimiento</a>
|
|
</header>
|
|
|
|
<main class="container hero">
|
|
<section class="hero-copy">
|
|
<span class="eyebrow">Cuidado personalizado</span>
|
|
<h1>Tu tratamiento, monitorizado con claridad.</h1>
|
|
<p>
|
|
Registra sesiones, revisa síntomas y lleva un control semanal de tu evolución
|
|
para acompañarte mejor en cada fase del tratamiento.
|
|
</p>
|
|
|
|
<div class="actions">
|
|
<a class="btn btn-primary" href="seguimiento.html">Ir a seguimiento</a>
|
|
<a class="btn btn-secondary" href="#info">Más información</a>
|
|
</div>
|
|
|
|
<ul class="mini-stats" aria-label="Estadísticas rápidas">
|
|
<li>
|
|
<strong>12</strong>
|
|
<span>semanas</span>
|
|
</li>
|
|
<li>
|
|
<strong>3</strong>
|
|
<span>registros</span>
|
|
</li>
|
|
<li>
|
|
<strong>24/7</strong>
|
|
<span>seguimiento</span>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<aside class="hero-panel" aria-label="Resumen del tratamiento">
|
|
<div class="panel-header">
|
|
<span class="status-dot"></span>
|
|
<span>Resumen del paciente</span>
|
|
</div>
|
|
|
|
<div class="panel-card">
|
|
<p class="label">Tratamiento actual</p>
|
|
<h3>Quimioterapia</h3>
|
|
</div>
|
|
|
|
<div class="panel-metrics">
|
|
<div>
|
|
<small>Próxima sesión</small>
|
|
<strong>15 oct</strong>
|
|
</div>
|
|
<div>
|
|
<small>Estado</small>
|
|
<strong>Estable</strong>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel-progress">
|
|
<div class="progress-labels">
|
|
<span>Progreso semanal</span>
|
|
<strong>68%</strong>
|
|
</div>
|
|
<div class="progress-bar">
|
|
<span></span>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
</main>
|
|
|
|
<section id="info" class="container features" aria-label="Características principales">
|
|
<article class="feature-card">
|
|
<h2>Calendario</h2>
|
|
<p>Organiza sesiones, fechas de tratamiento y revisiones médicas.</p>
|
|
</article>
|
|
<article class="feature-card">
|
|
<h2>Síntomas</h2>
|
|
<p>Controla fatiga, náuseas, dolor y bienestar general cada semana.</p>
|
|
</article>
|
|
<article class="feature-card">
|
|
<h2>Consulta</h2>
|
|
<p>Prepara preguntas y anota observaciones para tus citas con el equipo.</p>
|
|
</article>
|
|
</section>
|
|
</div>
|
|
</body>
|
|
</html> |