diff --git a/.prettierrc b/.prettierrc index 9573023..4f8ae3c 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,7 +1,7 @@ { "useTabs": true, "singleQuote": true, - "trailingComma": "none", + "trailingComma": "all", "printWidth": 100, "plugins": ["prettier-plugin-svelte"], "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }] diff --git a/src/app.css b/src/app.css index def1c25..4081124 100644 --- a/src/app.css +++ b/src/app.css @@ -1,9 +1,9 @@ html { - --color-primary-h: 49; - --color-primary-s: 79%; - --color-primary-l: 53%; + --color-primary-h: 218; + --color-primary-s: 81%; + --color-primary-l: 24%; --color-primary: hsl(var(--color-primary-h), var(--color-primary-s), var(--color-primary-l)); - --color-secondary-h: 218; + --color-secondary-h: 100; --color-secondary-s: 81%; --color-secondary-l: 24%; --color-secondary: hsl( @@ -59,6 +59,9 @@ html { --z-index-modal: 100; + --clip-path: polygon(0% 0%, 75% 0%, 100% 100%, 25% 100%); + --clip-path-button: polygon(0px 0px, calc(100% - 10px) 0px, 100% 40px, 10px 40px); + background-color: var(--color-bg); color: var(--color-text); } @@ -104,6 +107,11 @@ svg { max-width: 100%; height: auto; } +button { + background: none; + border: none; + cursor: pointer; +} input, button, textarea, diff --git a/src/lib/Button.svelte b/src/lib/Button.svelte new file mode 100644 index 0000000..719e783 --- /dev/null +++ b/src/lib/Button.svelte @@ -0,0 +1,37 @@ + + +{#if disabled} + +{:else} + +{/if} + + diff --git a/src/params/integer.ts b/src/params/integer.ts new file mode 100644 index 0000000..acba385 --- /dev/null +++ b/src/params/integer.ts @@ -0,0 +1,5 @@ +import type { ParamMatcher } from '@sveltejs/kit'; + +export const match: ParamMatcher = (param) => { + return /^\d+$/.test(param); +}; diff --git a/src/routes/+page.md b/src/routes/+page.md index 496bec6..9c066c4 100644 --- a/src/routes/+page.md +++ b/src/routes/+page.md @@ -24,16 +24,25 @@ React, SvelteKit, TailwindCSS, Rust, Docker, SQL, and AWS technologies I'm an active contributor to the open-source world: check out my [Github profile](https://github.com/SeriousBug)! For a closer look at my work, -visit my [portfolio](/portfolio) where I +visit my [portfolio](/portfolio/) where I highlight my favorite projects. I sometimes write about the tools -I use or challenges I've solved on my [blog](/posts). I'm always open to feedback, reach out to me through my socials linked below. +I use or challenges I've solved on my [blog](/posts/). I'm always open to feedback, reach out to me through my socials linked below. + +
+ Email + Github + Mastodon + LinkedIn + CV +
diff --git a/src/routes/posts/[[page=integer]]/+page.svelte b/src/routes/posts/[[page=integer]]/+page.svelte new file mode 100644 index 0000000..e23ca00 --- /dev/null +++ b/src/routes/posts/[[page=integer]]/+page.svelte @@ -0,0 +1,115 @@ + + + + +
+ + + {data.page} + + +
+ + diff --git a/src/routes/posts/+page.ts b/src/routes/posts/[[page=integer]]/+page.ts similarity index 50% rename from src/routes/posts/+page.ts rename to src/routes/posts/[[page=integer]]/+page.ts index 04ee721..8ca2550 100644 --- a/src/routes/posts/+page.ts +++ b/src/routes/posts/[[page=integer]]/+page.ts @@ -1,6 +1,8 @@ import _ from 'lodash'; -export async function load() { +const PAGE_SIZE = 10; + +export async function load({ params }) { const allPostFiles = import.meta.glob('/src/routes/posts/*.md'); const iterablePostFiles = Object.entries(allPostFiles); @@ -13,10 +15,21 @@ export async function load() { return { meta: metadata, - path: slug + path: slug, }; - }) + }), ); - return { posts: _.reverse(_.sortBy(posts, ({ meta }) => meta.date)) }; + // Get the page number, converting it to a 0-based index + const page = (params.page ? parseInt(params.page, 10) : 1) - 1; + + return { + posts: _.reverse(_.sortBy(posts, ({ meta }) => meta.date)).slice( + page * PAGE_SIZE, + (page + 1) * PAGE_SIZE, + ), + hasMore: posts.length > (page + 1) * PAGE_SIZE, + page: page + 1, + pageCount: Math.ceil(posts.length / PAGE_SIZE), + }; } diff --git a/src/typography.css b/src/typography.css index 5ea242a..cd8adea 100644 --- a/src/typography.css +++ b/src/typography.css @@ -17,7 +17,7 @@ h6 { font-size: 1.125rem; } a { - color: var(--color-secondary); + color: var(--color-primary); font-weight: 600; text-decoration-color: transparent; opacity: 0.8; diff --git a/static/android-chrome-192x192.png b/static/android-chrome-192x192.png index c41f4d4..9ffba49 100644 --- a/static/android-chrome-192x192.png +++ b/static/android-chrome-192x192.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:0abdac4abf33d383c66826e21e03193896b66656c5188c45f3fdb78b0b7f1758 -size 18318 +oid sha256:17ec088f965c173e59b20f5f74f6e2be6b5c3dd68d84bfefb3aececa66eae5b1 +size 28198 diff --git a/static/android-chrome-512x512.png b/static/android-chrome-512x512.png index 6c59064..28402e5 100644 --- a/static/android-chrome-512x512.png +++ b/static/android-chrome-512x512.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:73eaabbfb54beb3db0df0be319b0fed7afb8b8bef4bb59185c555308fbaa8a06 -size 81704 +oid sha256:489cb6a38f7a2f1fb982876369f7c7a309337740d351ababdc8b5705ca562a02 +size 153562 diff --git a/static/apple-touch-icon.png b/static/apple-touch-icon.png index 889e87e..3a95b03 100644 --- a/static/apple-touch-icon.png +++ b/static/apple-touch-icon.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:878a6f0fc9d6c50a852c93fe0830d74017e242dabd11d0ed3a9be8c504340f7d -size 16418 +oid sha256:6af985cddd7deac96c549e9fabfa3932b2a1a4ff44761144b215fea3b6cc4b18 +size 25206 diff --git a/static/favicon-16x16.png b/static/favicon-16x16.png index 6683510..f359ff8 100644 --- a/static/favicon-16x16.png +++ b/static/favicon-16x16.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:9c49e89b2b99478daaec80a42e6b9e257300c51085017851b74c3924ae170ea5 -size 540 +oid sha256:10fe39579ba0452f51b658ae2d0f83b27384c0ce01e800f5baaa5aba999bb3d8 +size 693 diff --git a/static/favicon-32x32.png b/static/favicon-32x32.png index a97ecfd..56c15fa 100644 --- a/static/favicon-32x32.png +++ b/static/favicon-32x32.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:92f5b6f8b4ff978ad0ab911695b555d27fe3fa931a683dc28a8ff7f5c8a25872 -size 1343 +oid sha256:31996829c64d911eac0c3029b8c4c10bd23213a7d61d0e83656dbec4427a623d +size 1779 diff --git a/static/favicon.ico b/static/favicon.ico index 4d0ff66..2aacd9c 100644 Binary files a/static/favicon.ico and b/static/favicon.ico differ diff --git a/static/favicon.png b/static/favicon.png index ae01b21..28402e5 100644 --- a/static/favicon.png +++ b/static/favicon.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:b18d6b80413e8e2b75fb64f45ef1f13503210f378c6d7c6ec3c9966133d41221 -size 12376 +oid sha256:489cb6a38f7a2f1fb982876369f7c7a309337740d351ababdc8b5705ca562a02 +size 153562