Mudanças entre as edições de "Widget:MapaControle"

De Wiki Gla
Ir para navegação Ir para pesquisar
 
(4 revisões intermediárias pelo mesmo usuário não estão sendo mostradas)
Linha 2: Linha 2:


<style>
<style>
.mapa-visualizador-padrao {
@keyframes mapa-highlight-pulse {
  border: 10px double blue; /* A cor interna é o background, ou defina border-color */
    0% {
  outline: 5px solid red; /
        transform: translate(-50%, -50%) scale(0.5);
background: #cacaca;
        opacity: 1;
padding: 10pt;
    }
    100% {
        transform: translate(-50%, -50%) scale(2);
        opacity: 0;
    }
}
}
</style>
 
<div>
.mapa-highlight {
    <button onclick="window.mapaViewer_<!--{$id}-->.prevFloor()">⬆️ Subir</button>
    animation: mapa-highlight-pulse 0.6s ease-out 3;
    <button onclick="window.mapaViewer_<!--{$id}-->.nextFloor()">⬇️ Descer</button>
}
    <button onclick="window.mapaViewer_<!--{$id}-->.zoomIn()">🔍 +</button>
            .mapa-visualizador-padrao {
    <button onclick="window.mapaViewer_<!--{$id}-->.zoomOut()">🔍 -</button>
                border-width: 6px;
    <button onclick="window.mapaViewer_<!--{$id}-->.goToFloor(0)">🎯 Ir para Térreo</button>
                border-style: solid;
    <button onclick="window.mapaViewer_<!--{$id}-->.goToFloor(1)">🎯 Ir para Primeiro</button>
                border-image: linear-gradient(to top, #412b22, #8a6d58) 1;
</div>
                border-radius: 10px;
                background: black;
                padding: 1pt;
                position: relative;
                display: inline-table;
 
                .botoes-interativos {
                    position: absolute;
                    bottom: -13px;
                    right: 0px;
 
                }
 
                .botoes-interativos {
                    button {
                        width: 25px;
                        height: 25px;
                        border-radius: 50%;
                        border: 2px solid #5a4632;
                        background: radial-gradient(circle at 30% 30%, #a98a6a, #aa855f);
                        box-shadow:
                            inset 0 2px 3px rgba(255, 255, 255, 0.4),
                            inset 0 -3px 5px rgba(0, 0, 0, 0.6),
                            0 2px 3px rgba(0, 0, 0, 0.5);
                        cursor: pointer;
                        color: white;
                        font-weight: bolder;
                        margin-left: 5px;
                    }
                    /* Efeito pressionado */
                    button:active {
                        box-shadow:
                            inset 0 3px 6px rgba(0, 0, 0, 0.8),
                            0 1px 1px rgba(0, 0, 0, 0.5);
                        transform: translateY(1px);
                    }
 
                }
 
 
            }
        </style>
        <div class="botoes-interativos">
            <button class="up" onclick="window.mapaViewer_meu_mapa.prevFloor()">&uparrow;</button>
            <button class="down" onclick="window.mapaViewer_meu_mapa.nextFloor()">&downarrow;</button>
            <button class="plus" onclick="window.mapaViewer_meu_mapa.zoomIn()">+</button>
            <button class="minus" onclick="window.mapaViewer_meu_mapa.zoomOut()">-</button>
        </div>
 
        <button onclick="window.mapaViewer_meu_mapa.goToCoordinates(246, 496, 1.5, 2)">Ir para Tesouro</button>
</includeonly>
</includeonly>

Edição atual tal como às 17h09min de 11 de abril de 2026

Disponível em “https://wiki.gla.com.br/index.php?title=Widget:MapaControle&oldid=46024”