Mudanças entre as edições de "Widget:MapaControle"
Ir para navegação
Ir para pesquisar
| (12 revisões intermediárias pelo mesmo usuário não estão sendo mostradas) | |||
| Linha 1: | Linha 1: | ||
<includeonly> | |||
<style> | |||
@keyframes mapa-highlight-pulse { | |||
0% { | |||
transform: translate(-50%, -50%) scale(0.5); | |||
opacity: 1; | |||
} | |||
100% { | |||
transform: translate(-50%, -50%) scale(2); | |||
opacity: 0; | |||
} | |||
} | |||
.mapa-highlight { | |||
animation: mapa-highlight-pulse 0.6s ease-out 3; | |||
} | |||
.mapa-visualizador-padrao { | |||
border-width: 6px; | |||
border-style: solid; | |||
border-image: linear-gradient(to top, #412b22, #8a6d58) 1; | |||
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()">↑</button> | |||
<button class="down" onclick="window.mapaViewer_meu_mapa.nextFloor()">↓</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> | ||