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

De Wiki Gla
Ir para navegação Ir para pesquisar
Linha 2: Linha 2:


<style>
<style>
.mapa-visualizador-padrao {
            .mapa-visualizador-padrao {
  border: 10px double blue; /* A cor interna é o background, ou defina border-color */
                border-width: 6px;
  outline: 5px solid red; /
                border-style: solid;
background: #cacaca;
                border-image: linear-gradient(to top, #412b22, #8a6d58) 1;
padding: 10pt;
                border-radius: 10px;
}
                background: black;
</style>
                padding: 1pt;
<div>
                position: relative;
    <button onclick="window.mapaViewer_<!--{$id}-->.prevFloor()">⬆️ Subir</button>
                display: inline-table;
    <button onclick="window.mapaViewer_<!--{$id}-->.nextFloor()">⬇️ Descer</button>
 
    <button onclick="window.mapaViewer_<!--{$id}-->.zoomIn()">🔍 +</button>
                .botoes-interativos {
    <button onclick="window.mapaViewer_<!--{$id}-->.zoomOut()">🔍 -</button>
                    position: absolute;
    <button onclick="window.mapaViewer_<!--{$id}-->.goToFloor(0)">🎯 Ir para Térreo</button>
                    bottom: -13px;
    <button onclick="window.mapaViewer_<!--{$id}-->.goToFloor(1)">🎯 Ir para Primeiro</button>
                    right: 0px;
</div>
 
                }
 
                .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>
</includeonly>
</includeonly>

Edição das 16h57min de 11 de abril de 2026