aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Tools/Wrapped.svelte
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/Tools/Wrapped.svelte')
-rw-r--r--src/lib/Tools/Wrapped.svelte122
1 files changed, 63 insertions, 59 deletions
diff --git a/src/lib/Tools/Wrapped.svelte b/src/lib/Tools/Wrapped.svelte
index 83b58cd1..0cd124a2 100644
--- a/src/lib/Tools/Wrapped.svelte
+++ b/src/lib/Tools/Wrapped.svelte
@@ -493,54 +493,56 @@
{@html nbsp('Loading user data ...')}
{:then wrapped}
<div id="list-container">
- <div
- id="wrapped"
- class:light-theme={lightMode}
- style={`width: ${width}px; flex-shrink: 0;`}
- class:transparent={transparency}
- >
- {#if !disableActivityHistory && activityHistoryPosition === 'TOP' && activities.length > 0 && selectedYear === currentYear}
- <ActivityHistory {user} {activities} year={selectedYear} {activityHistoryPosition} />
- {/if}
- <div class="categories-grid" style="padding-bottom: 0;">
- <Activity
- {wrapped}
- identity={currentUserIdentity}
- year={selectedYear}
- {activities}
- {useFullActivityHistory}
+ <div class="card">
+ <div
+ id="wrapped"
+ class:light-theme={lightMode}
+ style={`width: ${width}px; flex-shrink: 0;`}
+ class:transparent={transparency}
+ >
+ {#if !disableActivityHistory && activityHistoryPosition === 'TOP' && activities.length > 0 && selectedYear === currentYear}
+ <ActivityHistory {user} {activities} year={selectedYear} {activityHistoryPosition} />
+ {/if}
+ <div class="categories-grid" style="padding-bottom: 0;">
+ <Activity
+ {wrapped}
+ identity={currentUserIdentity}
+ year={selectedYear}
+ {activities}
+ {useFullActivityHistory}
+ {updateWidth}
+ />
+ <Anime {animeList} {minutesWatched} {episodes} />
+ <Manga {mangaList} {chapters} />
+ </div>
+ {#if !disableActivityHistory && activityHistoryPosition === 'BELOW_TOP' && activities.length > 0 && selectedYear === currentYear}
+ <ActivityHistory {user} {activities} year={selectedYear} {activityHistoryPosition} />
+ {/if}
+ <MediaPanel
+ {animeList}
+ {mangaList}
+ {highestRatedMediaPercentage}
+ {highestRatedCount}
{updateWidth}
+ {wrapped}
+ {animeMostTitle}
+ {mangaMostTitle}
/>
- <Anime {animeList} {minutesWatched} {episodes} />
- <Manga {mangaList} {chapters} />
+ {#if topMedia && topGenresTags && ((topMedia.topGenreMedia && topMedia.genres.length > 0) || (topMedia.topTagMedia && topMedia.tags.length > 0))}
+ <MediaExtras
+ {topMedia}
+ {genreTagTitle}
+ {highestRatedGenreTagPercentage}
+ {updateWidth}
+ />
+ {/if}
+ {#if !disableActivityHistory && activityHistoryPosition === 'ORIGINAL' && activities.length > 0 && selectedYear === currentYear}
+ <ActivityHistory {user} {activities} year={selectedYear} {activityHistoryPosition} />
+ {/if}
+ {#if watermark}
+ <Watermark />
+ {/if}
</div>
- {#if !disableActivityHistory && activityHistoryPosition === 'BELOW_TOP' && activities.length > 0 && selectedYear === currentYear}
- <ActivityHistory {user} {activities} year={selectedYear} {activityHistoryPosition} />
- {/if}
- <MediaPanel
- {animeList}
- {mangaList}
- {highestRatedMediaPercentage}
- {highestRatedCount}
- {updateWidth}
- {wrapped}
- {animeMostTitle}
- {mangaMostTitle}
- />
- {#if topMedia && topGenresTags && ((topMedia.topGenreMedia && topMedia.genres.length > 0) || (topMedia.topTagMedia && topMedia.tags.length > 0))}
- <MediaExtras
- {topMedia}
- {genreTagTitle}
- {highestRatedGenreTagPercentage}
- {updateWidth}
- />
- {/if}
- {#if !disableActivityHistory && activityHistoryPosition === 'ORIGINAL' && activities.length > 0 && selectedYear === currentYear}
- <ActivityHistory {user} {activities} year={selectedYear} {activityHistoryPosition} />
- {/if}
- {#if watermark}
- <Watermark />
- {/if}
</div>
<div class="list">
<p>
@@ -549,6 +551,22 @@
</button>
</p>
+ <div class:card={generated}>
+ <div id="wrapped-final" />
+
+ {#if generated}
+ <p />
+
+ <blockquote>
+ Click on the image to download, or right click and select "Save Image As...".
+ </blockquote>
+ {/if}
+ </div>
+
+ {#if generated}
+ <p />
+ {/if}
+
<details open>
<summary>Options</summary>
<div id="options">
@@ -596,8 +614,6 @@
Width adjustment<br />
</details>
- <p />
-
<details open>
<summary>Calculation</summary>
@@ -647,18 +663,6 @@
</details>
</div>
</details>
-
- <p />
-
- <div id="wrapped-final" />
-
- {#if generated}
- <p />
-
- <blockquote>
- Click on the image to download, or right click and select "Save Image As...".
- </blockquote>
- {/if}
</div>
</div>
{:catch}