| @@ -9,7 +9,7 @@ | |||||
| </div> | </div> | ||||
| <div class="explore-statblock"> | <div class="explore-statblock"> | ||||
| <Statblock :subject="world.player" /> | <Statblock :subject="world.player" /> | ||||
| <button @click="$emit('profile')">Show profile</button> | |||||
| <button class="show-profile" @click="$emit('profile')">Show profile</button> | |||||
| </div> | </div> | ||||
| <div class="explore-wallet"> | <div class="explore-wallet"> | ||||
| <WalletView :subject="world.player" /> | <WalletView :subject="world.player" /> | ||||
| @@ -231,6 +231,36 @@ export default class Explore extends Vue { | |||||
| opacity: 0; | opacity: 0; | ||||
| } | } | ||||
| .show-profile { | |||||
| grid-area: var(--nav-direction); | |||||
| padding: 5%; | |||||
| background: #555; | |||||
| color: #ccc; | |||||
| font-size: 1rem; | |||||
| border-color: #ccc; | |||||
| border-width: 3px; | |||||
| border-radius: 8px; | |||||
| border-style: outset; | |||||
| outline: none; | |||||
| width: 100%; | |||||
| height: 4rem; | |||||
| z-index: 1; | |||||
| user-select: none; | |||||
| } | |||||
| .show-profile:hover { | |||||
| background: #666; | |||||
| } | |||||
| .show-profile:active { | |||||
| background: #777; | |||||
| border-style: inset; | |||||
| } | |||||
| .show-profile:focus { | |||||
| background: #666; | |||||
| } | |||||
| </style> | </style> | ||||
| <style> | <style> | ||||