From e0e12a9b7f41a3e9ec4aa1e742cf4df3c1282d8e Mon Sep 17 00:00:00 2001
From: si1k <19499950+si1k@users.noreply.github.com>
Date: Mon, 30 May 2022 11:47:56 -0400
Subject: [PATCH] Adding newsletter icon

---
 components/Footer.tsx            | 13 +++++++++++++
 components/PageSocial.module.css |  7 +++++++
 components/PageSocial.tsx        | 11 +++++++++++
 components/styles.module.css     |  4 ++++
 lib/config.ts                    |  1 +
 lib/site-config.ts               |  1 +
 site.config.ts                   |  1 +
 7 files changed, 38 insertions(+)

diff --git a/components/Footer.tsx b/components/Footer.tsx
index 542fca8..4fc10b7 100644
--- a/components/Footer.tsx
+++ b/components/Footer.tsx
@@ -3,6 +3,7 @@ import { FaTwitter } from '@react-icons/all-files/fa/FaTwitter'
 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 { IoSunnyOutline } from '@react-icons/all-files/io5/IoSunnyOutline'
 import { IoMoonSharp } from '@react-icons/all-files/io5/IoMoonSharp'
 
@@ -95,6 +96,18 @@ export const FooterImpl: React.FC = () => {
             <FaLinkedin />
           </a>
         )}
+
+        {config.newsletter && (
+          <a
+            className={styles.newsletter}
+            href={`${config.newsletter}`}
+            title={`Newsletter ${config.author}`}
+            target='_blank'
+            rel='noopener noreferrer'
+          >
+            <FaEnvelopeOpenText />
+          </a>
+        )}
       </div>
     </footer>
   )
diff --git a/components/PageSocial.module.css b/components/PageSocial.module.css
index bb16f8d..9731dd3 100644
--- a/components/PageSocial.module.css
+++ b/components/PageSocial.module.css
@@ -107,6 +107,13 @@
   border-color: #00ab6c;
 }
 
+.newsletter .actionBgPane {
+  background: #777777;
+}
+.newsletter:hover {
+  border-color: #777777;
+}
+
 .email .actionBgPane {
   background: #777;
 }
diff --git a/components/PageSocial.tsx b/components/PageSocial.tsx
index 246f946..0d2900c 100644
--- a/components/PageSocial.tsx
+++ b/components/PageSocial.tsx
@@ -44,6 +44,17 @@ const socialLinks: SocialLink[] = [
         <path d='M6.5 21.5h-5v-13h5v13zM4 6.5C2.5 6.5 1.5 5.3 1.5 4s1-2.4 2.5-2.4c1.6 0 2.5 1 2.6 2.5 0 1.4-1 2.5-2.6 2.5zm11.5 6c-1 0-2 1-2 2v7h-5v-13h5V10s1.6-1.5 4-1.5c3 0 5 2.2 5 6.3v6.7h-5v-7c0-1-1-2-2-2z' />
       </svg>
     )
+  },
+
+  config.newsletter && {
+    name: 'newsletter',
+    href: `${config.newsletter}`,
+    title: `Newsletter ${config.author}`,
+    icon: (
+      <svg xmlns='http://www.w3.org/2000/svg' viewBox="0 0 24 24">
+        <path d="M12 .64L8.23 3H5V5L2.97 6.29C2.39 6.64 2 7.27 2 8V18C2 19.11 2.9 20 4 20H20C21.11 20 22 19.11 22 18V8C22 7.27 21.61 6.64 21.03 6.29L19 5V3H15.77M7 5H17V9.88L12 13L7 9.88M8 6V7.5H16V6M5 7.38V8.63L4 8M19 7.38L20 8L19 8.63M8 8.5V10H16V8.5Z" />
+      </svg>
+    )
   }
 ].filter(Boolean)
 
diff --git a/components/styles.module.css b/components/styles.module.css
index 0824880..7b1c7de 100644
--- a/components/styles.module.css
+++ b/components/styles.module.css
@@ -105,6 +105,10 @@
   color: #0077b5;
 }
 
+.newsletter:hover {
+  color: #777777;
+}
+
 .comments {
   width: 100%;
   margin-top: 2em;
diff --git a/lib/config.ts b/lib/config.ts
index 3d17ae5..74bb373 100644
--- a/lib/config.ts
+++ b/lib/config.ts
@@ -57,6 +57,7 @@ export const language: string = getSiteConfig('language', 'en')
 export const twitter: string | null = getSiteConfig('twitter', null)
 export const github: string | null = getSiteConfig('github', 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)
 
 // default notion values for site-wide consistency (optional; may be overridden on a per-page basis)
diff --git a/lib/site-config.ts b/lib/site-config.ts
index 4521c86..a518b78 100644
--- a/lib/site-config.ts
+++ b/lib/site-config.ts
@@ -13,6 +13,7 @@ export interface SiteConfig {
   twitter?: string
   github?: string
   linkedin?: string
+  newsletter?: string
   zhihu?: string
 
   defaultPageIcon?: string | null
diff --git a/site.config.ts b/site.config.ts
index b58e7fe..64d0d92 100644
--- a/site.config.ts
+++ b/site.config.ts
@@ -20,6 +20,7 @@ export default siteConfig({
   twitter: 'transitive_bs',
   github: 'transitive-bullshit',
   linkedin: 'fisch2',
+  newsletter: '#', //Use full newsletter URL
 
   // default notion icon and cover images for site-wide consistency (optional)
   // page-specific values will override these site-wide defaults