diff options
| author | Fuwn <[email protected]> | 2023-12-02 21:39:01 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2023-12-02 21:39:01 -0800 |
| commit | 26bb8f71af0a38f0b214e793dcd505c6f2759c43 (patch) | |
| tree | 90124683f6241b35fed006b2f8d7b33ba91263ec /src/lib/Tools | |
| parent | fix(wrapped): make wrapped independent (diff) | |
| download | due.moe-26bb8f71af0a38f0b214e793dcd505c6f2759c43.tar.xz due.moe-26bb8f71af0a38f0b214e793dcd505c6f2759c43.zip | |
feat(wrapped): seperate rows to flexes
Diffstat (limited to 'src/lib/Tools')
| -rw-r--r-- | src/lib/Tools/Wrapped.svelte | 24 |
1 files changed, 14 insertions, 10 deletions
diff --git a/src/lib/Tools/Wrapped.svelte b/src/lib/Tools/Wrapped.svelte index d0fbab5b..3bfd0312 100644 --- a/src/lib/Tools/Wrapped.svelte +++ b/src/lib/Tools/Wrapped.svelte @@ -178,7 +178,7 @@ // statistic.startYears.find((y: { startYear: number }) => y.startYear === 2023); const screenshot = async (dark = false) => { - let element = document.querySelector('.categories-grid') as HTMLElement; + let element = document.querySelector('#wrapped') as HTMLElement; element.classList.add('invert'); @@ -265,12 +265,12 @@ {#await wrapped(user, currentUserIdentity)} Loading ... {:then wrapped} - <div id="wrapped" style={`width: ${width}px`}> - <div - class:light-theme={lightTheme} - class="categories-grid" - style={`background-color: ${transparency ? '#0b16227f' : '#0b1622'};`} - > + <div + id="wrapped" + class:light-theme={lightTheme} + style={`background-color: ${transparency ? '#0b16227f' : '#0b1622'}; width: ${width}px;`} + > + <div class="categories-grid" style="padding-bottom: 0;"> <div class="grid-item image-grid avatar-grid category"> <a href={`https://anilist.co/user/${currentUserIdentity.name}`} target="_blank"> <img src={proxy(wrapped.avatar.large)} alt="User Avatar" /> @@ -328,6 +328,8 @@ Chapters: {chapters} </div> </div> + </div> + <div class="categories-grid"> <div class="category-grid pure-category category"> <div class="grid-item image-grid"> {#if animeList !== undefined} @@ -382,10 +384,12 @@ {/if} </div> </div> - {#if watermark} - <div class="category-grid pure-category" id="watermark">due.moe/wrapped</div> - {/if} </div> + {#if watermark} + <div class="categories-grid" style="padding-top: 0;"> + <div class="category-grid pure-category" id="watermark">due.moe/wrapped</div> + </div> + {/if} </div> <p /> |