From 27cec4e77ee026fb59414e4a9d6f05a9efe432ea Mon Sep 17 00:00:00 2001 From: Sam Date: Sat, 11 Mar 2023 01:36:30 +0100 Subject: [PATCH] start user page --- package.json | 10 +- pnpm-lock.yaml | 127 +++++++++++++++++++++---- src/app.html | 2 +- src/lib/api/entities.ts | 39 +++++++- src/lib/api/fetch.ts | 11 ++- src/lib/components/FieldCard.svelte | 18 ++++ src/lib/components/PronounLink.svelte | 16 ++++ src/lib/components/StatusIcon.svelte | 52 ++++++++++ src/routes/+layout.svelte | 3 +- src/routes/+page.svelte | 4 + src/routes/@[username]/+page.server.ts | 10 ++ src/routes/@[username]/+page.svelte | 84 ++++++++++++++++ src/routes/login/+page.server.ts | 4 +- src/routes/login/+page.svelte | 15 ++- src/routes/login/discord/+page.svelte | 0 src/routes/nav/Navigation.svelte | 83 ++++++---------- vite.config.ts | 5 +- 17 files changed, 401 insertions(+), 82 deletions(-) create mode 100644 src/lib/components/FieldCard.svelte create mode 100644 src/lib/components/PronounLink.svelte create mode 100644 src/lib/components/StatusIcon.svelte create mode 100644 src/routes/@[username]/+page.server.ts create mode 100644 src/routes/@[username]/+page.svelte create mode 100644 src/routes/login/discord/+page.svelte diff --git a/package.json b/package.json index fe42cdf..43d9a49 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,8 @@ "@sveltejs/kit": "^1.5.0", "@tailwindcss/forms": "^0.5.3", "@tailwindcss/typography": "^0.5.9", + "@types/marked": "^4.0.8", + "@types/sanitize-html": "^2.8.1", "@typescript-eslint/eslint-plugin": "^5.45.0", "@typescript-eslint/parser": "^5.45.0", "autoprefixer": "^10.4.13", @@ -34,7 +36,11 @@ }, "type": "module", "dependencies": { - "@steeze-ui/heroicons": "^2.2.2", - "@steeze-ui/svelte-icon": "^1.3.2" + "@popperjs/core": "^2.11.6", + "bootstrap": "5.3.0-alpha1", + "bootstrap-icons": "^1.10.3", + "marked": "^4.2.12", + "sanitize-html": "^2.10.0", + "sveltestrap": "^5.10.0" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 99d4f92..0c1620e 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,37 +1,49 @@ lockfileVersion: 5.4 specifiers: - '@steeze-ui/heroicons': ^2.2.2 - '@steeze-ui/svelte-icon': ^1.3.2 + '@popperjs/core': ^2.11.6 '@sveltejs/adapter-auto': ^2.0.0 '@sveltejs/kit': ^1.5.0 '@tailwindcss/forms': ^0.5.3 '@tailwindcss/typography': ^0.5.9 + '@types/marked': ^4.0.8 + '@types/sanitize-html': ^2.8.1 '@typescript-eslint/eslint-plugin': ^5.45.0 '@typescript-eslint/parser': ^5.45.0 autoprefixer: ^10.4.13 + bootstrap: 5.3.0-alpha1 + bootstrap-icons: ^1.10.3 eslint: ^8.28.0 eslint-config-prettier: ^8.5.0 eslint-plugin-svelte3: ^4.0.0 + marked: ^4.2.12 postcss: ^8.4.21 prettier: ^2.8.0 prettier-plugin-svelte: ^2.8.1 + sanitize-html: ^2.10.0 svelte: ^3.54.0 svelte-check: ^3.0.1 + sveltestrap: ^5.10.0 tailwindcss: ^3.2.7 tslib: ^2.4.1 typescript: ^4.9.3 vite: ^4.0.0 dependencies: - '@steeze-ui/heroicons': 2.2.2 - '@steeze-ui/svelte-icon': 1.3.2 + '@popperjs/core': 2.11.6 + bootstrap: 5.3.0-alpha1_@popperjs+core@2.11.6 + bootstrap-icons: 1.10.3 + marked: 4.2.12 + sanitize-html: 2.10.0 + sveltestrap: 5.10.0_svelte@3.55.1 devDependencies: '@sveltejs/adapter-auto': 2.0.0_@sveltejs+kit@1.11.0 '@sveltejs/kit': 1.11.0_svelte@3.55.1+vite@4.1.4 '@tailwindcss/forms': 0.5.3_tailwindcss@3.2.7 '@tailwindcss/typography': 0.5.9_tailwindcss@3.2.7 + '@types/marked': 4.0.8 + '@types/sanitize-html': 2.8.1 '@typescript-eslint/eslint-plugin': 5.54.1_mlk7dnz565t663n4razh6a6v6i '@typescript-eslint/parser': 5.54.1_ycpbpc6yetojsgtrx3mwntkhsu autoprefixer: 10.4.13_postcss@8.4.21 @@ -331,12 +343,8 @@ packages: resolution: {integrity: sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==} dev: true - /@steeze-ui/heroicons/2.2.2: - resolution: {integrity: sha512-VUkgSAbjLzsEuF4kDQDESANb/NNxqhkOMnrzD1VhB3tSGr7wVZ5FKS7aM2QZcKXjziwR6dbt7Nhs3fpZhqOi1A==} - dev: false - - /@steeze-ui/svelte-icon/1.3.2: - resolution: {integrity: sha512-Y7tH9UKeDYLfBicWLw4n4mhgfuSwgEdtq9wog7H+DjvfpTvea5SEqjHI8onoKZonJqAaUBGVjH02LAiqRWu+cw==} + /@popperjs/core/2.11.6: + resolution: {integrity: sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==} dev: false /@sveltejs/adapter-auto/2.0.0_@sveltejs+kit@1.11.0: @@ -424,10 +432,20 @@ packages: resolution: {integrity: sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ==} dev: true + /@types/marked/4.0.8: + resolution: {integrity: sha512-HVNzMT5QlWCOdeuBsgXP8EZzKUf0+AXzN+sLmjvaB3ZlLqO+e4u0uXrdw9ub69wBKFs+c6/pA4r9sy6cCDvImw==} + dev: true + /@types/pug/2.0.6: resolution: {integrity: sha512-SnHmG9wN1UVmagJOnyo/qkk0Z7gejYxOYYmaAwr5u2yFYfsupN3sg10kyzN8Hep/2zbHxCnsumxOoRIRMBwKCg==} dev: true + /@types/sanitize-html/2.8.1: + resolution: {integrity: sha512-Q6kMAbBBaXA5IagoipeSr4Y/zuGyh4BZ5lewgb3cYe3OYqy0k/d67iMsC4O895eks676bVAe9G+0y1i0k2ZlnA==} + dependencies: + htmlparser2: 8.0.1 + dev: true + /@types/sass/1.45.0: resolution: {integrity: sha512-jn7qwGFmJHwUSphV8zZneO3GmtlgLsmhs/LQyVvQbIIa+fzGMUiHI4HXJZL3FT8MJmgXWbLGiVVY7ElvHq6vDA==} deprecated: This is a stub types definition. sass provides its own type definitions, so you do not need this installed. @@ -669,6 +687,18 @@ packages: engines: {node: '>=8'} dev: true + /bootstrap-icons/1.10.3: + resolution: {integrity: sha512-7Qvj0j0idEm/DdX9Q0CpxAnJYqBCFCiUI6qzSPYfERMcokVuV9Mdm/AJiVZI8+Gawe4h/l6zFcOzvV7oXCZArw==} + dev: false + + /bootstrap/5.3.0-alpha1_@popperjs+core@2.11.6: + resolution: {integrity: sha512-ABZpKK4ObS3kKlIqH+ZVDqoy5t/bhFG0oHTAzByUdon7YIom0lpCeTqRniDzJmbtcWkNe800VVPBiJgxSYTYew==} + peerDependencies: + '@popperjs/core': ^2.11.6 + dependencies: + '@popperjs/core': 2.11.6 + dev: false + /brace-expansion/1.1.11: resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==} dependencies: @@ -796,7 +826,6 @@ packages: /deepmerge/4.3.0: resolution: {integrity: sha512-z2wJZXrmeHdvYJp/Ux55wIjqo81G5Bp4c+oELTW+7ar6SogWHajt5a9gO3s3IDaGSAXjDk0vlQKN3rms8ab3og==} engines: {node: '>=0.10.0'} - dev: true /defined/1.0.1: resolution: {integrity: sha512-hsBd2qSVCRE+5PmNdHt1uzyrFu5d3RwmFDKzyNZMFq/EwDNJF7Ee5+D5oEKF0hU6LhtoUF1macFvOe4AskQC1Q==} @@ -843,10 +872,37 @@ packages: esutils: 2.0.3 dev: true + /dom-serializer/2.0.0: + resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==} + dependencies: + domelementtype: 2.3.0 + domhandler: 5.0.3 + entities: 4.4.0 + + /domelementtype/2.3.0: + resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==} + + /domhandler/5.0.3: + resolution: {integrity: sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==} + engines: {node: '>= 4'} + dependencies: + domelementtype: 2.3.0 + + /domutils/3.0.1: + resolution: {integrity: sha512-z08c1l761iKhDFtfXO04C7kTdPBLi41zwOZl00WS8b5eiaebNpY00HKbztwBq+e3vyqWNwWF3mP9YLUeqIrF+Q==} + dependencies: + dom-serializer: 2.0.0 + domelementtype: 2.3.0 + domhandler: 5.0.3 + /electron-to-chromium/1.4.325: resolution: {integrity: sha512-K1C03NT4I7BuzsRdCU5RWkgZxtswnKDYM6/eMhkEXqKu4e5T+ck610x3FPzu1y7HVFSiQKZqP16gnJzPpji1TQ==} dev: true + /entities/4.4.0: + resolution: {integrity: sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==} + engines: {node: '>=0.12'} + /es6-promise/3.3.1: resolution: {integrity: sha512-SOp9Phqvqn7jtEUxPWdWfWoLmyt2VaJ6MpvP9Comy1MceMXqE6bxvaTu4iaxpYYPzhny28Lc+M87/c2cPK6lDg==} dev: true @@ -889,7 +945,6 @@ packages: /escape-string-regexp/4.0.0: resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==} engines: {node: '>=10'} - dev: true /eslint-config-prettier/8.7.0_eslint@8.35.0: resolution: {integrity: sha512-HHVXLSlVUhMSmyW4ZzEuvjpwqamgmlfkutD53cYXLikh4pt/modINRcCIApJ84czDxM4GZInwUrromsDdTImTA==} @@ -1192,6 +1247,14 @@ packages: function-bind: 1.1.1 dev: true + /htmlparser2/8.0.1: + resolution: {integrity: sha512-4lVbmc1diZC7GUJQtRQ5yBAeUCL1exyMwmForWkRLnwyzWBFxN633SALPMGYaWZvKe9j1pRZJpauvmxENSp/EA==} + dependencies: + domelementtype: 2.3.0 + domhandler: 5.0.3 + domutils: 3.0.1 + entities: 4.4.0 + /ignore/5.2.4: resolution: {integrity: sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==} engines: {node: '>= 4'} @@ -1264,6 +1327,11 @@ packages: engines: {node: '>=8'} dev: true + /is-plain-object/5.0.0: + resolution: {integrity: sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==} + engines: {node: '>=0.10.0'} + dev: false + /isexe/2.0.0: resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==} dev: true @@ -1352,6 +1420,12 @@ packages: '@jridgewell/sourcemap-codec': 1.4.14 dev: true + /marked/4.2.12: + resolution: {integrity: sha512-yr8hSKa3Fv4D3jdZmtMMPghgVt6TWbk86WQaWhDloQjRSQhMMYCAro7jP7VDJrjjdV8pxVxMssXS8B8Y5DZ5aw==} + engines: {node: '>= 12'} + hasBin: true + dev: false + /merge2/1.4.1: resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==} engines: {node: '>= 8'} @@ -1416,7 +1490,6 @@ packages: resolution: {integrity: sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==} engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} hasBin: true - dev: true /natural-compare-lite/1.4.0: resolution: {integrity: sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==} @@ -1484,6 +1557,10 @@ packages: callsites: 3.1.0 dev: true + /parse-srcset/1.0.2: + resolution: {integrity: sha512-/2qh0lav6CmI15FzA3i/2Bzk2zCgQhGMkvhOhKNcBVQ1ldgpbfiNTVslmooUmWJcADi1f1kIeynbDRVzNlfR6Q==} + dev: false + /path-exists/4.0.0: resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==} engines: {node: '>=8'} @@ -1510,7 +1587,6 @@ packages: /picocolors/1.0.0: resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} - dev: true /picomatch/2.3.1: resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==} @@ -1598,7 +1674,6 @@ packages: nanoid: 3.3.4 picocolors: 1.0.0 source-map-js: 1.0.2 - dev: true /prelude-ls/1.2.1: resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==} @@ -1716,6 +1791,17 @@ packages: rimraf: 2.7.1 dev: true + /sanitize-html/2.10.0: + resolution: {integrity: sha512-JqdovUd81dG4k87vZt6uA6YhDfWkUGruUu/aPmXLxXi45gZExnt9Bnw/qeQU8oGf82vPyaE0vO4aH0PbobB9JQ==} + dependencies: + deepmerge: 4.3.0 + escape-string-regexp: 4.0.0 + htmlparser2: 8.0.1 + is-plain-object: 5.0.0 + parse-srcset: 1.0.2 + postcss: 8.4.21 + dev: false + /sass/1.58.3: resolution: {integrity: sha512-Q7RaEtYf6BflYrQ+buPudKR26/lH+10EmO9bBqbmPh/KeLqv8bjpTNqxe71ocONqXq+jYiCbpPUmQMS+JJPk4A==} engines: {node: '>=12.0.0'} @@ -1777,7 +1863,6 @@ packages: /source-map-js/1.0.2: resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==} engines: {node: '>=0.10.0'} - dev: true /streamsearch/1.1.0: resolution: {integrity: sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==} @@ -1903,7 +1988,15 @@ packages: /svelte/3.55.1: resolution: {integrity: sha512-S+87/P0Ve67HxKkEV23iCdAh/SX1xiSfjF1HOglno/YTbSTW7RniICMCofWGdJJbdjw3S+0PfFb1JtGfTXE0oQ==} engines: {node: '>= 8'} - dev: true + + /sveltestrap/5.10.0_svelte@3.55.1: + resolution: {integrity: sha512-k6Ob+6G2AMYvBidXHBKM9W28fJqFHbmosqCe/NC8pv6TV7K+v47Yw+zmnLWkjqCzzmjkSLkL48SrHZrlWc9mYQ==} + peerDependencies: + svelte: ^3.29.0 + dependencies: + '@popperjs/core': 2.11.6 + svelte: 3.55.1 + dev: false /tailwindcss/3.2.7_postcss@8.4.21: resolution: {integrity: sha512-B6DLqJzc21x7wntlH/GsZwEXTBttVSl1FtCzC8WP4oBc/NKef7kaax5jeihkkCEWc831/5NDJ9gRNDK6NEioQQ==} diff --git a/src/app.html b/src/app.html index 494904d..dd330c4 100644 --- a/src/app.html +++ b/src/app.html @@ -6,7 +6,7 @@ %sveltekit.head% - +
%sveltekit.body%
diff --git a/src/lib/api/entities.ts b/src/lib/api/entities.ts index c8a8e22..d71bd39 100644 --- a/src/lib/api/entities.ts +++ b/src/lib/api/entities.ts @@ -1,10 +1,15 @@ export interface User { id: string; - username: string; + name: string; display_name: string | null; bio: string | null; avatar_urls: string[] | null; links: string[] | null; + + names: FieldEntry[]; + pronouns: Pronoun[]; + members: PartialMember[]; + fields: Field[]; } export interface MeUser extends User { @@ -12,6 +17,38 @@ export interface MeUser extends User { discord_username: string | null; } +export interface Field { + name: string; + entries: FieldEntry[]; +} + +export interface FieldEntry { + value: string; + status: WordStatus; +} + +export interface Pronoun { + pronouns: string; + display_text: string | null; + status: WordStatus; +} + +export enum WordStatus { + Unknown = 0, + Favourite = 1, + Okay = 2, + Jokingly = 3, + FriendsOnly = 4, + Avoid = 5, +} + +export interface PartialMember { + id: string; + name: string; + display_name: string | null; + avatar_urls: string[] | null; +} + export interface APIError { code: ErrorCode; message?: string; diff --git a/src/lib/api/fetch.ts b/src/lib/api/fetch.ts index a2a723e..08c03df 100644 --- a/src/lib/api/fetch.ts +++ b/src/lib/api/fetch.ts @@ -1,11 +1,13 @@ import type { APIError } from "./entities"; -export async function fetchAPI( +export async function apiFetch( path: string, { method, body, token }: { method?: string; body?: any; token?: string }, ) { - const resp = await fetch(`${process.env.ORIGIN}/api/v1${path}`, { - method, + const apiBase = typeof process !== "undefined" ? process.env.ORIGIN : ""; + + const resp = await fetch(`${apiBase}/api/v1${path}`, { + method: method || "GET", headers: { ...(token ? { Authorization: token } : {}), "Content-Type": "application/json", @@ -17,3 +19,6 @@ export async function fetchAPI( if (resp.status < 200 || resp.status >= 300) throw data as APIError; return data as T; } + +export const apiFetchClient = async (path: string, method: string = "GET", body: any = null) => + apiFetch(path, { method, body, token: localStorage.getItem("pronouns-token") || undefined }); diff --git a/src/lib/components/FieldCard.svelte b/src/lib/components/FieldCard.svelte new file mode 100644 index 0000000..814c2d6 --- /dev/null +++ b/src/lib/components/FieldCard.svelte @@ -0,0 +1,18 @@ + + +
+
{field.name}
+
    + {#each field.entries as entry} +
  • {entry.value}
    • + {/each} +
+
diff --git a/src/lib/components/PronounLink.svelte b/src/lib/components/PronounLink.svelte new file mode 100644 index 0000000..59acf21 --- /dev/null +++ b/src/lib/components/PronounLink.svelte @@ -0,0 +1,16 @@ + + +{pronounText} diff --git a/src/lib/components/StatusIcon.svelte b/src/lib/components/StatusIcon.svelte new file mode 100644 index 0000000..25d25fc --- /dev/null +++ b/src/lib/components/StatusIcon.svelte @@ -0,0 +1,52 @@ + + + +{statusText} diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index bcb38b7..50a09eb 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -1,5 +1,6 @@ diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 5982b0a..9940171 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,2 +1,6 @@ + + pronouns.cc + +

Welcome to SvelteKit

Visit kit.svelte.dev to read the documentation

diff --git a/src/routes/@[username]/+page.server.ts b/src/routes/@[username]/+page.server.ts new file mode 100644 index 0000000..a4af262 --- /dev/null +++ b/src/routes/@[username]/+page.server.ts @@ -0,0 +1,10 @@ +import { apiFetch } from "$lib/api/fetch"; +import type { User } from "$lib/api/entities"; + +export const load = async ({ params }) => { + const resp = await apiFetch(`/users/${params.username}`, { + method: "GET", + }); + + return resp; +}; diff --git a/src/routes/@[username]/+page.svelte b/src/routes/@[username]/+page.svelte new file mode 100644 index 0000000..6ad7061 --- /dev/null +++ b/src/routes/@[username]/+page.svelte @@ -0,0 +1,84 @@ + + + + @{data.name} - pronouns.cc + + +
+
+
+ {#if data.avatar_urls} +
+ {/if} +
+ {#if data.display_name} +

{data.display_name}

+

@{data.name}

+ {:else} +

@{data.name}

+ {/if} +
+ {#if bio} +

{@html bio}

+ {/if} +
+ {#if data.links} +
+
    + {#each data.links as link} +
  • {link}
    • + {/each} +
+
+ {/if} +
+
+ {#if data.names} +
+

Names

+
    + {#each data.names as name} +
  • {name.value}
    • + {/each} +
+
+ {/if} + {#if data.pronouns} +
+

Pronouns

+
    + {#each data.pronouns as pronouns} +
  • + + +
    • + {/each} +
+
+ {/if} +
+
+ {#if data.fields} +
+ {#each data.fields as field} +
+ +
+ {/each} +
+ {/if} +
diff --git a/src/routes/login/+page.server.ts b/src/routes/login/+page.server.ts index d3f0c6d..2af4941 100644 --- a/src/routes/login/+page.server.ts +++ b/src/routes/login/+page.server.ts @@ -1,7 +1,7 @@ -import { fetchAPI } from "$lib/api/fetch"; +import { apiFetch } from "$lib/api/fetch"; export const load = async () => { - const resp = await fetchAPI("/auth/urls", { + const resp = await apiFetch("/auth/urls", { method: "POST", body: { callback_domain: process.env.ORIGIN, diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte index 5155399..4cd9f48 100644 --- a/src/routes/login/+page.svelte +++ b/src/routes/login/+page.svelte @@ -7,6 +7,17 @@ Login - pronouns.cc -
- Login with Discord + +
+

Log in or sign up

+
+
+

+ Log in with Discord +

+
+
+ +
+
diff --git a/src/routes/login/discord/+page.svelte b/src/routes/login/discord/+page.svelte new file mode 100644 index 0000000..e69de29 diff --git a/src/routes/nav/Navigation.svelte b/src/routes/nav/Navigation.svelte index 444ffe5..7d93963 100644 --- a/src/routes/nav/Navigation.svelte +++ b/src/routes/nav/Navigation.svelte @@ -2,10 +2,8 @@ import { onMount } from "svelte"; import { browser } from "$app/environment"; - import { Icon } from "@steeze-ui/svelte-icon"; - import { Moon, Sun, EllipsisVertical } from "@steeze-ui/heroicons"; + import { Collapse,Icon, Nav, Navbar, NavbarBrand, NavbarToggler, NavItem, NavLink } from "sveltestrap"; - import NavItem from "./NavItem.svelte"; import Logo from "./Logo.svelte"; let darkTheme: boolean = false; @@ -23,9 +21,9 @@ if (!browser) return; if (isDark) { - document.documentElement.classList.remove("dark"); + document.documentElement.setAttribute("data-bs-theme", "dark"); } else { - document.documentElement.classList.add("dark"); + document.documentElement.setAttribute("data-bs-theme", "light"); } localStorage.setItem("theme", isDark ? "dark" : "light"); }; @@ -33,53 +31,34 @@ const toggleTheme = () => { darkTheme = !darkTheme; }; + const toggleMenu = () => { + showMenu = !showMenu; + }; -
-
-
-
- -
- -
-
toggleTheme()} - on:keypress={() => toggleTheme()} - title={darkTheme ? "Switch to light mode" : "Switch to dark mode"} - > - -
-
(showMenu = !showMenu)} - on:keypress={() => (showMenu = !showMenu)} - title={showMenu ? "Hide menu" : "Show menu"} - > - -
- -
-
-
-
-
-
+ + + + + + diff --git a/vite.config.ts b/vite.config.ts index 001eea7..c85edc7 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -13,8 +13,11 @@ export default defineConfig({ "/media": { target: "http://localhost:9000", changeOrigin: true, - rewrite: (path) => path.replace(/^\/media/, "/pronouns.cc") + rewrite: (path) => path.replace(/^\/media/, "/pronouns.cc"), }, }, }, + ssr: { + noExternal: ["@popperjs/core"], + }, });