hacklab/resetea.net
1
0
Fork 1
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

feat: rediseño visual completo — slider, dark theme, hero unificado

Browse source 
- Dark theme en index (class=page-dark): fondo #1a1714, títulos ácido, botones nav crema
- Hero-landing con gradiente animado ácido→caoba aplicado a los 7 htmls
- Slider 3 slides (crossfade CSS + JS): crowd-phones / surveillance / legal-action
- Imágenes descargadas localmente (CSP img-src 'self')
- Botón RESETEA hero: verde ácido, fuente Recion, tipografía grande centrada
- Cards de estudios con enlaces a fuente original
- CSP ampliada: img-src añade cdn.simpleicons.org para chips de redes

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
hacklab 2026-04-26 23:34:41 +02:00
parent d49da56e87
commit 467820b8b3
15 changed files with 2552 additions and 566 deletions
Download patch file Download diff file Expand all files Collapse all files

38
public/tipos.html
View file

@ -11,25 +11,19 @@
<body>
<header class="topbar">
<div class="container topbar-inner">
<div class="brand">
<div class="brand-logo">R</div>
<div class="brand-text">
<div class="brand-name">RESETEA<span>.NET</span></div>
<div class="brand-tag">Privacidad sin custodios</div>
</div>
<section class="hero-landing">
<div class="container hero-landing-inner">
<h1 class="main-title">RESETEA</h1>
<div class="landing-nav">
<a class="landing-nav-btn landing-nav-btn--highlight" href="tipos.html">Tipos de información</a>
<a class="landing-nav-btn" href="concienciacion.html">Concienciación</a>
<a class="landing-nav-btn" href="egosurfing.html">Egosurfing</a>
<a class="landing-nav-btn" href="plantillas.html">Resetea</a>
<a class="landing-nav-btn" href="stats.html">Estadísticas</a>
<a class="landing-nav-btn" href="salud-digital.html">🧠 Salud digital</a>
</div>
<nav class="nav" aria-label="Navegación principal">
<a class="nav-btn nav-btn--primary" href="tipos.html">Tipos de información</a>
<a class="nav-btn" href="concienciacion.html">Concienciación</a>
<a class="nav-btn" href="index.html">Resetea</a>
<a class="nav-btn" href="egosurfing.html">Egosurfing</a>
<a class="nav-btn" href="stats.html">Estadísticas</a>
</nav>
</div>
</header>
</section>
<main>
@ -81,14 +75,18 @@
</div>
</section>
<section id="mapa" class="panel">
<div class="container">
<section id=”mapa” class=”panel”>
<div class=”container”>
<h2>Mapa de tipos de información personal</h2>
<p class="section-desc">
<p class=”section-desc”>
No todos los datos “pesan” igual. Los <strong>identificadores</strong> permiten localizarte;
los <strong>atributos</strong> te describen; la <strong>actividad</strong> te perfila.
Los ecosistemas publicitarios y los data brokers suelen unirlo todo por correlación.
</p>
<p class=”section-desc” style=”margin-top:0.5rem;font-size:0.82rem;”>
Marco legal: <a href=”https://eur-lex.europa.eu/legal-content/ES/TXT/HTML/?uri=CELEX:32016R0679#d1e1489-1-1” target=”_blank” rel=”noopener” style=”color:var(--caoba);”>RGPD Art. 4 — Definiciones de dato personal →</a>
· <a href=”https://www.ftc.gov/reports/data-brokers” target=”_blank” rel=”noopener” style=”color:var(--caoba);”>FTC Data Broker Report →</a>
</p>
<div class="grid">