diff --git a/components/hero.tsx b/components/hero.tsx index be249f3..e8dc60e 100644 --- a/components/hero.tsx +++ b/components/hero.tsx @@ -1,9 +1,62 @@ import { siteConfig } from '@/lib/config'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { + faGithub, + faTwitter, + faMastodon, + faGitAlt, + faLinkedin +} from '@fortawesome/free-brands-svg-icons'; +import { faEnvelope } from '@fortawesome/free-solid-svg-icons'; export function Hero() { const { name, tagline, social } = siteConfig; const initial = name?.charAt(0)?.toUpperCase() || 'G'; + const items = [ + social.github && { + key: 'github', + href: social.github, + label: 'GitHub', + icon: faGithub + }, + social.twitter && { + key: 'twitter', + href: `https://twitter.com/${social.twitter.replace('@', '')}`, + label: 'Twitter', + icon: faTwitter + }, + social.mastodon && { + key: 'mastodon', + href: social.mastodon, + label: 'Mastodon', + icon: faMastodon + }, + social.gitea && { + key: 'gitea', + href: social.gitea, + label: 'Gitea', + icon: faGitAlt + }, + social.linkedin && { + key: 'linkedin', + href: social.linkedin, + label: 'LinkedIn', + icon: faLinkedin + }, + social.email && { + key: 'email', + href: `mailto:${social.email}`, + label: 'Email', + icon: faEnvelope + } + ].filter(Boolean) as { + key: string; + href: string; + label: string; + icon: any; + }[]; + return (
@@ -17,71 +70,20 @@ export function Hero() {

{tagline}

- {(social.github || - social.twitter || - social.linkedin || - social.email || - social.mastodon || - social.gitea) && ( -
- {social.github && ( + {items.length > 0 && ( +
+ {items.map((item) => ( - GitHub + + {item.label} - )} - {social.twitter && ( - - Twitter - - )} - {social.mastodon && ( - - Mastodon - - )} - {social.gitea && ( - - Gitea - - )} - {social.linkedin && ( - - LinkedIn - - )} - {social.email && ( - - Email - - )} + ))}
)}
diff --git a/package-lock.json b/package-lock.json index 254768e..9877060 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,9 @@ "version": "1.0.0", "license": "ISC", "dependencies": { + "@fortawesome/free-brands-svg-icons": "^7.1.0", + "@fortawesome/free-solid-svg-icons": "^7.1.0", + "@fortawesome/react-fontawesome": "^3.1.0", "clsx": "^2.1.1", "contentlayer": "^0.3.4", "gray-matter": "^4.0.3", @@ -609,6 +612,65 @@ "integrity": "sha512-cEee/Z+I12mZcFJshKcCqC8tuX5hG3s+d+9nZ3LabqKF1vKdF41B92pJVCBggjAGORAeOzyyDDKrZwIkLffeOQ==", "license": "MIT" }, + "node_modules/@fortawesome/fontawesome-common-types": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-7.1.0.tgz", + "integrity": "sha512-l/BQM7fYntsCI//du+6sEnHOP6a74UixFyOYUyz2DLMXKx+6DEhfR3F2NYGE45XH1JJuIamacb4IZs9S0ZOWLA==", + "license": "MIT", + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/fontawesome-svg-core": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-7.1.0.tgz", + "integrity": "sha512-fNxRUk1KhjSbnbuBxlWSnBLKLBNun52ZBTcs22H/xEEzM6Ap81ZFTQ4bZBxVQGQgVY0xugKGoRcCbaKjLQ3XZA==", + "license": "MIT", + "peer": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "7.1.0" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/free-brands-svg-icons": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-7.1.0.tgz", + "integrity": "sha512-9byUd9bgNfthsZAjBl6GxOu1VPHgBuRUP9juI7ZoM98h8xNPTCTagfwUFyYscdZq4Hr7gD1azMfM9s5tIWKZZA==", + "license": "(CC-BY-4.0 AND MIT)", + "dependencies": { + "@fortawesome/fontawesome-common-types": "7.1.0" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/free-solid-svg-icons": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-7.1.0.tgz", + "integrity": "sha512-Udu3K7SzAo9N013qt7qmm22/wo2hADdheXtBfxFTecp+ogsc0caQNRKEb7pkvvagUGOpG9wJC1ViH6WXs8oXIA==", + "license": "(CC-BY-4.0 AND MIT)", + "dependencies": { + "@fortawesome/fontawesome-common-types": "7.1.0" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/react-fontawesome": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-3.1.0.tgz", + "integrity": "sha512-5OUQH9aDH/xHJwnpD4J7oEdGvFGJgYnGe0UebaPIdMW9UxYC/f5jv2VjVEgnikdJN0HL8yQxp9Nq+7gqGZpIIA==", + "license": "MIT", + "engines": { + "node": ">=20" + }, + "peerDependencies": { + "@fortawesome/fontawesome-svg-core": "~6 || ~7", + "react": "^18.0.0 || ^19.0.0" + } + }, "node_modules/@grpc/grpc-js": { "version": "1.14.1", "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.14.1.tgz", diff --git a/package.json b/package.json index 837d359..3b30431 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,9 @@ "license": "ISC", "type": "commonjs", "dependencies": { + "@fortawesome/free-brands-svg-icons": "^7.1.0", + "@fortawesome/free-solid-svg-icons": "^7.1.0", + "@fortawesome/react-fontawesome": "^3.1.0", "clsx": "^2.1.1", "contentlayer": "^0.3.4", "gray-matter": "^4.0.3",