diff --git a/package.json b/package.json index b0cda40b..05f78843 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "prepare": "husky" }, "dependencies": { - "@hmbanan666/chat-game-api": "^0.1.11", + "@hmbanan666/chat-game-api": "^0.1.13", "@paralleldrive/cuid2": "^2.2.2", "@radix-ui/colors": "^3.0.0", "@twurple/api": "^7.1.0", diff --git a/src/lib/components/Header.svelte b/src/lib/components/Header.svelte index 91a02d7d..9e0e3cdc 100644 --- a/src/lib/components/Header.svelte +++ b/src/lib/components/Header.svelte @@ -26,7 +26,7 @@ - {#if innerWidth < 768} + {#if innerWidth < 920} {:else} diff --git a/src/lib/components/MenuDesktop.svelte b/src/lib/components/MenuDesktop.svelte index b2174416..f1901c4b 100644 --- a/src/lib/components/MenuDesktop.svelte +++ b/src/lib/components/MenuDesktop.svelte @@ -20,6 +20,9 @@
  • {t.header.menu.coupon}
    • +
  • + {t.header.menu.trophy} +
    • diff --git a/src/lib/components/MenuSmartphone.svelte b/src/lib/components/MenuSmartphone.svelte index 413295dc..aec75964 100644 --- a/src/lib/components/MenuSmartphone.svelte +++ b/src/lib/components/MenuSmartphone.svelte @@ -28,6 +28,9 @@
  • {t.header.menu.coupon}
    • +
  • + {t.header.menu.trophy} +
    • diff --git a/src/lib/styles/styles.css b/src/lib/styles/styles.css index 9dd7a419..6527c9c1 100644 --- a/src/lib/styles/styles.css +++ b/src/lib/styles/styles.css @@ -140,6 +140,7 @@ button:focus:not(:focus-visible) { transform: translateY(100%); padding: 0.5em; background-color: var(--color-background-2); + z-index: 5; } .dropdown-menu a { diff --git a/src/lib/translations/en.ts b/src/lib/translations/en.ts index c3a9d568..210e3bdd 100644 --- a/src/lib/translations/en.ts +++ b/src/lib/translations/en.ts @@ -19,6 +19,7 @@ export const en = { about: 'About', characters: 'Characters', coupon: 'Coupon', + trophy: 'Trophies', }, }, footer: { diff --git a/src/lib/translations/ru.ts b/src/lib/translations/ru.ts index 92c4cee1..c30406c0 100644 --- a/src/lib/translations/ru.ts +++ b/src/lib/translations/ru.ts @@ -19,6 +19,7 @@ export const ru = { about: 'Об игре', characters: 'Персонажи', coupon: 'Купон', + trophy: 'Трофеи', }, }, footer: { diff --git a/src/routes/[lang]/(website)/coupon/+page.svelte b/src/routes/[lang]/(website)/coupon/+page.svelte index e57c536b..6ccb8932 100644 --- a/src/routes/[lang]/(website)/coupon/+page.svelte +++ b/src/routes/[lang]/(website)/coupon/+page.svelte @@ -9,6 +9,8 @@ export let data + const latestCoupons = data.latestCoupons.slice(0, 6) + TimeAgo.addLocale(ru) const timeAgo = new TimeAgo('ru-RU') @@ -31,7 +33,7 @@

    На стриме периодически появляются сообщения с инструкцией, как получить купон.

    - {#each data.latestCoupons as coupon} + {#each latestCoupons as coupon}
    @@ -113,17 +115,22 @@ } .latest-coupons .block { - display: flex; - flex-direction: row; - flex-wrap: wrap; - gap: 1em; + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 0.5em; } - @media (max-width: 620px) { + @media (min-width: 768px) { .latest-coupons .block { - flex-direction: column; + grid-template-columns: repeat(4, 1fr); } - } + } + + @media (min-width: 1200px) { + .latest-coupons .block { + grid-template-columns: repeat(6, 1fr); + } + } .latest-coupons .block .card { border: 2px solid var(--color-border-2); diff --git a/src/routes/[lang]/(website)/p/[userName]/+page.server.ts b/src/routes/[lang]/(website)/p/[userName]/+page.server.ts index 85c36b10..a77fc9b7 100644 --- a/src/routes/[lang]/(website)/p/[userName]/+page.server.ts +++ b/src/routes/[lang]/(website)/p/[userName]/+page.server.ts @@ -7,7 +7,13 @@ export async function load({ params }) { error(404, 'Not found') } + let trophies = await api.trophy.getProfileProgressList(profile.id) + if (!trophies || trophies instanceof Error) { + trophies = [] + } + return { pageProfile: profile, + trophies, } } diff --git a/src/routes/[lang]/(website)/p/[userName]/+page.svelte b/src/routes/[lang]/(website)/p/[userName]/+page.svelte index 76eecfd4..48fa485f 100644 --- a/src/routes/[lang]/(website)/p/[userName]/+page.svelte +++ b/src/routes/[lang]/(website)/p/[userName]/+page.svelte @@ -3,11 +3,17 @@ import FileQuestion from 'lucide-svelte/icons/file-question' import Trophy from 'lucide-svelte/icons/trophy' import Handshake from 'lucide-svelte/icons/handshake' + import TimeAgo from 'javascript-time-ago' + import ru from 'javascript-time-ago/locale/ru' import unitAvatar from '$lib/assets/website/unit-512.png' import { pluralizationRu } from '$lib/utils/locale' import couponSmall from '$lib/assets/website/coupon-64.png' export let data + + TimeAgo.addLocale(ru) + + const timeAgo = new TimeAgo('ru-RU')
    @@ -61,6 +67,27 @@
    +
    + {#each data.trophies as progress} +
    +
    +

    {progress.trophy.name}

    +

    {progress.trophy.description}

    +

    {progress.status === 'COMPLETED' ? `Получен ${timeAgo.format(new Date(progress.completedAt))}` : 'Еще не получен'}

    +
    +
    +
    + +
    +
    +

    {progress.trophy.points}

    +

    Очков

    +
    +
    +
    + {/each} +
    + diff --git a/src/routes/[lang]/(website)/trophy/+page.server.ts b/src/routes/[lang]/(website)/trophy/+page.server.ts new file mode 100644 index 00000000..e990142a --- /dev/null +++ b/src/routes/[lang]/(website)/trophy/+page.server.ts @@ -0,0 +1,12 @@ +import { api } from '$lib/server/api' + +export async function load() { + let trophies = await api.trophy.getList() + if (!trophies || trophies instanceof Error) { + trophies = [] + } + + return { + trophies, + } +} diff --git a/src/routes/[lang]/(website)/trophy/+page.svelte b/src/routes/[lang]/(website)/trophy/+page.svelte new file mode 100644 index 00000000..fe3008a9 --- /dev/null +++ b/src/routes/[lang]/(website)/trophy/+page.svelte @@ -0,0 +1,95 @@ + + +
    +

    Трофеи

    +

    Столько всего можно сделать...

    +
    + +
    + {#each data.trophies as trophy} +
    +
    +

    {trophy.name}

    +

    {trophy.description}

    +
    +
    +
    + +
    +
    +

    {trophy.points}

    +

    Очков

    +
    +
    +
    + {/each} +
    + + diff --git a/yarn.lock b/yarn.lock index d9fa2a0a..aab49ef4 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.11": - version "0.1.11" - resolved "https://registry.yarnpkg.com/@hmbanan666/chat-game-api/-/chat-game-api-0.1.11.tgz#d36688183ad7a5eed608207b25f7d9dba3e394bb" - integrity sha512-UM62ByzVA86Tz/qApoAV9+sGWyXym4xNz/h2zdC310Gk+r8gi8eT2DeFCT3fi96zbpzXMGID4/n4xhEalHnfNw== +"@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== "@humanwhocodes/module-importer@^1.0.1": version "1.0.1"