fix art list for non-mangadex images

This commit is contained in:
Daniel Bulant 2022-12-10 16:40:31 +01:00
parent 1b61c3f806
commit ea72132b43
2 changed files with 32 additions and 13 deletions

View file

@ -11,7 +11,9 @@
}[] = [];
let list: any;
$: list = request("cover?manga[]=" + mangaId + "&locales[]=en&locales[]=uk&locales[]=ja");
$: list = request(
"cover?manga[]=" + mangaId + "&locales[]=en&locales[]=uk&locales[]=ja"
);
export var selectedImage = null;
</script>
@ -21,14 +23,26 @@
Loading art
{:then list}
{#each list.data.sort((a, b) => a.attributes.volume - b.attributes.volume) as item}
<img on:click={() => selectedImage = `${imageproxy}https://uploads.mangadex.org/covers/${mangaId}/${item.attributes.fileName}.512.jpg`} width=512 height=805 src="{imageproxy}https://uploads.mangadex.org/covers/{mangaId}/{item.attributes.fileName}.512.jpg" alt="" draggable={false}>
<img
on:click={() => (selectedImage = `${imageproxy}https://uploads.mangadex.org/covers/${mangaId}/${item.attributes.fileName}.512.jpg`)}
width="512"
height="805"
src="{imageproxy}https://uploads.mangadex.org/covers/{mangaId}/{item.attributes.fileName}.512.jpg"
alt=""
draggable={false} />
{/each}
{/await}
{#each additionalList as item}
<img on:click={() => selectedImage = item.src} style="{item.color ? "--box-shadow-color: " + item.color : ""};" width={item.width} height={item.height} src="{item.src}" alt="{item.alt}" draggable={false}>
<img
on:click={() => (selectedImage = item.src)}
style="{item.color ? '--box-shadow-color: ' + item.color : ''}; width: 100%; height: 100%; {item.width ? `grid-column: span ${item.width}` : ""}; {item.height ? `grid-row: span ${item.height}` : ""};"
src={item.src}
alt={item.alt}
draggable={false} />
{/each}
</div>
<style>
div {
display: grid;
@ -43,15 +57,18 @@
height: 10rem;
width: auto;
--box-shadow-color: white;
box-shadow: 0 0 0 0 var(--box-shadow-color);
transition: box-shadow 0.2s ease-in-out;
object-fit: contain;
transition: filter 0.2s ease-in-out;
filter: drop-shadow(0 0 0 0 var(--box-shadow-color));
}
div img:first-child {
grid-column: 1 / span 2;
grid-row: 1 / span 2;
height: 20rem;
}
div img:hover, div img:active, div img:focus {
box-shadow: 0 0 0.5rem var(--box-shadow-color);
div img:hover,
div img:active,
div img:focus {
filter: drop-shadow(0 0 0.5rem var(--box-shadow-color));
}
</style>

View file

@ -54,11 +54,11 @@
$: if(chapters?.id !== mangaId && !loadingChapters) {
loadingChapters = true;
getMangaChapters(mangaId).then(async data => {
chapters = data;
await tick();
swiper.slideToClosest();
chapters = data;
await tick();
swiper.slideToClosest();
loadingChapters = false;
});
});
}
@ -319,7 +319,9 @@
additionalImages.push({
src: data.bannerImage,
alt: "Banner image",
color: data.coverImage.color
color: data.coverImage.color,
height: 1,
width: 3
});
additionalImages = additionalImages;
}