From 1596b5e898f44d8aae191a1f294d74ed63b1b1bb Mon Sep 17 00:00:00 2001 From: Nick Kosarev Date: Tue, 2 Jul 2024 12:48:04 +0200 Subject: [PATCH] feat: trophy page with info (#191) * chore: added trophy icon * feat: trophy page with info --- package.json | 2 +- src/lib/assets/website/trophy-128.png | Bin 0 -> 881 bytes src/lib/assets/website/trophy-32.png | Bin 0 -> 472 bytes src/lib/assets/website/trophy-64.png | Bin 0 -> 612 bytes .../(website)/p/[userName]/+page.svelte | 14 +- .../[lang]/(website)/trophy/+page.svelte | 46 ++++-- .../(website)/trophy/[id]/+page.server.ts | 13 ++ .../[lang]/(website)/trophy/[id]/+page.svelte | 156 ++++++++++++++++++ yarn.lock | 8 +- 9 files changed, 208 insertions(+), 31 deletions(-) create mode 100644 src/lib/assets/website/trophy-128.png create mode 100644 src/lib/assets/website/trophy-32.png create mode 100644 src/lib/assets/website/trophy-64.png create mode 100644 src/routes/[lang]/(website)/trophy/[id]/+page.server.ts create mode 100644 src/routes/[lang]/(website)/trophy/[id]/+page.svelte diff --git a/package.json b/package.json index 05f78843..01fe2c51 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "prepare": "husky" }, "dependencies": { - "@hmbanan666/chat-game-api": "^0.1.13", + "@hmbanan666/chat-game-api": "^0.1.15", "@paralleldrive/cuid2": "^2.2.2", "@radix-ui/colors": "^3.0.0", "@twurple/api": "^7.1.0", diff --git a/src/lib/assets/website/trophy-128.png b/src/lib/assets/website/trophy-128.png new file mode 100644 index 0000000000000000000000000000000000000000..860ae2850fffadd9f57e387999a063b25688fd42 GIT binary patch literal 881 zcmeAS@N?(olHy`uVBq!ia0vp^4Is?H1|$#LC7uRSjKx9jP7LeL$-HD>VAl3@aSW-L z^Y*T7p0J}td*SUO2a^j5j+2F3q+K3KiQH+Jqkg9`+vO9lhx>Fk6)h=|9;U7F>&r}L z{hcxM`Ong6pEpMR|GIDU=JjviE;HJ1zyGKCw?FUhzP@=?eE2=#-^X&d;Q+*D|>raF1_ZGZf}3N zaD^Zn!#Rcnxxv{Dcc;fk)_-_oRgtvzJhRT<|MTtk$kg8BVn_$sd*|lfh8v&t^W@X^ z&X4`glOR%EwMzZ?^Xc;hZSwT|&*jGmN5E`4F1PFUli2iUS!e3aZn^eZ85X;~Uso&cG;ZDbo9W}O{a@$7b!YFY z=hciA{&EkYH1_Le#pAP2FREr2-_9R9A8y3muiKCBULE9B{?_bS<+5dXgeBMI& zggK(1bO4N?SNFvOR(-Lqs7i-=Xx;AYI~KwgU!SvD2(MTt0Sfl(HTJW2KVQCOpBgOU ruE+fM`uZp1<$1omT;Bw!&Ug0zdzoH5Nhr_<<{<`8S3j3^P66P)Px$l1W5CR9J=WS4&RAFc5vQOi(wlsZ=&OL3)EqT!RHSXwO6M&}$&&2F;Eg8!C0x zO+`~BtR_st*cn@C5fX3ZB=)>FAKQ}z3LMw71^~=_3IM3LdvTsE({_B$Pnaxs$&l^A z351WuqS4L;fQO<`*|u7P_s?$t+)?Ozk3whHe!k|dXRgr3fYK&`oB#mR4mJnaGVOTc zS||xU=cjh;vO)IE=J5TF$ZuZW#hhsikVFu+$A=?=zcFoc|oAlNeXrlQ{N zjt%0PEO$vFz2wiaJHd4^^?821 z20HsvO2b$Y;Na(haecTH`W#-u*g6PlOuRKf3yGLtqZ(+sB6ShQiWtJ60PcY%1r+|# zdqTcL%zP?}2_**tQlK>$LJkB(fWUVKkHSy~G@1ZOL@ar<005{~S?APr^^_M8z*~8a z+sE?nML_*$)W=v&Ow@IJT+f>Ri5T0^L~TRYK?H=~s6i2sJeTH#*!%)#{_4C(*9(;Z O0000Px%9!W$&RCt{2nn6y(Fc3wZsDRkOrV?y8L3@KrT!RHSfb+l|xCT;h(C*l=DNtes2e=LeQ6wr)&k$yH_Q0g+E4|2 zKF?amY-rWy!hPCw#Z{s`-z%DbK;bH&e0p#Fp&f%AN$mq-|6kplHIBtAz&-^a^G6S_ zLC;xg2M9o>-Aux9tRvi+tJ;{o5>x?@q0+RE8H`k!ckw9!;s{m3{=S9N*$HxG9K)^t zpaA&X-T#j5(Apqg0onn%1IUebK<)r?qaBbtfZSLg5IWl%EAD-&0>CkW(~I@iL&tTp zaDUaeZ|CE^DY`~qg9Y1A|T0000
- +

{progress.trophy.points}

@@ -197,13 +198,13 @@ .trophy-block .info .date { font-size: 0.9rem; margin-top: 0.5em; - opacity: 0.8; + opacity: 0.5; } .trophy-block .completion { position: relative; padding: 0.5em 1em; - color: #A07553; + color: #F76B15; display: flex; flex-direction: row; flex-wrap: nowrap; @@ -218,12 +219,7 @@ line-height: 1.2; } - .trophy-block .completion .trophy { + .trophy-block .completion .trophy[data-completed=false] { opacity: 0.3; - color: #AD7F58; - } - - .trophy-block .completion .trophy[data-completed=true] { - opacity: 1; } diff --git a/src/routes/[lang]/(website)/trophy/+page.svelte b/src/routes/[lang]/(website)/trophy/+page.svelte index fe3008a9..8dbb4470 100644 --- a/src/routes/[lang]/(website)/trophy/+page.svelte +++ b/src/routes/[lang]/(website)/trophy/+page.svelte @@ -1,5 +1,6 @@ @@ -11,21 +12,23 @@
{#each data.trophies as trophy} -
-
-

{trophy.name}

-

{trophy.description}

-
-
-
- + +
+
+

{trophy.name}

+

{trophy.description}

-
-

{trophy.points}

-

Очков

+
+
+ +
+
+

{trophy.points}

+

Очков

+
-
+ {/each}
@@ -47,12 +50,22 @@ max-width: 42em; } -.trophy-block { + .trophies a { + text-decoration: none; + color: inherit; + } + + .trophy-block { background-color: #FFEFD6; border: 2px solid var(--color-border); display: grid; grid-template-columns: 2fr 1fr; margin-bottom: 0.5em; + transition: all 0.2s; + } + + .trophy-block:hover { + transform: scale(0.98); } .trophy-block .info { @@ -73,7 +86,7 @@ .trophy-block .completion { position: relative; padding: 0.5em 1em; - color: #A07553; + color: #F76B15; display: flex; flex-direction: row; flex-wrap: nowrap; @@ -89,7 +102,6 @@ } .trophy-block .completion .trophy { - opacity: 0.3; - color: #AD7F58; + opacity: 1; } diff --git a/src/routes/[lang]/(website)/trophy/[id]/+page.server.ts b/src/routes/[lang]/(website)/trophy/[id]/+page.server.ts new file mode 100644 index 00000000..2e5efaf8 --- /dev/null +++ b/src/routes/[lang]/(website)/trophy/[id]/+page.server.ts @@ -0,0 +1,13 @@ +import { error } from '@sveltejs/kit' +import { api } from '$lib/server/api' + +export async function load({ params }) { + const trophy = await api.trophy.getById(params.id) + if (!trophy || trophy instanceof Error) { + error(404, 'Not found') + } + + return { + trophy, + } +} diff --git a/src/routes/[lang]/(website)/trophy/[id]/+page.svelte b/src/routes/[lang]/(website)/trophy/[id]/+page.svelte new file mode 100644 index 00000000..a80227fc --- /dev/null +++ b/src/routes/[lang]/(website)/trophy/[id]/+page.svelte @@ -0,0 +1,156 @@ + + +
+

{data.trophy.name}

+

Трофей, созданный hmbanan666

+
+ +
+
+
+

{data.trophy.description}

+
+
+
+ +
+
+

{data.trophy.points}

+

Очков

+
+
+
+
+ +
+

Кто получил этот трофей

+

Показаны последние профили, которые получили этот трофей.

+ +
+ {#each latestProfiles as progress} +
+
+ +
+ + +
+ {/each} +
+
+ + diff --git a/yarn.lock b/yarn.lock index aab49ef4..8bf10775 100644 --- a/yarn.lock +++ b/yarn.lock @@ -528,10 +528,10 @@ resolved "https://registry.yarnpkg.com/@eslint/object-schema/-/object-schema-2.1.4.tgz#9e69f8bb4031e11df79e03db09f9dbbae1740843" integrity sha512-BsWiH1yFGjXXS2yvrf5LyuoSIIbPrGUWob917o+BTKuZ7qJdxX8aJLRxs1fS9n6r7vESrq1OUqb68dANcFXuQQ== -"@hmbanan666/chat-game-api@^0.1.13": - version "0.1.13" - resolved "https://registry.yarnpkg.com/@hmbanan666/chat-game-api/-/chat-game-api-0.1.13.tgz#8552c79bc73aef9fb2b6bb8eb468c6e383f9916b" - integrity sha512-SwjB2g3TQVqIsuNTP12gC+XCc8V0BAqvRt6LCmVKlemyn0JxFGcAT9WKaNSG/hCHXe1ZuMb1bSwG/Lq9v1rnqw== +"@hmbanan666/chat-game-api@^0.1.15": + version "0.1.15" + resolved "https://registry.yarnpkg.com/@hmbanan666/chat-game-api/-/chat-game-api-0.1.15.tgz#4ca76ac95aa9e96554eef238de191bc02b13e742" + integrity sha512-NEehogrHYFrf2U/V+b8L7dRDXvhHZRoNdKUj2C4JHk1/EZjQEO3cD2+nVZGnQbvbi+VKP+4A2ofg2EsgihH4qg== "@humanwhocodes/module-importer@^1.0.1": version "1.0.1"