diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/routes/user/[user]/+page.svelte | 23 |
1 files changed, 11 insertions, 12 deletions
diff --git a/src/routes/user/[user]/+page.svelte b/src/routes/user/[user]/+page.svelte index 98991d85..b971abd9 100644 --- a/src/routes/user/[user]/+page.svelte +++ b/src/routes/user/[user]/+page.svelte @@ -85,24 +85,23 @@ {:else} <div class="card card-small"> <div - class="card" - id="user-grid" + class="card user-grid" style={`background-image: ${ userData ? `url(${userData.bannerImage})` : 'none' }; padding: 0;`} > {#if userData} - <img src={userData.bannerImage} alt="" id="cover-image" /> + <img src={userData.bannerImage} alt="" class="cover-image" /> {/if} - <div class="card" id="user-grid-content"> - <div id="user-grid-avatar"> + <div class="card user-grid-content"> + <div class="user-grid-avatar"> <a href={`https://anilist.co/user/${userData.name}`} target="_blank"> - <img src={userData.avatar.large} alt="" width="100vw" id="avatar" /> + <img src={userData.avatar.large} alt="" width="100vw" class="avatar" /> </a> </div> - <div id="user-grid-content-text"> + <div> <p> <a href={`https://anilist.co/user/${userData.name}`} @@ -196,7 +195,7 @@ {/if} <style lang="scss"> - #user-grid-content { + .user-grid-content { display: flex; flex-wrap: wrap; column-gap: 1.5em; @@ -206,14 +205,14 @@ border-top-right-radius: 0; } - #user-grid-avatar { + .user-grid-avatar { display: flex; flex-direction: column; justify-content: center; align-items: center; } - #avatar { + .avatar { border-radius: 8px; } @@ -221,13 +220,13 @@ margin: 0 0.625rem; } - #user-grid { + .user-grid { background-size: cover; background-position: center; background-repeat: no-repeat; } - #cover-image { + .cover-image { visibility: hidden; height: 4.5em; } |