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

fix image aspect ratio

Browse source
This commit is contained in:
Daniel Bulant 2022-12-12 17:00:46 +01:00
parent 6da687ffd3
commit 000dafb61c
2 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/lib/components/anilistItems.svelte
View file

@ -66,7 +66,7 @@
{#each lists as list} {#each lists as list}
<h2>{list.name}</h2> <h2>{list.name}</h2>
{#each list.entries.sort((a, b) => a.priority - b.priority) as entry (entry.media.id)} {#each list.entries.sort((a, b) => a.priority - b.priority) as entry (entry.media.id)}
<div animate:flip transition:blur> <div class="h-full" animate:flip transition:blur>
<Item <Item
r18={entry.media.isAdult} r18={entry.media.isAdult}
cover={entry.media.coverImage.large} cover={entry.media.coverImage.large}
@ -107,4 +107,7 @@
.items.list { .items.list {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
.h-full {
height: 100%;
}
</style> </style>

7
src/lib/components/item.svelte
View file

@ -74,7 +74,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.item.grid { .item.grid {
width: 100%; height: 100%;
} }
h3 { h3 {
margin: 0; margin: 0;
@ -98,6 +98,7 @@
.flex { .flex {
display: flex; display: flex;
gap: 1rem; gap: 1rem;
height: 100%;
} }
.cover-container { .cover-container {
position: relative; position: relative;
@ -147,6 +148,10 @@
--box-shadow-color: white; --box-shadow-color: white;
border-radius: 5px; border-radius: 5px;
max-width: 100%; max-width: 100%;
max-height: 100%;
height: 100%;
width: auto;
object-fit: cover;
box-shadow: 0 0 0 var(--box-shadow-color); box-shadow: 0 0 0 var(--box-shadow-color);
transition: .4s box-shadow, .3s max-height, .4s filter; transition: .4s box-shadow, .3s max-height, .4s filter;
} }