workadventure/front/src/Components/Menu/MenuIcon.svelte
David Négrier f0b83663f6 Fixing broken sound controls
Because of the rework of the menu, the clickable zone for the menu was extending at the complete top of the screen, which caused interactive items at the top of the screen (like sound controls) to be broken.

This commit fixes this.
2021-09-13 10:06:08 +02:00

41 lines
887 B
Svelte

<script lang="typescript">
import logoWA from "../images/logo-WA-min.png"
import {menuVisiblilityStore} from "../../Stores/MenuStore";
import {get} from "svelte/store";
function showMenu(){
menuVisiblilityStore.set(!get(menuVisiblilityStore))
}
function onKeyDown(e: KeyboardEvent) {
if (e.key === "Tab") {
showMenu();
}
}
</script>
<svelte:window on:keydown={onKeyDown}/>
<main class="menuIcon">
<img src={logoWA} alt="open menu" class="nes-pointer" on:click|preventDefault={showMenu}>
</main>
<style lang="scss">
.menuIcon {
margin: 25px;
img {
pointer-events: auto;
width: 60px;
padding-top: 0;
}
}
@media only screen and (max-width: 800px), only screen and (max-height: 800px) {
.menuIcon {
margin: 3px;
img {
width: 50px;
}
}
}
</style>