aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Landing.svelte
diff options
context:
space:
mode:
authorFuwn <[email protected]>2026-03-01 16:04:11 -0800
committerFuwn <[email protected]>2026-03-01 16:04:11 -0800
commit48f0c30d47d62e4f35706edb93a1bb2f97eba14c (patch)
tree44866d7a61adfdf01a780e0108c370294d3db78b /src/lib/Landing.svelte
parentchore(biome): re-enable useAltText rule (diff)
downloaddue.moe-48f0c30d47d62e4f35706edb93a1bb2f97eba14c.tar.xz
due.moe-48f0c30d47d62e4f35706edb93a1bb2f97eba14c.zip
chore(biome): enable svelte formatting
Diffstat (limited to 'src/lib/Landing.svelte')
-rw-r--r--src/lib/Landing.svelte120
1 files changed, 60 insertions, 60 deletions
diff --git a/src/lib/Landing.svelte b/src/lib/Landing.svelte
index 4a5c7df0..bddd16df 100644
--- a/src/lib/Landing.svelte
+++ b/src/lib/Landing.svelte
@@ -1,67 +1,67 @@
<script lang="ts">
- import root from './Utility/root';
- import { env } from '$env/dynamic/public';
- import CompletedAnimeList from './List/Anime/CompletedAnimeList.svelte';
- import MangaListTemplate from './List/Manga/MangaListTemplate.svelte';
- import localforage from 'localforage';
- import { onMount } from 'svelte';
-
- let sectionsVisible = $state<boolean[]>([false, false, false]);
- let mangaContainer: HTMLElement;
- let animeContainer: HTMLElement;
- let gridLimit = $state<number | undefined>(undefined);
- let demoFocused = $state(false);
- const COVER_WIDTH = 100;
- const COVER_GAP = 12;
- const dummyCount = 20;
-
- const calculateLimit = () => {
- const container = mangaContainer || animeContainer;
-
- if (!container) return;
-
- const containerWidth = container.clientWidth;
- const itemWidth = COVER_WIDTH + COVER_GAP;
- const padding = containerWidth < 500 ? 48 : 36;
-
- gridLimit = Math.max(2, Math.floor((containerWidth - padding) / itemWidth));
+import root from './Utility/root';
+import { env } from '$env/dynamic/public';
+import CompletedAnimeList from './List/Anime/CompletedAnimeList.svelte';
+import MangaListTemplate from './List/Manga/MangaListTemplate.svelte';
+import localforage from 'localforage';
+import { onMount } from 'svelte';
+
+let sectionsVisible = $state<boolean[]>([false, false, false]);
+let mangaContainer: HTMLElement;
+let animeContainer: HTMLElement;
+let gridLimit = $state<number | undefined>(undefined);
+let demoFocused = $state(false);
+const COVER_WIDTH = 100;
+const COVER_GAP = 12;
+const dummyCount = 20;
+
+const calculateLimit = () => {
+ const container = mangaContainer || animeContainer;
+
+ if (!container) return;
+
+ const containerWidth = container.clientWidth;
+ const itemWidth = COVER_WIDTH + COVER_GAP;
+ const padding = containerWidth < 500 ? 48 : 36;
+
+ gridLimit = Math.max(2, Math.floor((containerWidth - padding) / itemWidth));
+};
+
+onMount(() => {
+ const intersectionObserver = new IntersectionObserver(
+ (entries) => {
+ entries.forEach((entry) => {
+ if (entry.isIntersecting) {
+ const index = Number(entry.target.getAttribute('data-section'));
+
+ sectionsVisible[index] = true;
+ }
+ });
+ },
+ { threshold: 0.1 }
+ );
+
+ document.querySelectorAll('.landing-section').forEach((el) => intersectionObserver.observe(el));
+
+ calculateLimit();
+
+ const resizeObserver = new ResizeObserver(calculateLimit);
+
+ if (mangaContainer) resizeObserver.observe(mangaContainer);
+ if (animeContainer) resizeObserver.observe(animeContainer);
+
+ const handleKeydown = (e: KeyboardEvent) => {
+ if (e.key === 'Escape' && demoFocused) demoFocused = false;
};
- onMount(() => {
- const intersectionObserver = new IntersectionObserver(
- (entries) => {
- entries.forEach((entry) => {
- if (entry.isIntersecting) {
- const index = Number(entry.target.getAttribute('data-section'));
+ document.addEventListener('keydown', handleKeydown);
- sectionsVisible[index] = true;
- }
- });
- },
- { threshold: 0.1 }
- );
-
- document.querySelectorAll('.landing-section').forEach((el) => intersectionObserver.observe(el));
-
- calculateLimit();
-
- const resizeObserver = new ResizeObserver(calculateLimit);
-
- if (mangaContainer) resizeObserver.observe(mangaContainer);
- if (animeContainer) resizeObserver.observe(animeContainer);
-
- const handleKeydown = (e: KeyboardEvent) => {
- if (e.key === 'Escape' && demoFocused) demoFocused = false;
- };
-
- document.addEventListener('keydown', handleKeydown);
-
- return () => {
- intersectionObserver.disconnect();
- resizeObserver.disconnect();
- document.removeEventListener('keydown', handleKeydown);
- };
- });
+ return () => {
+ intersectionObserver.disconnect();
+ resizeObserver.disconnect();
+ document.removeEventListener('keydown', handleKeydown);
+ };
+});
</script>
<div class="landing">