-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
executable file
·125 lines (112 loc) · 6.41 KB
/
Copy pathindex.html
File metadata and controls
executable file
·125 lines (112 loc) · 6.41 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<!DOCTYPE html>
<html lang="es-AR">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>BA Protege+ · Control parental y bloqueo de sitios de apuestas</title>
<meta name="description" content="MVP funcional de BA Protege+: app de control parental de LOTBA para bloquear el acceso de menores a plataformas de apuestas. Modo Responsable y Modo Dispositivo protegido, en vivo.">
<meta name="theme-color" content="#0D1B2A">
<meta property="og:title" content="BA Protege+ · Control parental LOTBA">
<meta property="og:description" content="Un adulto responsable configura la protección, el dispositivo del menor la ejecuta. Bloqueo, alertas y anti-bypass en un MVP navegable.">
<meta property="og:type" content="website">
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 2 4 7v9c0 7 5 12 12 14 7-2 12-7 12-14V7z' fill='%230D1B2A'/%3E%3Cpath d='M16 6 8 9.4V16c0 5 3.4 8.8 8 10.5 4.6-1.7 8-5.5 8-10.5V9.4z' fill='%23FFC61E'/%3E%3C/svg%3E">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Archivo+Black&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/assets/styles.css">
</head>
<body>
<header class="tope">
<div class="marca">
<svg class="escudo" viewBox="0 0 32 32" aria-hidden="true">
<path d="M16 2 4 7v9c0 7 5 12 12 14 7-2 12-7 12-14V7z" fill="currentColor"/>
<path d="M16 6 8 9.4V16c0 5 3.4 8.8 8 10.5 4.6-1.7 8-5.5 8-10.5V9.4z" fill="#FFC61E"/>
<path d="m12.4 16.2 2.6 2.6 5-5.2" fill="none" stroke="#0D1B2A" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<span class="marca-txt">
<b>BA Protege+</b>
<small>Lotería de la Ciudad de Buenos Aires · LOTBA SE</small>
</span>
</div>
<div class="tope-acciones">
<button class="btn-fantasma" id="btn-recorrido" type="button">Reproducir recorrido</button>
<button class="btn-fantasma" id="btn-reiniciar" type="button">Reiniciar</button>
</div>
</header>
<main>
<section class="portada">
<h1>Un teléfono cuida al otro.</h1>
<p class="bajada">
BA Protege+ es una sola aplicación con dos modos. El adulto responsable configura la
protección desde su teléfono; el dispositivo del chico o la chica la ejecuta y no la puede
apagar. Todo lo que ves abajo funciona: vinculá los dos equipos, activá la protección,
intentá entrar a un sitio de apuestas y mirá cómo llega la alerta del otro lado.
</p>
<dl class="cifras">
<div><dt>+2.000</dt><dd>plataformas de apuestas no autorizadas bloqueadas por LOTBA y la Fiscalía Especializada en Juegos de Azar</dd></div>
<div><dt>9</dt><dd>operadores con permiso vigente en CABA, todos bajo dominio <code>.bet</code>: el resto es juego ilegal</dd></div>
<div><dt>772</dt><dd>URL bloqueadas en la red WiFi de las escuelas públicas porteñas y en BA WIFI</dd></div>
</dl>
</section>
<section class="banco" aria-label="Simulador de los dos dispositivos">
<div class="conmutador" role="tablist" aria-label="Elegir dispositivo">
<button role="tab" id="tab-resp" aria-controls="tel-responsable" aria-selected="true" class="activo" type="button">Responsable</button>
<button role="tab" id="tab-prot" aria-controls="tel-protegido" aria-selected="false" type="button">Dispositivo protegido</button>
</div>
<article class="columna" id="col-responsable">
<h2 class="rotulo">Teléfono del adulto responsable</h2>
<div class="telefono">
<div class="barra-estado"><span id="reloj-resp">08:14</span><span class="iconos-estado">▮▮▮ ⌁ 87%</span></div>
<div class="pantalla" id="tel-responsable" role="tabpanel" aria-labelledby="tab-resp"></div>
<div class="pastilla-alertas" id="pastilla-resp" aria-live="polite"></div>
</div>
</article>
<div class="canal" aria-hidden="true">
<span class="canal-linea"></span>
<span class="canal-txt" id="canal-txt">sin vincular</span>
<span class="canal-linea"></span>
</div>
<article class="columna" id="col-protegido">
<h2 class="rotulo">Teléfono del menor</h2>
<div class="telefono protegido">
<div class="barra-estado"><span id="reloj-prot">08:14</span><span class="iconos-estado" id="icono-vpn">▮▮▮ ⌁ 62%</span></div>
<div class="pantalla" id="tel-protegido" role="tabpanel" aria-labelledby="tab-prot"></div>
<div class="pastilla-alertas" id="pastilla-prot" aria-live="polite"></div>
</div>
</article>
</section>
<section class="bitacora">
<div class="bitacora-cab">
<h2>Registro de eventos</h2>
<p>Cada acción del dispositivo protegido queda asentada acá y viaja al perfil responsable. Es la misma
tabla que en producción vive en el backend y alimenta el historial y las alertas.</p>
</div>
<ol id="lista-eventos" class="eventos"></ol>
</section>
<section class="cobertura">
<h2>Qué cubre este MVP</h2>
<div class="grilla-cobertura" id="grilla-cobertura"></div>
<p class="nota">
La lista oficial se sincroniza con el conjunto de datos abierto
<a href="https://data.buenosaires.gob.ar/dataset/lotba" rel="noopener">Juego ilegal en línea · Sitios web bloqueados</a>
publicado por la Gerencia de Control de Juegos y Apuestas de LOTBA. En esta demo se
distribuye con los nueve operadores permisionados en CABA —bloqueados igual, porque
ningún menor de 18 puede apostar en ellos— más el motor heurístico que detecta los dominios
que rotan todas las semanas. La lista completa de dominios ilegales se descarga en tiempo de
ejecución desde el backend y no se publica en el cliente.
</p>
</section>
</main>
<footer class="pie">
<p><b>BA Protege+</b> · Producto digital para LOTBA SE · innova.lab, Agencia de Habilidades para el Futuro</p>
<p>MVP construido por Bitcoin.defi · Salta, Argentina</p>
<p class="pie-links">
<a href="https://github.com/Bitcoindefi" rel="noopener">github.com/Bitcoindefi</a>
<a href="tel:08006666006">Juego problemático: 0800-666-6006 (LOTBA)</a>
<a href="tel:108">Línea 108 · GCBA</a>
</p>
</footer>
<div class="brindis" id="brindis" role="status" aria-live="polite"></div>
<script src="/assets/app.js"></script>
</body>
</html>