diff options
| author | Fuwn <[email protected]> | 2024-04-15 20:05:53 -0700 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-04-15 20:05:53 -0700 |
| commit | d703b06447a48a8239cfa2416277d3266f92a913 (patch) | |
| tree | 4c28ec9ee7f8c2e3cfd65267940eacd7131eab28 /src/lib/Tools/SequelSpy.svelte | |
| parent | feat(anime): image tooltip (diff) | |
| download | due.moe-d703b06447a48a8239cfa2416277d3266f92a913.tar.xz due.moe-d703b06447a48a8239cfa2416277d3266f92a913.zip | |
feat: replace hover cover with image tooltip
Diffstat (limited to 'src/lib/Tools/SequelSpy.svelte')
| -rw-r--r-- | src/lib/Tools/SequelSpy.svelte | 32 |
1 files changed, 3 insertions, 29 deletions
diff --git a/src/lib/Tools/SequelSpy.svelte b/src/lib/Tools/SequelSpy.svelte index 94a7be62..2aaa5f60 100644 --- a/src/lib/Tools/SequelSpy.svelte +++ b/src/lib/Tools/SequelSpy.svelte @@ -9,16 +9,10 @@ import { page } from '$app/stores'; import { browser } from '$app/environment'; import { season as getSeason } from '$lib/Media/Anime/season'; - import { - onMouseEnter, - onMouseLeave, - onMouseMove, - type HoverCoverResponse - } from '$lib/Media/Cover/hoverCover'; - import HoverCover from '$lib/Media/Cover/HoverCover.svelte'; import Skeleton from '$lib/Loading/Skeleton.svelte'; import identity from '$stores/identity'; import LogInRestricted from '$lib/Error/LogInRestricted.svelte'; + import tooltip from '$lib/Tooltip/tooltip'; export let user: AniListAuthorisation; @@ -26,7 +20,6 @@ const urlParameters = browser ? new URLSearchParams(window.location.search) : null; let year = parseOrDefault(urlParameters, 'year', new Date().getFullYear()); let season = parseOrDefault(urlParameters, 'season', getSeason()); - let hoverCoverState: HoverCoverResponse = {}; $: { if (year.toString().length === 4 && $identity.id !== -2 && user) @@ -70,25 +63,8 @@ <a href={`https://anilist.co/anime/${prequel.id}`} target="_blank" - on:mouseenter={() => { - const response = onMouseEnter(prequel); - - hoverCoverState.hovering = response.hovering; - hoverCoverState.item = response.item; - hoverCoverState.media = response.media; - }} - on:mouseleave={() => { - const response = onMouseLeave(); - - hoverCoverState.hovering = response.hovering; - hoverCoverState.item = response.item; - hoverCoverState.media = response.media; - }} - on:mousemove={(e) => { - const response = onMouseMove(e, 300); - - hoverCoverState.style = response.style; - }} + title={`<img src="${prequel.coverImage.extraLarge}" style="width: 250px; object-fit: cover; border-radius: 8px;" />`} + use:tooltip > <MediaTitle title={prequel.title} /> </a> @@ -105,6 +81,4 @@ The count ratio is the number of episodes you've seen of any direct prequels, and the total number of episodes of all direct prequels. </div> - - <HoverCover options={hoverCoverState} width={300} /> {/if} |