dan/Mangades
1
0
Fork 0
mirror of https://github.com/danbulant/Mangades synced 2026-07-05 19:10:58 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix art list for non-mangadex images

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

33
src/lib/components/artList.svelte
View file

@ -11,7 +11,9 @@
}[] = []; }[] = [];
let list: any; 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; export var selectedImage = null;
</script> </script>
@ -21,14 +23,26 @@
Loading art Loading art
{:then list} {:then list}
{#each list.data.sort((a, b) => a.attributes.volume - b.attributes.volume) as item} {#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} {/each}
{/await} {/await}
{#each additionalList as item} {#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} {/each}
</div> </div>
<style> <style>
div { div {
display: grid; display: grid;
@ -43,15 +57,18 @@
height: 10rem; height: 10rem;
width: auto; width: auto;
--box-shadow-color: white; --box-shadow-color: white;
box-shadow: 0 0 0 0 var(--box-shadow-color); object-fit: contain;
transition: box-shadow 0.2s ease-in-out; transition: filter 0.2s ease-in-out;
filter: drop-shadow(0 0 0 0 var(--box-shadow-color));
} }
div img:first-child { div img:first-child {
grid-column: 1 / span 2; grid-column: 1 / span 2;
grid-row: 1 / span 2; grid-row: 1 / span 2;
height: 20rem; height: 20rem;
} }
div img:hover, div img:active, div img:focus { div img:hover,
box-shadow: 0 0 0.5rem var(--box-shadow-color); div img:active,
div img:focus {
filter: drop-shadow(0 0 0.5rem var(--box-shadow-color));
} }
</style> </style>

12
src/routes/[manga]/+page.svelte
View file

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