lbehm/workadventure
1
0
Fork 0
Code Issues Pull requests Releases Activity

woka icon inside menu

Browse source
This commit is contained in:
Hanusiak Piotr 2021-12-07 14:56:42 +01:00
parent b36f39d3d9
commit 731f616cce
2 changed files with 11 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
front/src/Components/Menu/ProfileSubMenu.svelte
View file

@ -15,7 +15,7 @@
import btnProfileSubMenuCamera from "../images/btn-menu-profile-camera.svg";
import btnProfileSubMenuIdentity from "../images/btn-menu-profile-identity.svg";
import btnProfileSubMenuCompanion from "../images/btn-menu-profile-companion.svg";
import btnProfileSubMenuWoka from "../images/btn-menu-profile-woka.svg";
import Woka from "../Woka/Woka.svelte";
function disableMenuStores() {
menuVisiblilityStore.set(false);
@ -65,7 +65,10 @@
<span class="btn-hover">Edit your name</span>
</button>
<button type="button" class="nes-btn" on:click|preventDefault={openEditSkinScene}>
<img src={btnProfileSubMenuWoka} alt="Edit your WOKA" />
<!-- <div class="woka-icon">
</div> -->
<Woka userId={-1} placeholderSrc="" width="26px" height="26px" />
<!-- <img src={btnProfileSubMenuWoka} alt="Edit your WOKA" /> -->
<span class="btn-hover">Edit your WOKA</span>
</button>
<button type="button" class="nes-btn" on:click|preventDefault={openEditCompanionScene}>

12
front/src/Components/Woka/Woka.svelte
View file

@ -5,6 +5,8 @@
export let userId: number;
export let placeholderSrc: string;
export let width: string = "62px";
export let height: string = "62px";
const gameScene = gameManager.getCurrentGameScene();
const playerWokaPictureStore = gameScene.getUserWokaPictureStore(userId);
@ -17,16 +19,14 @@
onDestroy(unsubscribe);
</script>
<img {src} alt="" class="nes-pointer" />
<img {src} alt="" class="nes-pointer" style="--theme-width: {width}; --theme-height: {height}" />
<style>
img {
display: block;
display: inline-block;
pointer-events: auto;
width: 60px;
height: 60px;
left: calc(50% - 30px);
top: calc(50% - 30px);
width: var(--theme-width);
height: var(--theme-height);
margin: 0;
padding: 0;
image-rendering: pixelated;