From 2211c4bbf305556f5bf849c74ca960939ff44789 Mon Sep 17 00:00:00 2001 From: enscribe Date: Thu, 12 Sep 2024 18:08:19 -0700 Subject: [PATCH] feat: revamped author card --- package-lock.json | 173 +++++++++++++++++- package.json | 6 +- .../{favicons => }/android-chrome-192x192.png | Bin .../{favicons => }/android-chrome-512x512.png | Bin public/{favicons => }/apple-touch-icon.png | Bin public/{favicons => }/browserconfig.xml | 2 +- public/{favicons => }/favicon-16x16.png | Bin public/{favicons => }/favicon-32x32.png | Bin public/{favicons => }/favicon.ico | Bin public/{favicons => }/mstile-150x150.png | Bin public/{favicons => }/safari-pinned-tab.svg | 0 public/{favicons => }/site.webmanifest | 4 +- public/static/512x512.png | Bin 2286 -> 0 bytes src/components/AuthorCard.astro | 116 ++++++++++-- src/components/BlogCard.astro | 8 +- src/components/Breadcrumbs.astro | 53 ++++++ src/components/Head.astro | 30 +-- src/components/Header.astro | 12 +- src/components/PostNavigation.astro | 6 +- src/components/SocialIcons.astro | 4 +- src/components/TableOfContents.astro | 2 +- src/components/TableOfContentsHeading.astro | 2 +- src/components/ui/avatar.tsx | 3 +- src/components/ui/badge.tsx | 5 +- src/components/ui/breadcrumb.tsx | 3 +- src/components/ui/button.tsx | 7 +- src/components/ui/card.tsx | 3 +- src/components/ui/dropdown-menu.tsx | 7 +- src/components/ui/mode-toggle.tsx | 5 +- src/components/ui/separator.tsx | 3 +- src/consts.ts | 13 +- src/content/authors/enscribe.md | 1 + .../blog/the-state-of-static-blogs.mdx | 6 +- src/content/config.ts | 1 + src/layouts/Layout.astro | 4 +- src/lib/utils.ts | 6 +- src/pages/404.astro | 28 +-- src/pages/about.astro | 27 +-- src/pages/authors/[...slug].astro | 88 ++++----- src/pages/authors/index.astro | 32 +--- src/pages/blog/[...slug].astro | 170 ++++++++--------- src/pages/blog/index.astro | 30 +-- src/pages/index.astro | 14 +- src/pages/tags/[...slug].astro | 56 +++--- src/pages/tags/index.astro | 61 ++---- src/styles/global.css | 1 + 46 files changed, 566 insertions(+), 426 deletions(-) rename public/{favicons => }/android-chrome-192x192.png (100%) rename public/{favicons => }/android-chrome-512x512.png (100%) rename public/{favicons => }/apple-touch-icon.png (100%) rename public/{favicons => }/browserconfig.xml (73%) rename public/{favicons => }/favicon-16x16.png (100%) rename public/{favicons => }/favicon-32x32.png (100%) rename public/{favicons => }/favicon.ico (100%) rename public/{favicons => }/mstile-150x150.png (100%) rename public/{favicons => }/safari-pinned-tab.svg (100%) rename public/{favicons => }/site.webmanifest (71%) delete mode 100644 public/static/512x512.png create mode 100644 src/components/Breadcrumbs.astro diff --git a/package-lock.json b/package-lock.json index 75a6e37..ab9658c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -47,7 +47,7 @@ "@tailwindcss/typography": "^0.5.13", "prettier": "^3.2.5", "prettier-plugin-astro": "^0.13.0", - "prettier-plugin-organize-imports": "^3.2.4", + "prettier-plugin-astro-organize-imports": "^0.4.9", "prettier-plugin-tailwindcss": "^0.5.14" } }, @@ -527,10 +527,9 @@ } }, "node_modules/@babel/helper-string-parser": { - "version": "7.24.7", - "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.7.tgz", - "integrity": "sha512-7MbVt6xrwFQbunH2DNQsAP5sTGxfqQtErvBIvIMi6EQnbgUOuVYanvREcmFrOPhoXBrTtjhhP+lW+o5UfK+tDg==", - "license": "MIT", + "version": "7.24.8", + "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.8.tgz", + "integrity": "sha512-pO9KhhRcuUyGnJWwyEgnRJTSIZHiT+vMD0kPeD+so0l7mxkMT19g3pjY9GTnHySck/hDzq+dtW/4VgnMkippsQ==", "engines": { "node": ">=6.9.0" } @@ -2612,6 +2611,129 @@ "tailwindcss": ">=3.0.0 || insiders" } }, + "node_modules/@trivago/prettier-plugin-sort-imports": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/@trivago/prettier-plugin-sort-imports/-/prettier-plugin-sort-imports-4.3.0.tgz", + "integrity": "sha512-r3n0onD3BTOVUNPhR4lhVK4/pABGpbA7bW3eumZnYdKaHkf1qEC+Mag6DPbGNuuh0eG8AaYj+YqmVHSiGslaTQ==", + "dev": true, + "optional": true, + "peer": true, + "dependencies": { + "@babel/generator": "7.17.7", + "@babel/parser": "^7.20.5", + "@babel/traverse": "7.23.2", + "@babel/types": "7.17.0", + "javascript-natural-sort": "0.7.1", + "lodash": "^4.17.21" + }, + "peerDependencies": { + "@vue/compiler-sfc": "3.x", + "prettier": "2.x - 3.x" + }, + "peerDependenciesMeta": { + "@vue/compiler-sfc": { + "optional": true + } + } + }, + "node_modules/@trivago/prettier-plugin-sort-imports/node_modules/@babel/generator": { + "version": "7.17.7", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.17.7.tgz", + "integrity": "sha512-oLcVCTeIFadUoArDTwpluncplrYBmTCCZZgXCbgNGvOBBiSDDK3eWO4b/+eOTli5tKv1lg+a5/NAXg+nTcei1w==", + "dev": true, + "optional": true, + "peer": true, + "dependencies": { + "@babel/types": "^7.17.0", + "jsesc": "^2.5.1", + "source-map": "^0.5.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@trivago/prettier-plugin-sort-imports/node_modules/@babel/traverse": { + "version": "7.23.2", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.2.tgz", + "integrity": "sha512-azpe59SQ48qG6nu2CzcMLbxUudtN+dOM9kDbUqGq3HXUJRlo7i8fvPoxQUzYgLZ4cMVmuZgm8vvBpNeRhd6XSw==", + "dev": true, + "optional": true, + "peer": true, + "dependencies": { + "@babel/code-frame": "^7.22.13", + "@babel/generator": "^7.23.0", + "@babel/helper-environment-visitor": "^7.22.20", + "@babel/helper-function-name": "^7.23.0", + "@babel/helper-hoist-variables": "^7.22.5", + "@babel/helper-split-export-declaration": "^7.22.6", + "@babel/parser": "^7.23.0", + "@babel/types": "^7.23.0", + "debug": "^4.1.0", + "globals": "^11.1.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@trivago/prettier-plugin-sort-imports/node_modules/@babel/traverse/node_modules/@babel/generator": { + "version": "7.25.6", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.25.6.tgz", + "integrity": "sha512-VPC82gr1seXOpkjAAKoLhP50vx4vGNlF4msF64dSFq1P8RfB+QAuJWGHPXXPc8QyfVWwwB/TNNU4+ayZmHNbZw==", + "dev": true, + "optional": true, + "peer": true, + "dependencies": { + "@babel/types": "^7.25.6", + "@jridgewell/gen-mapping": "^0.3.5", + "@jridgewell/trace-mapping": "^0.3.25", + "jsesc": "^2.5.1" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@trivago/prettier-plugin-sort-imports/node_modules/@babel/traverse/node_modules/@babel/types": { + "version": "7.25.6", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.25.6.tgz", + "integrity": "sha512-/l42B1qxpG6RdfYf343Uw1vmDjeNhneUXtzhojE7pDgfpEypmRhI6j1kr17XCVv4Cgl9HdAiQY2x0GwKm7rWCw==", + "dev": true, + "optional": true, + "peer": true, + "dependencies": { + "@babel/helper-string-parser": "^7.24.8", + "@babel/helper-validator-identifier": "^7.24.7", + "to-fast-properties": "^2.0.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@trivago/prettier-plugin-sort-imports/node_modules/@babel/types": { + "version": "7.17.0", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.17.0.tgz", + "integrity": "sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==", + "dev": true, + "optional": true, + "peer": true, + "dependencies": { + "@babel/helper-validator-identifier": "^7.16.7", + "to-fast-properties": "^2.0.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@trivago/prettier-plugin-sort-imports/node_modules/source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==", + "dev": true, + "optional": true, + "peer": true, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/@types/acorn": { "version": "4.0.6", "resolved": "https://registry.npmjs.org/@types/acorn/-/acorn-4.0.6.tgz", @@ -5141,6 +5263,14 @@ "@pkgjs/parseargs": "^0.11.0" } }, + "node_modules/javascript-natural-sort": { + "version": "0.7.1", + "resolved": "https://registry.npmjs.org/javascript-natural-sort/-/javascript-natural-sort-0.7.1.tgz", + "integrity": "sha512-nO6jcEfZWQXDhOiBtG2KvKyEptz7RVbpGP4vTD2hLBdmNQSsCiicO2Ioinv6UI4y9ukqnBpy+XZ9H6uLNgJTlw==", + "dev": true, + "optional": true, + "peer": true + }, "node_modules/jiti": { "version": "1.21.6", "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz", @@ -5318,6 +5448,14 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/lodash": { + "version": "4.17.21", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", + "dev": true, + "optional": true, + "peer": true + }, "node_modules/lodash.castarray": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz", @@ -7331,6 +7469,29 @@ "node": "^14.15.0 || >=16.0.0" } }, + "node_modules/prettier-plugin-astro-organize-imports": { + "version": "0.4.9", + "resolved": "https://registry.npmjs.org/prettier-plugin-astro-organize-imports/-/prettier-plugin-astro-organize-imports-0.4.9.tgz", + "integrity": "sha512-iMiTSTOs3YDVDojSUZKIZanovqbonGqX2hxp6XM3l2tWXTyQZodpOSLcK3p2PB2rMVu0K5OgUVv3J+ypIO5Evw==", + "dev": true, + "dependencies": { + "@astrojs/compiler": "^2.8.0", + "typescript": "^5.4.5" + }, + "peerDependencies": { + "prettier": "^3.0", + "prettier-plugin-astro": "*", + "prettier-plugin-tailwindcss": "*" + }, + "peerDependenciesMeta": { + "prettier-plugin-astro": { + "optional": true + }, + "prettier-plugin-tailwindcss": { + "optional": true + } + } + }, "node_modules/prettier-plugin-astro/node_modules/@astrojs/compiler": { "version": "1.8.2", "resolved": "https://registry.npmjs.org/@astrojs/compiler/-/compiler-1.8.2.tgz", @@ -7344,6 +7505,8 @@ "integrity": "sha512-6m8WBhIp0dfwu0SkgfOxJqh+HpdyfqSSLfKKRZSFbDuEQXDDndb8fTpRWkUrX/uBenkex3MgnVk0J3b3Y5byog==", "dev": true, "license": "MIT", + "optional": true, + "peer": true, "peerDependencies": { "@volar/vue-language-plugin-pug": "^1.0.4", "@volar/vue-typescript": "^1.0.4", diff --git a/package.json b/package.json index e275002..28e69ab 100644 --- a/package.json +++ b/package.json @@ -51,7 +51,7 @@ "@tailwindcss/typography": "^0.5.13", "prettier": "^3.2.5", "prettier-plugin-astro": "^0.13.0", - "prettier-plugin-organize-imports": "^3.2.4", + "prettier-plugin-astro-organize-imports": "^0.4.9", "prettier-plugin-tailwindcss": "^0.5.14" }, "prettier": { @@ -59,8 +59,8 @@ "singleQuote": true, "plugins": [ "prettier-plugin-astro", - "prettier-plugin-organize-imports", - "prettier-plugin-tailwindcss" + "prettier-plugin-tailwindcss", + "prettier-plugin-astro-organize-imports" ], "overrides": [ { diff --git a/public/favicons/android-chrome-192x192.png b/public/android-chrome-192x192.png similarity index 100% rename from public/favicons/android-chrome-192x192.png rename to public/android-chrome-192x192.png diff --git a/public/favicons/android-chrome-512x512.png b/public/android-chrome-512x512.png similarity index 100% rename from public/favicons/android-chrome-512x512.png rename to public/android-chrome-512x512.png diff --git a/public/favicons/apple-touch-icon.png b/public/apple-touch-icon.png similarity index 100% rename from public/favicons/apple-touch-icon.png rename to public/apple-touch-icon.png diff --git a/public/favicons/browserconfig.xml b/public/browserconfig.xml similarity index 73% rename from public/favicons/browserconfig.xml rename to public/browserconfig.xml index d469e48..b3930d0 100644 --- a/public/favicons/browserconfig.xml +++ b/public/browserconfig.xml @@ -2,7 +2,7 @@ - + #da532c diff --git a/public/favicons/favicon-16x16.png b/public/favicon-16x16.png similarity index 100% rename from public/favicons/favicon-16x16.png rename to public/favicon-16x16.png diff --git a/public/favicons/favicon-32x32.png b/public/favicon-32x32.png similarity index 100% rename from public/favicons/favicon-32x32.png rename to public/favicon-32x32.png diff --git a/public/favicons/favicon.ico b/public/favicon.ico similarity index 100% rename from public/favicons/favicon.ico rename to public/favicon.ico diff --git a/public/favicons/mstile-150x150.png b/public/mstile-150x150.png similarity index 100% rename from public/favicons/mstile-150x150.png rename to public/mstile-150x150.png diff --git a/public/favicons/safari-pinned-tab.svg b/public/safari-pinned-tab.svg similarity index 100% rename from public/favicons/safari-pinned-tab.svg rename to public/safari-pinned-tab.svg diff --git a/public/favicons/site.webmanifest b/public/site.webmanifest similarity index 71% rename from public/favicons/site.webmanifest rename to public/site.webmanifest index 9278c4a..3251c05 100644 --- a/public/favicons/site.webmanifest +++ b/public/site.webmanifest @@ -3,12 +3,12 @@ "short_name": "", "icons": [ { - "src": "/favicons/android-chrome-192x192.png", + "src": "/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" }, { - "src": "/favicons/android-chrome-512x512.png", + "src": "/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" } diff --git a/public/static/512x512.png b/public/static/512x512.png deleted file mode 100644 index 21022ef514888edf94e3a83b67e99cb67e8ff38d..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2286 zcmeAS@N?(olHy`uVBq!ia0y~yU;;9k7&zE~)R&4Yzkn2Hfk$L90|U1(2s1Lwnj--e zWGoJHcVbv~PUa<$!;&U>cv7h@-A}a#}N3*AkV@L(#+Z!8mk2nY%IAHs@@bC5A zoiWW$jmDt@HoJfGFiiMl&fw6;z|f$;$iUzTw6uu@XbvY(vk(J=fC>YHf(HYG!-T=A z;MdvXcdO4cFs!#23a-T(r0M1J85x3PhDwNI_X9)2^|J3X`GLuEaHkint_P+1bMNe! z8I}y)R0Q%v-RHvZ_ly}1X!8xFEQ}l_7jE87XJ`;%A8N%AiXS8y9&Ei^`|R+L&C&}t z?* + linkDisabled?: boolean } - -const { author } = Astro.props -const { name, avatar, bio } = author.data +const { author, linkDisabled = false } = Astro.props +const { name, avatar, bio, pronouns, github, twitter, linkedin, website } = + author.data ---
- - -
-

{name}

-

{bio}

+
+ + + +
+
+
+

{name}

+ { + pronouns && ( + ({pronouns}) + ) + } +
+

{bio}

+
+
    + { + github && ( +
  • + + + +
    • + ) + } + { + twitter && ( +
  • + + + +
    • + ) + } + { + linkedin && ( +
  • + + + +
    • + ) + } + { + website && ( +
  • + + + +
    • + ) + } +
- +
diff --git a/src/components/BlogCard.astro b/src/components/BlogCard.astro index 66f25f0..5ef5e7c 100644 --- a/src/components/BlogCard.astro +++ b/src/components/BlogCard.astro @@ -1,10 +1,10 @@ --- -import type { CollectionEntry } from 'astro:content' -import { formatDate, readingTime, parseAuthors } from '@lib/utils' -import { Image } from 'astro:assets' +import AvatarComponent from '@/components/ui/avatar' import { Badge } from '@/components/ui/badge' import { Separator } from '@/components/ui/separator' -import AvatarComponent from '@/components/ui/avatar' +import { formatDate, parseAuthors, readingTime } from '@lib/utils' +import { Image } from 'astro:assets' +import type { CollectionEntry } from 'astro:content' import Link from './Link.astro' type Props = { diff --git a/src/components/Breadcrumbs.astro b/src/components/Breadcrumbs.astro new file mode 100644 index 0000000..be9b672 --- /dev/null +++ b/src/components/Breadcrumbs.astro @@ -0,0 +1,53 @@ +--- +import { + Breadcrumb, + BreadcrumbItem, + BreadcrumbLink, + BreadcrumbList, + BreadcrumbPage, + BreadcrumbSeparator, +} from '@/components/ui/breadcrumb' +import { HomeIcon } from 'lucide-react' + +export interface BreadcrumbItem { + href?: string + label: string + icon?: any +} + +interface Props { + items: BreadcrumbItem[] +} + +const { items } = Astro.props +--- + + + + + + + + + { + items.map((item, index) => ( + <> + + + {index === items.length - 1 ? ( + + {item.icon && } + {item.label} + + ) : ( + + {item.icon && } + {item.label} + + )} + + + )) + } + + diff --git a/src/components/Head.astro b/src/components/Head.astro index aa3788b..bcec696 100644 --- a/src/components/Head.astro +++ b/src/components/Head.astro @@ -2,8 +2,8 @@ import '../styles/global.css' import '../styles/katex.css' -import '@fontsource/geist-sans' import '@fontsource/geist-mono' +import '@fontsource/geist-sans' import { ViewTransitions } from 'astro:transitions' @@ -28,28 +28,14 @@ const { title, description, image = '/static/twitter-card.png' } = Astro.props - - - - - - + + + + + + - + diff --git a/src/components/Header.astro b/src/components/Header.astro index d80e275..7eb1c38 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -1,16 +1,10 @@ --- +import { ModeToggle } from '@/components/ui/mode-toggle' import Container from '@components/Container.astro' import Link from '@components/Link.astro' -import { SITE } from '@consts' -import { ModeToggle } from '@/components/ui/mode-toggle' +import { NAV_LINKS, SITE } from '@consts' import { Image } from 'astro:assets' import logo from '../../public/static/logo.svg' - -const items = [ - { href: '/blog', label: 'blog' }, - { href: '/authors', label: 'authors' }, - { href: '/about', label: 'about' }, -] ---