blob: 71496264aaca55d6717ecb358c70e4a3bdabbc75 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
<!--
@component
A tooltip that looks like when you hover over a Minecraft item in an inventory. This requires JavaScript.
-->
<script lang="ts">
import { registerItem } from '$lib/GlobalTooltip'
import { onMount } from 'svelte'
let el
onMount(() => {
registerItem(el)
})
</script>
<span class="minecraft-tooltip" bind:this={el}>
<span class="tooltip-name">
<slot name="name" />
</span><span class="tooltip-lore">
<slot name="lore" />
</span><slot />
</span>
<style>
.minecraft-tooltip {
/* this makes it be less dumb about the height so it doesn't add extra or anything */
display: grid;
/* this is so it doesn't change width to fill the container in the item list page */
max-width: fit-content;
}
/* these elements exist so we can copy them later from GlobalTooltip */
.tooltip-name,
.tooltip-lore {
display: none;
}
</style>
|
