aboutsummaryrefslogtreecommitdiff
path: root/src/lib/List/CleanGrid.svelte
diff options
context:
space:
mode:
authorFuwn <[email protected]>2024-10-09 00:41:20 -0700
committerFuwn <[email protected]>2024-10-09 00:41:43 -0700
commit998b63a35256ac985a5a2714dd1ca451af4dfd8a (patch)
tree50796121a9d5ab0330fdc5d7e098bda2860d9726 /src/lib/List/CleanGrid.svelte
parentfeat(graphql): add badgeCount field (diff)
downloaddue.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.tar.xz
due.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.zip
chore(prettier): use spaces instead of tabs
Diffstat (limited to 'src/lib/List/CleanGrid.svelte')
-rw-r--r--src/lib/List/CleanGrid.svelte116
1 files changed, 58 insertions, 58 deletions
diff --git a/src/lib/List/CleanGrid.svelte b/src/lib/List/CleanGrid.svelte
index 18ee51f6..ec93a685 100644
--- a/src/lib/List/CleanGrid.svelte
+++ b/src/lib/List/CleanGrid.svelte
@@ -1,69 +1,69 @@
<script lang="ts">
- import type { Media } from '$lib/Data/AniList/media';
- import ParallaxImage from '$lib/Image/ParallaxImage.svelte';
- import { outboundLink } from '$lib/Media/links';
- import LinkedTooltip from '$lib/Tooltip/LinkedTooltip.svelte';
- import settings from '$stores/settings';
- import { mediaTitle } from './mediaTitle';
- import './covers.css';
+ import type { Media } from '$lib/Data/AniList/media';
+ import ParallaxImage from '$lib/Image/ParallaxImage.svelte';
+ import { outboundLink } from '$lib/Media/links';
+ import LinkedTooltip from '$lib/Tooltip/LinkedTooltip.svelte';
+ import settings from '$stores/settings';
+ import { mediaTitle } from './mediaTitle';
+ import './covers.css';
- export let media: Media[];
- export let dummy = false;
- export let type: 'anime' | 'manga';
- export let upcoming = false;
- export let notYetReleased = false;
+ export let media: Media[];
+ export let dummy = false;
+ export let type: 'anime' | 'manga';
+ export let upcoming = false;
+ export let notYetReleased = false;
- let uniqueID = new Date().getTime();
+ let uniqueID = new Date().getTime();
</script>
<div
- class="covers"
- style={`grid-template-columns: repeat(auto-fill, minmax(${$settings.displayCoverWidth}px, 1fr))`}
+ class="covers"
+ style={`grid-template-columns: repeat(auto-fill, minmax(${$settings.displayCoverWidth}px, 1fr))`}
>
- {#each media as title}
- {@const progress = (title.mediaListEntry || { progress: 0 }).progress}
+ {#each media as title}
+ {@const progress = (title.mediaListEntry || { progress: 0 }).progress}
- {#if type === 'anime' ? upcoming || notYetReleased || progress !== (title.nextAiringEpisode?.episode || 9999) - 1 : progress != title.episodes}
- <div class="cover-card" id={`${type}-${title.id}-${uniqueID}`}>
- <LinkedTooltip
- pin={`${type}-${title.id}-${uniqueID}`}
- content={title ? mediaTitle(title) : ''}
- relative={dummy}
- >
- <div class="cover-card-image">
- <a
- href={$settings.displayCopyMediaTitleNotLink
- ? '#'
- : outboundLink(title, type, $settings.displayOutboundLinksTo)}
- on:click={(e) => {
- if ($settings.displayCopyMediaTitleNotLink) {
- e.preventDefault();
+ {#if type === 'anime' ? upcoming || notYetReleased || progress !== (title.nextAiringEpisode?.episode || 9999) - 1 : progress != title.episodes}
+ <div class="cover-card" id={`${type}-${title.id}-${uniqueID}`}>
+ <LinkedTooltip
+ pin={`${type}-${title.id}-${uniqueID}`}
+ content={title ? mediaTitle(title) : ''}
+ relative={dummy}
+ >
+ <div class="cover-card-image">
+ <a
+ href={$settings.displayCopyMediaTitleNotLink
+ ? '#'
+ : outboundLink(title, type, $settings.displayOutboundLinksTo)}
+ on:click={(e) => {
+ if ($settings.displayCopyMediaTitleNotLink) {
+ e.preventDefault();
- navigator.clipboard.writeText(title.title.romaji);
- }
- }}
- target="_blank"
- >
- <span class="cover-container">
- <ParallaxImage
- source={$settings.displayDataSaver
- ? title.coverImage.medium
- : title.coverImage.extraLarge}
- alternativeText="Cover"
- limit={12.5}
- classList={`cover${
- title.isAdult && $settings.displayBlurAdultContent ? ' adult' : ''
- }`}
- />
- </span>
- </a>
- </div>
- </LinkedTooltip>
+ navigator.clipboard.writeText(title.title.romaji);
+ }
+ }}
+ target="_blank"
+ >
+ <span class="cover-container">
+ <ParallaxImage
+ source={$settings.displayDataSaver
+ ? title.coverImage.medium
+ : title.coverImage.extraLarge}
+ alternativeText="Cover"
+ limit={12.5}
+ classList={`cover${
+ title.isAdult && $settings.displayBlurAdultContent ? ' adult' : ''
+ }`}
+ />
+ </span>
+ </a>
+ </div>
+ </LinkedTooltip>
- <div class="cover-title">
- <slot name="title" {progress} {title} />
- </div>
- </div>
- {/if}
- {/each}
+ <div class="cover-title">
+ <slot name="title" {progress} {title} />
+ </div>
+ </div>
+ {/if}
+ {/each}
</div>