Spaces:

doctorlinux
/

cibertest

Sleeping

App Files Files Community

doctorlinux commited on Oct 14, 2025

Commit

2c5a1ac

verified ·

1 Parent(s): d36b7b1

Upload index.html

Browse files

Files changed (1) hide show

index.html +239 -345

index.html CHANGED Viewed

@@ -1,354 +1,248 @@
 <!DOCTYPE html>
 <html lang="es">
 <head>
-<meta charset="UTF-8">
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>Autoevaluación de Ciberseguridad Operativa - Doctor Linux</title>
-<style>
-  body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;background:#f5f6f5;margin:0;padding:0}
-  .dlx-wrap{max-width:960px;margin:auto;padding:16px}
-  .dlx-card{background:#fff;border:1px solid #e6ebef;border-radius:16px;box-shadow:0 6px 24px rgba(0,0,0,.06);padding:22px;margin:14px 0}
-  .dlx-title{font-size:28px;margin:0 0 4px;color:#214424}
-  .dlx-sub{color:#5c6b5f;margin-bottom:16px}
-  .dlx-progress{height:10px;background:#eff4f0;border-radius:999px;overflow:hidden;margin:10px 0 18px}
-  .dlx-bar{height:100%;width:0;background:#7fbf7f;transition:width .3s}
-  .dlx-q h4{margin:0 0 6px;font-size:18px}
-  .dlx-options{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 12px}
-  .dlx-pill{border:1px solid #d7e1d9;padding:8px 12px;border-radius:999px;cursor:pointer}
-  .dlx-pill input{display:none}
-  .dlx-pill.active{background:#214424;color:#fff;border-color:#214424}
-  .dlx-nav{display:flex;gap:10px;justify-content:space-between;margin-top:8px}
-  .dlx-btn{background:#214424;color:#fff;border:none;border-radius:10px;padding:12px 16px;cursor:pointer;transition:all 0.3s}
-  .dlx-btn:hover{background:#1a361c}
-  .dlx-btn[disabled]{opacity:.5;cursor:not-allowed}
-  .dlx-meter{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin:8px 0}
-  .dlx-badge{font-weight:600}
-  .dlx-tag{display:inline-block;background:#eff4f0;border:1px solid #dfe9e2;border-radius:8px;padding:6px 10px;margin:6px 6px 0 0}
-  .dlx-note{color:#6a786d}
-  .dlx-score{font-size:40px;font-weight:800;color:#214424}
-  .dlx-muted{color:#7b8b7f}
-  /* Modal Styles */
-  .modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:1000;justify-content:center;align-items:center}
-  .modal-content{background:white;padding:30px;border-radius:15px;width:90%;max-width:400px;text-align:center;box-shadow:0 10px 40px rgba(0,0,0,0.2)}
-</style>
 </head>
 <body>
-<div class="dlx-wrap" id="dlxApp">
-  <div class="dlx-card">
-    <h2 class="dlx-title">Autoevaluación de Ciberseguridad Operativa</h2>
-    <div class="dlx-sub">Responde con honestidad. Obtendrás tu <b>puntaje</b>, los <b>riesgos clave</b> y un plan sugerido de mejora.</div>
-    <div class="dlx-progress"><div class="dlx-bar" id="dlxBar"></div></div>
-    <div class="dlx-note dlx-muted" id="dlxStepNote"></div>
-  </div>
-  <div id="dlxSteps"></div>
-  <div class="dlx-card" id="dlxNavBox">
-    <div class="dlx-nav">
-      <button class="dlx-btn" id="prevBtn">← Anterior</button>
-      <button class="dlx-btn" id="nextBtn">Siguiente →</button>
-    </div>
-  </div>
-  <!-- MODAL PARA CAPTURAR EMAIL -->
-  <div id="emailModal" class="modal">
-    <div class="modal-content">
-      <h3 style="color: #214424; margin-bottom: 15px;">📧 Recibe tu Informe Completo</h3>
-      <p style="color: #5c6b5f; margin-bottom: 20px;">Ingresa tu email y te enviaremos el análisis detallado a gerencia@doctorlinux.com</p>
-      <input type="email" id="userEmail" placeholder="tu.email@empresa.com"
-             style="width: 100%; padding: 12px; border: 2px solid #e6ebef; border-radius: 8px; margin-bottom: 15px; font-size: 16px;"
-             onkeypress="if(event.key=='Enter') sendResultsToEmail()">
-      <div style="display: flex; gap: 10px; justify-content: center;">
-        <button onclick="closeEmailModal()"
-                style="background: #6a786d; color: white; border: none; padding: 12px 20px; border-radius: 8px; cursor: pointer;">
-          Cancelar
-        </button>
-        <button onclick="sendResultsToEmail()"
-                style="background: #214424; color: white; border: none; padding: 12px 20px; border-radius: 8px; cursor: pointer; font-weight: bold;">
-          Enviar Informe
-        </button>
-      </div>
-    </div>
-  </div>
-  <div class="dlx-card" id="dlxResult" style="display:none">
-    <h3 class="dlx-title">Tu diagnóstico</h3>
-    <div class="dlx-sub">Este resultado es orientativo. Si quieres un informe firmado por ingeniería, solicita el <b>diagnóstico gratuito</b>.</div>
-    <div style="display:flex;gap:24px;align-items:center;flex-wrap:wrap">
-      <div>
-        <div class="dlx-muted">Puntaje global</div>
-        <div class="dlx-score" id="dlxScore">—%</div>
-        <div class="dlx-tag" id="dlxLabel">—</div>
-      </div>
-      <div style="flex:1;min-width:260px">
-        <div class="dlx-progress"><div class="dlx-bar" id="dlxBarFinal" style="background:#3aa655"></div></div>
-        <div class="dlx-note">≈ Mayor a 80%: postura sólida. 60–79%: revisar. Menor a 60%: riesgo elevado.</div>
-      </div>
-    </div>
-    <div class="dlx-card" style="margin-top:16px">
-      <h4 style="margin:0 0 8px">Detalle por dominio</h4>
-      <div id="dlxBreakdown" class="dlx-meter"></div>
-    </div>
-    <div class="dlx-card">
-      <h4 style="margin:0 0 8px">Recomendaciones inmediatas</h4>
-      <div id="dlxRecs"></div>
-      <div class="dlx-note" style="margin-top:8px">Tip: prioriza los dominios con menor puntaje. Podemos ayudarte a cerrar brechas con <b>hardening, firewalls, backups 3-2-1 y monitoreo 24/7</b>.</div>
-    </div>
-    <!-- BOTONES DE ACCIÓN MEJORADOS -->
-    <div class="dlx-nav" style="margin-top:25px">
-      <button class="dlx-btn" onclick="window.location.reload()">Refrescar test</button>
-      <button class="dlx-btn" id="analyzeBtn">🔍 Analizar con IA</button>
-      <button class="dlx-btn" onclick="openEmailModal()" style="background:#3aa655">📧 Recibir Informe PDF</button>
-    </div>
-    <div id="iaBox" class="dlx-card" style="display:none;margin-top:16px">
-      <h4>Análisis generado por IA</h4>
-      <pre id="iaOutput" style="white-space:pre-wrap;"></pre>
     </div>
-  </div>
-</div>
-<script>
-/* === CONFIGURACIÓN INICIAL === */
-const DOMAINS = [
-  { id:'perimetro',  name:'Perímetro / Firewall', qs:[
-    '¿Usas un firewall dedicado (Mikrotik/OPNsense/etc.) con reglas mínimas por servicio?',
-    '¿Tienes listas de acceso/geo-bloqueo/IPS/DoS activas?',
-    '¿Los servicios expuestos están detrás de NAT o Port-Forward controlado?',
-    '¿Hay políticas VPN de acceso remoto con 2FA?'
-  ]},
-  { id:'servers', name:'Servidores / Hardening', qs:[
-    '¿Cuentas con hardening básico (SSH seguro, usuarios/roles, auditoría)?',
-    '¿Actualizaciones y parches aplicados regularmente?',
-    '¿Servicios innecesarios deshabilitados/controlados?'
-  ]},
-  { id:'backups', name:'Backups y Recuperación', qs:[
-    '¿Aplicas la regla 3-2-1 (3 copias, 2 medios, 1 offsite)?',
-    '¿Pruebas de restauración realizadas en los últimos 6 meses?',
-    '¿Backups protegidos contra ransomware (inmutables/air-gap)?'
-  ]},
-  { id:'monitor', name:'Monitoreo y Alertas', qs:[
-    '¿Monitoreo centralizado (Zabbix/PRTG/Grafana) con alertas 24/7?',
-    '¿Métricas revisadas mensualmente?',
-    '¿Alertas integradas con soporte?'
-  ]},
-  { id:'network', name:'Red y Conectividad', qs:[
-    '¿Segmentación VLANs para aislar servicios críticos?',
-    '¿Control de ancho de banda/Proxy/filtrado de contenidos?',
-    '¿Wi-Fi empresarial con WPA2-Enterprise?'
-  ]},
-  { id:'endpoints', name:'Usuarios / Estaciones', qs:[
-    '¿Antimalware/EDR y políticas de actualización?',
-    '¿Gestión de contraseñas y MFA?',
-    '¿Políticas de mínimo privilegio + bloqueo de USB?'
-  ]},
-  { id:'webmail', name:'Web y Correo', qs:[
-    '¿Sitios con HTTPS válido y cabeceras seguras?',
-    '¿Correo con SPF, DKIM y DMARC publicados?',
-    '¿WAF/antispam/antiphishing activos?'
-  ]}
-];
-const SCALE = [
-  {label:'No',score:0},
-  {label:'Parcial',score:50},
-  {label:'Sí',score:100},
-  {label:'No sé',score:null}
-];
-const RECS = {
-  perimetro:'Endurecer perímetro: reglas mínimo necesario, VPN 2FA, IDS/IPS y protección DoS.',
-  servers:'Aplicar hardening, cuentas/roles y mantener parches al día.',
-  backups:'Implementar 3-2-1 con pruebas de restauración y backups inmutables.',
-  monitor:'Centralizar monitoreo (Zabbix/PRTG) y definir umbrales.',
-  network:'Segregar VLANs, reforzar proxy y aislar Wi-Fi invitados.',
-  endpoints:'Mínimo privilegio, EDR/antimalware y MFA.',
-  webmail:'Forzar HTTPS, cabeceras OWASP, SPF+DKIM+DMARC y WAF.'
-};
-let current = 0, answers = {};
-const steps = document.getElementById('dlxSteps'),
-      bar = document.getElementById('dlxBar'),
-      note = document.getElementById('dlxStepNote'),
-      prev = document.getElementById('prevBtn'),
-      next = document.getElementById('nextBtn'),
-      result = document.getElementById('dlxResult'),
-      nav = document.getElementById('dlxNavBox');
-/* === FUNCIONES PRINCIPALES === */
-function render() {
-  steps.innerHTML = '';
-  const d = DOMAINS[current];
-  note.innerHTML = `<b>${current+1}/${DOMAINS.length}</b> · ${d.name}`;
-  const card = document.createElement('div');
-  card.className = 'dlx-card';
-  card.innerHTML = `<h3 class="dlx-title">${d.name}</h3>`;
-  d.qs.forEach((q, i) => {
-    const b = document.createElement('div');
-    b.className = 'dlx-q';
-    b.innerHTML = `<h4>${q}</h4>`;
-    const row = document.createElement('div');
-    row.className = 'dlx-options';
-    SCALE.forEach(opt => {
-      const lbl = document.createElement('label');
-      lbl.className = 'dlx-pill';
-      lbl.textContent = opt.label;
-      lbl.onclick = () => {
-        row.querySelectorAll('.dlx-pill').forEach(p => p.classList.remove('active'));
-        lbl.classList.add('active');
-        if (!answers[d.id]) answers[d.id] = [];
-        answers[d.id][i] = opt.score;
-        updateButtons();
-      };
-      if (answers[d.id] && answers[d.id][i] === opt.score) lbl.classList.add('active');
-      row.appendChild(lbl);
-    });
-    b.appendChild(row);
-    card.appendChild(b);
-  });
-  steps.appendChild(card);
-  bar.style.width = Math.round(current / DOMAINS.length * 100) + '%';
-  updateButtons();
-}
-function allAnswered(i) {
-  const d = DOMAINS[i];
-  return answers[d.id] && answers[d.id].length === d.qs.length && answers[d.id].every(v => v !== undefined);
-}
-function avg(a) {
-  const nums = a.filter(v => typeof v === 'number' && isFinite(v));
-  if (nums.length === 0) return 0;
-  return nums.reduce((x, y) => x + y, 0) / nums.length;
-}
-function updateButtons() {
-  prev.disabled = current === 0;
-  const last = current === DOMAINS.length - 1;
-  next.textContent = last ? 'Ver resultado →' : 'Siguiente →';
-  next.disabled = !allAnswered(current);
-}
-prev.onclick = () => { if (current > 0) { current--; render(); } };
-next.onclick = () => {
-  if (current < DOMAINS.length - 1) {
-    if (!allAnswered(current)) return;
-    current++; render();
-  } else {
-    if (!allAnswered(current)) return;
-    showResult();
-  }
-};
-function showResult() {
-  bar.style.width = '100%';
-  nav.style.display = 'none';
-  steps.style.display = 'none';
-  note.style.display = 'none';
-  result.style.display = 'block';
-  let weighted = 0, total = 0;
-  const breakdown = document.getElementById('dlxBreakdown'),
-        recs = document.getElementById('dlxRecs');
-  breakdown.innerHTML = '';
-  recs.innerHTML = '';
-  DOMAINS.forEach(d => {
-    const a = answers[d.id] ? avg(answers[d.id]) : 0;
-    weighted += a; total += 100;
-    const pct = Math.round(a);
-    breakdown.innerHTML += `<div>${d.name}</div><div><b>${pct}%</b></div>`;
-    if (pct < 75) { recs.innerHTML += `<div class="dlx-tag">• ${RECS[d.id]}</div>`; }
-  });
-  const global = Math.round(weighted / DOMAINS.length);
-  document.getElementById('dlxScore').textContent = global + '%';
-  document.getElementById('dlxBarFinal').style.width = global + '%';
-  const label = document.getElementById('dlxLabel');
-  if (global >= 80) { label.textContent = 'Nivel Sólido'; label.style.background = '#e7f7e7'; }
-  else if (global >= 60) { label.textContent = 'Nivel Medio (revisar)'; label.style.background = '#fff6e1'; }
-  else { label.textContent = 'Riesgo Alto'; label.style.background = '#ffe9e9'; }
-  // Guardar datos para el análisis IA
-  window.finalData = {
-    overall: global,
-    domains: DOMAINS.map(d => ({
-      name: d.name,
-      score: Math.round(avg(answers[d.id]))
-    }))
-  };
-}
-/* === FUNCIONES DE EMAIL === */
-function openEmailModal() {
-  document.getElementById('emailModal').style.display = 'flex';
-  document.getElementById('userEmail').focus();
-}
-function closeEmailModal() {
-  document.getElementById('emailModal').style.display = 'none';
-  document.getElementById('userEmail').value = '';
-}
-async function sendResultsToEmail() {
-  const email = document.getElementById('userEmail').value;
-  const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-  if (!email || !emailRegex.test(email)) {
-    alert('⚠️ Por favor ingresa un email válido');
-    return;
-  }
-  // Simular envío (en producción esto se conectaría a un backend)
-  const submitBtn = event.target;
-  const originalText = submitBtn.textContent;
-  submitBtn.textContent = 'Enviando...';
-  submitBtn.disabled = true;
-  setTimeout(() => {
-    alert(`✅ Informe enviado correctamente a:\n${email}\n\nTambién se envió copia a: gerencia@doctorlinux.com\n\nRevisa tu bandeja de entrada en los próximos minutos.`);
-    closeEmailModal();
-    submitBtn.textContent = originalText;
-    submitBtn.disabled = false;
-  }, 2000);
-}
-/* === ANÁLISIS CON IA === */
-document.getElementById('analyzeBtn').onclick = async function() {
-  const box = document.getElementById('iaBox');
-  const out = document.getElementById('iaOutput');
-  const btn = this;
-  box.style.display = 'block';
-  out.textContent = 'Generando análisis detallado...';
-  btn.disabled = true;
-  try {
-    const res = await fetch('/analyze', {
-      method: 'POST',
-      headers: {'Content-Type': 'application/json'},
-      body: JSON.stringify(window.finalData)
-    });
-    if (res.ok) {
-      const data = await res.json();
-      out.textContent = data.analysis || 'Análisis completado.';
-    } else {
-      throw new Error('Error del servidor');
-    }
-  } catch (error) {
-    out.textContent = 'El análisis detallado no está disponible en este momento.\n\nPuntaje: ' + window.finalData.overall + '%\n\nPara un diagnóstico completo, contacta a Doctor Linux.';
-  } finally {
-    btn.disabled = false;
-  }
-};
-// Inicializar aplicación
-render();
-</script>
 </body>
 </html>

 <!DOCTYPE html>
 <html lang="es">
 <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Informe de Seguridad | Descarga Directa</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+        }
+        body {
+            background: linear-gradient(135deg, #1a2a6c, #2a3a7c);
+            color: #fff;
+            min-height: 100vh;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            padding: 20px;
+        }
+        .container {
+            max-width: 800px;
+            width: 100%;
+            background: rgba(255, 255, 255, 0.1);
+            backdrop-filter: blur(10px);
+            border-radius: 20px;
+            padding: 40px;
+            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
+            border: 1px solid rgba(255, 255, 255, 0.2);
+        }
+        header {
+            text-align: center;
+            margin-bottom: 30px;
+        }
+        .logo {
+            font-size: 2.5rem;
+            font-weight: 700;
+            margin-bottom: 10px;
+            color: #4fc3f7;
+        }
+        .subtitle {
+            font-size: 1.2rem;
+            opacity: 0.8;
+            margin-bottom: 20px;
+        }
+        .content {
+            display: flex;
+            flex-direction: column;
+            gap: 30px;
+        }
+        .info-section {
+            background: rgba(255, 255, 255, 0.05);
+            padding: 25px;
+            border-radius: 15px;
+            border-left: 4px solid #4fc3f7;
+        }
+        .info-section h2 {
+            margin-bottom: 15px;
+            color: #4fc3f7;
+        }
+        .info-section ul {
+            list-style-type: none;
+            padding-left: 10px;
+        }
+        .info-section li {
+            margin-bottom: 10px;
+            padding-left: 25px;
+            position: relative;
+        }
+        .info-section li:before {
+            content: "•";
+            color: #4fc3f7;
+            font-size: 1.5rem;
+            position: absolute;
+            left: 0;
+            top: -5px;
+        }
+        .download-section {
+            text-align: center;
+            background: rgba(255, 255, 255, 0.05);
+            padding: 30px;
+            border-radius: 15px;
+        }
+        .download-section h2 {
+            margin-bottom: 15px;
+            color: #4fc3f7;
+        }
+        .download-section p {
+            margin-bottom: 25px;
+            opacity: 0.9;
+            font-size: 1.1rem;
+        }
+        .download-btn {
+            display: inline-block;
+            background: linear-gradient(to right, #4fc3f7, #2979ff);
+            color: white;
+            padding: 15px 40px;
+            font-size: 1.2rem;
+            font-weight: 600;
+            border: none;
+            border-radius: 50px;
+            cursor: pointer;
+            transition: all 0.3s ease;
+            text-decoration: none;
+            box-shadow: 0 5px 15px rgba(41, 121, 255, 0.4);
+        }
+        .download-btn:hover {
+            transform: translateY(-3px);
+            box-shadow: 0 8px 20px rgba(41, 121, 255, 0.6);
+        }
+        .features {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+            gap: 20px;
+            margin-top: 20px;
+        }
+        .feature {
+            background: rgba(255, 255, 255, 0.05);
+            padding: 20px;
+            border-radius: 10px;
+            text-align: center;
+        }
+        .feature-icon {
+            font-size: 2.5rem;
+            margin-bottom: 10px;
+            color: #4fc3f7;
+        }
+        footer {
+            margin-top: 40px;
+            text-align: center;
+            font-size: 0.9rem;
+            opacity: 0.7;
+        }
+        @media (max-width: 600px) {
+            .container {
+                padding: 25px;
+            }
+            .logo {
+                font-size: 2rem;
+            }
+            .download-btn {
+                padding: 12px 30px;
+                font-size: 1.1rem;
+            }
+        }
+    </style>
 </head>
 <body>
+    <div class="container">
+        <header>
+            <div class="logo">DoctorLinux</div>
+            <div class="subtitle">Soluciones de Seguridad Informática</div>
+        </header>
+        <div class="content">
+            <div class="info-section">
+                <h2>Análisis de Seguridad Completado</h2>
+                <p>Hemos finalizado la evaluación de seguridad de tu infraestructura. El informe incluye:</p>
+                <ul>
+                    <li>Evaluación de roles NAS y gestión de parches</li>
+                    <li>Análisis de configuración de firewalls</li>
+                    <li>Verificación de estrategia de backups 3-2-1</li>
+                    <li>Revisión de políticas de acceso y MFA</li>
+                    <li>Recomendaciones de hardening</li>
+                </ul>
+            </div>
+            <div class="download-section">
+                <h2>Descarga tu Informe Completo</h2>
+                <p>Obtén tu análisis detallado en PDF al instante</p>
+                <a href="#" class="download-btn" id="downloadBtn">Descargar PDF</a>
+                <div class="features">
+                    <div class="feature">
+                        <div class="feature-icon">📊</div>
+                        <div>Análisis Detallado</div>
+                    </div>
+                    <div class="feature">
+                        <div class="feature-icon">🔒</div>
+                        <div>Evaluación de Seguridad</div>
+                    </div>
+                    <div class="feature">
+                        <div class="feature-icon">⚡</div>
+                        <div>Descarga Inmediata</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <footer>
+            <p>© 2023 DoctorLinux. Todos los derechos reservados.</p>
+        </footer>
     </div>
+    <script>
+        document.getElementById('downloadBtn').addEventListener('click', function(e) {
+            e.preventDefault();
+            // Simulación de descarga
+            const btn = this;
+            const originalText = btn.textContent;
+            btn.textContent = 'Preparando descarga...';
+            btn.style.opacity = '0.7';
+            setTimeout(function() {
+                btn.textContent = '¡Descarga completada!';
+                btn.style.background = 'linear-gradient(to right, #4CAF50, #2E7D32)';
+                setTimeout(function() {
+                    btn.textContent = originalText;
+                    btn.style.opacity = '1';
+                    btn.style.background = 'linear-gradient(to right, #4fc3f7, #2979ff)';
+                    // Aquí iría la lógica real de descarga
+                    alert('En una implementación real, el PDF se descargaría ahora.');
+                }, 2000);
+            }, 1500);
+        });
+    </script>
 </body>
 </html>