Equipo repartido
Hora local de cada oficina
- Madrid--:--Referencia
- Nueva York--:--
- Tokio--:--
Relojes de tres ciudades
Tres esferas analógicas con la hora real de cada ciudad y segundero de barrido; de noche la esfera se vuelve oscura.
Ajustes
Código
<section class="uvq07-clk"><header><h3>Equipo repartido</h3><p>Hora local de cada oficina</p></header><ul><li data-tz="Europe/Madrid"><span class="dl" aria-hidden="true"><i style="--i:0"></i><i style="--i:1"></i><i style="--i:2"></i><i style="--i:3"></i><i style="--i:4"></i><i style="--i:5"></i><i style="--i:6"></i><i style="--i:7"></i><i style="--i:8"></i><i style="--i:9"></i><i style="--i:10"></i><i style="--i:11"></i><b class="h"></b><b class="m"></b><b class="s"></b></span><span class="nm">Madrid</span><span class="dg">--:--</span><span class="of">Referencia</span></li><li data-tz="America/New_York"><span class="dl" aria-hidden="true"><i style="--i:0"></i><i style="--i:1"></i><i style="--i:2"></i><i style="--i:3"></i><i style="--i:4"></i><i style="--i:5"></i><i style="--i:6"></i><i style="--i:7"></i><i style="--i:8"></i><i style="--i:9"></i><i style="--i:10"></i><i style="--i:11"></i><b class="h"></b><b class="m"></b><b class="s"></b></span><span class="nm">Nueva York</span><span class="dg">--:--</span><span class="of"> </span></li><li data-tz="Asia/Tokyo"><span class="dl" aria-hidden="true"><i style="--i:0"></i><i style="--i:1"></i><i style="--i:2"></i><i style="--i:3"></i><i style="--i:4"></i><i style="--i:5"></i><i style="--i:6"></i><i style="--i:7"></i><i style="--i:8"></i><i style="--i:9"></i><i style="--i:10"></i><i style="--i:11"></i><b class="h"></b><b class="m"></b><b class="s"></b></span><span class="nm">Tokio</span><span class="dg">--:--</span><span class="of"> </span></li></ul></section>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Cards
Ver todos: CardsDónde usarlo
Los equipos repartidos viven entre husos horarios y las esferas analógicas hacen visible la diferencia de un vistazo. Cada reloj lee la hora real con Intl.DateTimeFormat, mueve las agujas con un barrido suave, muestra la hora digital y la diferencia con la primera ciudad, y pasa a esfera oscura entre las ocho de la tarde y las siete de la mañana. Sirve para páginas de equipo, viajes y reuniones.
El color principal es el bisel y el segundero; el secundario, la esfera nocturna y las agujas. Cambia ciudades y husos en la lista; vale cualquier zona IANA.