Rosa de los vientos de orientación
Una brújula de pergamino con ocho sectores: marca hacia dónde mira la casa y la aguja gira con efecto muelle.
Ajustes
Código
<fieldset class="uvq05-cp"><legend>Orientación</legend><div class="rs"><div class="dl"><label style="--i:0"><input type="checkbox" aria-label="Norte"><span class="w"></span></label><label style="--i:1"><input type="checkbox" aria-label="Noreste"><span class="w"></span></label><label style="--i:2"><input type="checkbox" aria-label="Este" checked><span class="w"></span></label><label style="--i:3"><input type="checkbox" aria-label="Sureste" checked><span class="w"></span></label><label style="--i:4"><input type="checkbox" aria-label="Sur" checked><span class="w"></span></label><label style="--i:5"><input type="checkbox" aria-label="Suroeste"><span class="w"></span></label><label style="--i:6"><input type="checkbox" aria-label="Oeste"><span class="w"></span></label><label style="--i:7"><input type="checkbox" aria-label="Noroeste"><span class="w"></span></label></div><svg class="st" viewBox="0 0 100 100" aria-hidden="true"><path d="M50 50L60 40L50 4L40 40z" fill="#7a5a2a"/><path d="M50 50L60 60L50 96L40 60z" fill="#7a5a2a"/><path d="M50 50L60 40L96 50L60 60z" fill="#a9844a"/><path d="M50 50L40 40L4 50L40 60z" fill="#a9844a"/><path d="M50 50l6-6 18-18-24 12zM50 50l6 6 18 18-24-12zM50 50l-6 6-18 18 24-12zM50 50l-6-6-18-18 24 12z" fill="#c9a86a" opacity=".8"/></svg><span class="cd cn" aria-hidden="true">Norte</span><span class="cd ce" aria-hidden="true">Este</span><span class="cd cs" aria-hidden="true">Sur</span><span class="cd cw" aria-hidden="true">Oeste</span><span class="nd" aria-hidden="true"></span><span class="hub" aria-hidden="true"></span></div><p class="ct"><span>Orientaciones:</span> <span class="n"></span></p></fieldset>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 Filtros
Ver todos: FiltrosDónde usarlo
La orientación importa al buscar vivienda, terraza o placas solares, y una brújula la enseña mejor que una lista de palabras. Ocho cuñas con casilla se recortan dentro de un círculo sobre una esfera de pergamino con anillo de grados, y cada elección rellena su sector desde el centro mientras la aguja gira por el camino más corto.
El primer color rellena los sectores elegidos y la punta de la aguja, y el segundo define el pergamino. Deja cortos los nombres cardinales en otros idiomas y muestra también las orientaciones elegidas como texto junto a los resultados.