diff --git a/components/Footer.tsx b/components/Footer.tsx
index 4fc10b7..726c87e 100644
--- a/components/Footer.tsx
+++ b/components/Footer.tsx
@@ -4,6 +4,7 @@ import { FaZhihu } from '@react-icons/all-files/fa/FaZhihu'
import { FaGithub } from '@react-icons/all-files/fa/FaGithub'
import { FaLinkedin } from '@react-icons/all-files/fa/FaLinkedin'
import { FaEnvelopeOpenText } from '@react-icons/all-files/fa/FaEnvelopeOpenText'
+import { FaYoutube } from '@react-icons/all-files/fa/FaYoutube'
import { IoSunnyOutline } from '@react-icons/all-files/io5/IoSunnyOutline'
import { IoMoonSharp } from '@react-icons/all-files/io5/IoMoonSharp'
@@ -106,6 +107,17 @@ export const FooterImpl: React.FC = () => {
rel='noopener noreferrer'
>
+ )}
+
+ {config.youtube && (
+
+
)}
diff --git a/components/PageSocial.module.css b/components/PageSocial.module.css
index 9731dd3..87113e2 100644
--- a/components/PageSocial.module.css
+++ b/components/PageSocial.module.css
@@ -100,6 +100,13 @@
border-color: #c9510c;
}
+.youtube .actionBgPane {
+ background: #FF0000;
+}
+.youtube:hover {
+ border-color: #FF0000;
+}
+
.medium .actionBgPane {
background: #00ab6c;
}
diff --git a/components/PageSocial.tsx b/components/PageSocial.tsx
index 0d2900c..7f9c207 100644
--- a/components/PageSocial.tsx
+++ b/components/PageSocial.tsx
@@ -55,6 +55,17 @@ const socialLinks: SocialLink[] = [
)
+ },
+
+ config.youtube && {
+ name: 'youtube',
+ href: `https://www.youtube.com/${config.youtube}`,
+ title: `YouTube ${config.youtube}`,
+ icon: (
+
+ )
}
].filter(Boolean)
diff --git a/components/styles.module.css b/components/styles.module.css
index 7b1c7de..011b197 100644
--- a/components/styles.module.css
+++ b/components/styles.module.css
@@ -101,6 +101,10 @@
color: #c9510c;
}
+.youtube:hover {
+ color: #ff0000;
+}
+
.linkedin:hover {
color: #0077b5;
}
diff --git a/lib/config.ts b/lib/config.ts
index 74bb373..e42b53d 100644
--- a/lib/config.ts
+++ b/lib/config.ts
@@ -56,6 +56,7 @@ export const language: string = getSiteConfig('language', 'en')
// social accounts
export const twitter: string | null = getSiteConfig('twitter', null)
export const github: string | null = getSiteConfig('github', null)
+export const youtube: string | null = getSiteConfig('youtube', null)
export const linkedin: string | null = getSiteConfig('linkedin', null)
export const newsletter: string | null = getSiteConfig('newsletter', null)
export const zhihu: string | null = getSiteConfig('zhihu', null)
@@ -146,8 +147,8 @@ export const site: Site = {
export const fathomId = isDev ? null : process.env.NEXT_PUBLIC_FATHOM_ID
export const fathomConfig = fathomId
? {
- excludedDomains: ['localhost', 'localhost:3000']
- }
+ excludedDomains: ['localhost', 'localhost:3000']
+ }
: undefined
export const posthogId = process.env.NEXT_PUBLIC_POSTHOG_ID
diff --git a/lib/site-config.ts b/lib/site-config.ts
index a518b78..61552d5 100644
--- a/lib/site-config.ts
+++ b/lib/site-config.ts
@@ -14,6 +14,7 @@ export interface SiteConfig {
github?: string
linkedin?: string
newsletter?: string
+ youtube?: string
zhihu?: string
defaultPageIcon?: string | null
diff --git a/site.config.ts b/site.config.ts
index e7a5826..f17107c 100644
--- a/site.config.ts
+++ b/site.config.ts
@@ -20,7 +20,8 @@ export default siteConfig({
twitter: 'transitive_bs',
github: 'transitive-bullshit',
linkedin: 'fisch2',
- // newsletter: '#', //Use full newsletter URL
+ // newsletter: '#', // optional newsletter URL
+ // youtube: '#', // optional youtube channel name or `channel/UCGbXXXXXXXXXXXXXXXXXXXXXX`
// default notion icon and cover images for site-wide consistency (optional)
// page-specific values will override these site-wide defaults