diff --git a/package.json b/package.json index 10abf00..e7cb899 100644 --- a/package.json +++ b/package.json @@ -48,9 +48,11 @@ "vite": "^5.4.11" }, "dependencies": { + "@fontsource-variable/smooch-sans": "^5.1.1", "better-sqlite3": "^11.8.0", "drizzle-orm": "^0.38.4", "lucide-svelte": "^0.473.0", + "mode-watcher": "^0.5.0", "nanoid": "^5.0.9", "spotify-web-api-node": "^5.0.2", "svelte-kit-sessions": "^0.4.0" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4648f13..9d5c651 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -8,6 +8,9 @@ importers: .: dependencies: + '@fontsource-variable/smooch-sans': + specifier: ^5.1.1 + version: 5.1.1 better-sqlite3: specifier: ^11.8.0 version: 11.8.1 @@ -17,6 +20,9 @@ importers: lucide-svelte: specifier: ^0.473.0 version: 0.473.0(svelte@5.19.0) + mode-watcher: + specifier: ^0.5.0 + version: 0.5.0(svelte@5.19.0) nanoid: specifier: ^5.0.9 version: 5.0.9 @@ -599,6 +605,9 @@ packages: '@floating-ui/utils@0.2.9': resolution: {integrity: sha512-MDWhGtE+eHw5JW7lq4qhc5yRLS11ERl1c7Z6Xd0a58DozHES6EnNNwUWbMiG4J9Cgj053Bhk8zvlhFYKVhULwg==} + '@fontsource-variable/smooch-sans@5.1.1': + resolution: {integrity: sha512-ADcY3Pjkvu74x4T+p2gNIo8Ba7DGrX1IhQgJFefztWB8Tf5nX7Qb+tqAbtW7O/KYWJi4EjzrxCefHBM1PfOOsg==} + '@humanfs/core@0.19.1': resolution: {integrity: sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==} engines: {node: '>=18.18.0'} @@ -1692,6 +1701,11 @@ packages: mkdirp-classic@0.5.3: resolution: {integrity: sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==} + mode-watcher@0.5.0: + resolution: {integrity: sha512-5E6fh/aXhAVv+U+DbeM0hCmskQE9u7WSmvnCRijJB/MJu7HtB73sjiCaZ9n1M8QHmzLrBFo8XBAUcWXkDm8Z9A==} + peerDependencies: + svelte: ^4.0.0 || ^5.0.0-next.1 + mri@1.2.0: resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==} engines: {node: '>=4'} @@ -2612,6 +2626,8 @@ snapshots: '@floating-ui/utils@0.2.9': {} + '@fontsource-variable/smooch-sans@5.1.1': {} + '@humanfs/core@0.19.1': {} '@humanfs/node@0.16.6': @@ -3644,6 +3660,10 @@ snapshots: mkdirp-classic@0.5.3: {} + mode-watcher@0.5.0(svelte@5.19.0): + dependencies: + svelte: 5.19.0 + mri@1.2.0: {} mrmime@2.0.0: {} diff --git a/src/app.html b/src/app.html index 77a5ff5..c2d3729 100644 --- a/src/app.html +++ b/src/app.html @@ -2,8 +2,13 @@ - + + + + + + %sveltekit.head% diff --git a/src/lib/components/DNDGroup.svelte b/src/lib/components/DNDGroup.svelte index 85a7fdd..c0e3ed8 100644 --- a/src/lib/components/DNDGroup.svelte +++ b/src/lib/components/DNDGroup.svelte @@ -26,17 +26,17 @@ }} onconsider={handleDndConsider} onfinalize={handleDndFinalize} - class="grid grid-cols-3 items-center gap-14" + class="grid grid-cols-3 items-center gap-4 sm:gap-8 md:gap-10 lg:gap-14" > {#each items as item, i (item.id)}
{#if image} @@ -45,7 +45,13 @@ {:else} -

+

{#if type === 'artists'} {truncate(item.value, 30)} {:else} diff --git a/src/lib/server/Spotify.svelte.ts b/src/lib/server/Spotify.svelte.ts index 67a38ef..84445e7 100644 --- a/src/lib/server/Spotify.svelte.ts +++ b/src/lib/server/Spotify.svelte.ts @@ -17,7 +17,6 @@ class SpotifyAPI { return await this.api.clientCredentialsGrant().then( (data) => { - console.log(data.body); if (!data.body['expires_in'] || !data.body['access_token']) { return false; } diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 8f1cac1..d8842cd 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -1,14 +1,39 @@ -

-
-

Paku biiti

-

- Lohista kokku õiged albumi nimed, - artistid ja pildid. + + +

+ + Mihkel Martin Kasterpalu logo + + +
+ +
+
+

Paku biiti

+

+ Lohista kokku õiged albumi nimed, + artistid ja + pildid.

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 24861ec..d1994ab 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -30,17 +30,17 @@ {#snippet footer(loading: boolean)} -
-

Skoor: {data.stage}

+
+

Skoor: {data.stage}

{#if loading} - {:else} - + {/if} -

Parim: {data.highscore}

+

Parim: {data.highscore}

{/snippet} @@ -74,16 +74,14 @@ action="?/submit" method="POST" use:enhance - class="grid w-full gap-6 px-8 transition-all {loading || data?.playing === false - ? 'grayscale' - : ''}" + class="grid w-full gap-6 transition-all {loading || data?.playing === false ? 'grayscale' : ''}" > {#if data?.streamed?.albums} {#await data.streamed.albums} {#each { length: 2 } as _}
{#each { length: 3 } as _} - + {/each}
diff --git a/static/apple-touch-icon.png b/static/apple-touch-icon.png new file mode 100644 index 0000000..414c3e2 Binary files /dev/null and b/static/apple-touch-icon.png differ diff --git a/static/favicon-96x96.png b/static/favicon-96x96.png new file mode 100644 index 0000000..b1c3e4b Binary files /dev/null and b/static/favicon-96x96.png differ diff --git a/static/favicon.ico b/static/favicon.ico new file mode 100644 index 0000000..dd93ff9 Binary files /dev/null and b/static/favicon.ico differ diff --git a/static/favicon.png b/static/favicon.png deleted file mode 100644 index 825b9e6..0000000 Binary files a/static/favicon.png and /dev/null differ diff --git a/static/favicon.svg b/static/favicon.svg new file mode 100644 index 0000000..183e088 --- /dev/null +++ b/static/favicon.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/static/site.webmanifest b/static/site.webmanifest new file mode 100644 index 0000000..5dbacf6 --- /dev/null +++ b/static/site.webmanifest @@ -0,0 +1,21 @@ +{ + "name": "Kasterpalu", + "short_name": "Kasterpalu", + "icons": [ + { + "src": "/web-app-manifest-192x192.png", + "sizes": "192x192", + "type": "image/png", + "purpose": "maskable" + }, + { + "src": "/web-app-manifest-512x512.png", + "sizes": "512x512", + "type": "image/png", + "purpose": "maskable" + } + ], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} \ No newline at end of file diff --git a/static/web-app-manifest-192x192.png b/static/web-app-manifest-192x192.png new file mode 100644 index 0000000..e773c4b Binary files /dev/null and b/static/web-app-manifest-192x192.png differ diff --git a/static/web-app-manifest-512x512.png b/static/web-app-manifest-512x512.png new file mode 100644 index 0000000..6ecdad7 Binary files /dev/null and b/static/web-app-manifest-512x512.png differ diff --git a/tailwind.config.ts b/tailwind.config.ts index d91ff63..9f78648 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -1,96 +1,97 @@ -import { fontFamily } from "tailwindcss/defaultTheme"; -import type { Config } from "tailwindcss"; -import tailwindcssAnimate from "tailwindcss-animate"; +import { fontFamily } from 'tailwindcss/defaultTheme'; +import type { Config } from 'tailwindcss'; +import tailwindcssAnimate from 'tailwindcss-animate'; const config: Config = { - darkMode: ["class"], - content: ["./src/**/*.{html,js,svelte,ts}"], - safelist: ["dark"], + darkMode: ['class'], + content: ['./src/**/*.{html,js,svelte,ts}'], + safelist: ['dark'], theme: { container: { center: true, - padding: "2rem", + padding: '2rem', screens: { - "2xl": "1400px" + '2xl': '1400px' } }, extend: { colors: { - border: "hsl(var(--border) / )", - input: "hsl(var(--input) / )", - ring: "hsl(var(--ring) / )", - background: "hsl(var(--background) / )", - foreground: "hsl(var(--foreground) / )", + border: 'hsl(var(--border) / )', + input: 'hsl(var(--input) / )', + ring: 'hsl(var(--ring) / )', + background: 'hsl(var(--background) / )', + foreground: 'hsl(var(--foreground) / )', primary: { - DEFAULT: "hsl(var(--primary) / )", - foreground: "hsl(var(--primary-foreground) / )" + DEFAULT: 'hsl(var(--primary) / )', + foreground: 'hsl(var(--primary-foreground) / )' }, secondary: { - DEFAULT: "hsl(var(--secondary) / )", - foreground: "hsl(var(--secondary-foreground) / )" + DEFAULT: 'hsl(var(--secondary) / )', + foreground: 'hsl(var(--secondary-foreground) / )' }, destructive: { - DEFAULT: "hsl(var(--destructive) / )", - foreground: "hsl(var(--destructive-foreground) / )" + DEFAULT: 'hsl(var(--destructive) / )', + foreground: 'hsl(var(--destructive-foreground) / )' }, muted: { - DEFAULT: "hsl(var(--muted) / )", - foreground: "hsl(var(--muted-foreground) / )" + DEFAULT: 'hsl(var(--muted) / )', + foreground: 'hsl(var(--muted-foreground) / )' }, accent: { - DEFAULT: "hsl(var(--accent) / )", - foreground: "hsl(var(--accent-foreground) / )" + DEFAULT: 'hsl(var(--accent) / )', + foreground: 'hsl(var(--accent-foreground) / )' }, popover: { - DEFAULT: "hsl(var(--popover) / )", - foreground: "hsl(var(--popover-foreground) / )" + DEFAULT: 'hsl(var(--popover) / )', + foreground: 'hsl(var(--popover-foreground) / )' }, card: { - DEFAULT: "hsl(var(--card) / )", - foreground: "hsl(var(--card-foreground) / )" + DEFAULT: 'hsl(var(--card) / )', + foreground: 'hsl(var(--card-foreground) / )' }, sidebar: { - DEFAULT: "hsl(var(--sidebar-background))", - foreground: "hsl(var(--sidebar-foreground))", - primary: "hsl(var(--sidebar-primary))", - "primary-foreground": "hsl(var(--sidebar-primary-foreground))", - accent: "hsl(var(--sidebar-accent))", - "accent-foreground": "hsl(var(--sidebar-accent-foreground))", - border: "hsl(var(--sidebar-border))", - ring: "hsl(var(--sidebar-ring))", - }, + DEFAULT: 'hsl(var(--sidebar-background))', + foreground: 'hsl(var(--sidebar-foreground))', + primary: 'hsl(var(--sidebar-primary))', + 'primary-foreground': 'hsl(var(--sidebar-primary-foreground))', + accent: 'hsl(var(--sidebar-accent))', + 'accent-foreground': 'hsl(var(--sidebar-accent-foreground))', + border: 'hsl(var(--sidebar-border))', + ring: 'hsl(var(--sidebar-ring))' + } }, borderRadius: { - xl: "calc(var(--radius) + 4px)", - lg: "var(--radius)", - md: "calc(var(--radius) - 2px)", - sm: "calc(var(--radius) - 4px)" + xl: 'calc(var(--radius) + 4px)', + lg: 'var(--radius)', + md: 'calc(var(--radius) - 2px)', + sm: 'calc(var(--radius) - 4px)' }, fontFamily: { - sans: [...fontFamily.sans] + sans: [...fontFamily.sans], + title: ['Smooch Sans Variable', ...fontFamily.sans] }, keyframes: { - "accordion-down": { - from: { height: "0" }, - to: { height: "var(--bits-accordion-content-height)" }, + 'accordion-down': { + from: { height: '0' }, + to: { height: 'var(--bits-accordion-content-height)' } }, - "accordion-up": { - from: { height: "var(--bits-accordion-content-height)" }, - to: { height: "0" }, - }, - "caret-blink": { - "0%,70%,100%": { opacity: "1" }, - "20%,50%": { opacity: "0" }, + 'accordion-up': { + from: { height: 'var(--bits-accordion-content-height)' }, + to: { height: '0' } }, + 'caret-blink': { + '0%,70%,100%': { opacity: '1' }, + '20%,50%': { opacity: '0' } + } }, animation: { - "accordion-down": "accordion-down 0.2s ease-out", - "accordion-up": "accordion-up 0.2s ease-out", - "caret-blink": "caret-blink 1.25s ease-out infinite", - }, - }, + 'accordion-down': 'accordion-down 0.2s ease-out', + 'accordion-up': 'accordion-up 0.2s ease-out', + 'caret-blink': 'caret-blink 1.25s ease-out infinite' + } + } }, - plugins: [tailwindcssAnimate], + plugins: [tailwindcssAnimate] }; export default config;