From d6b7c78a8d11d4d6f8e25e7c67326ada14a6c636 Mon Sep 17 00:00:00 2001
From: Cory Dransfeldt <hi@coryd.dev>
Date: Mon, 6 Jun 2022 12:53:10 -0700
Subject: [PATCH] explicitly size social icons

---
 components/Footer.tsx             | 18 +++++++++---------
 components/social-icons/index.tsx |  6 ++----
 layouts/AuthorLayout.tsx          | 18 +++++++++---------
 3 files changed, 20 insertions(+), 22 deletions(-)

diff --git a/components/Footer.tsx b/components/Footer.tsx
index 14e6547..38f1cf0 100644
--- a/components/Footer.tsx
+++ b/components/Footer.tsx
@@ -7,15 +7,15 @@ export default function Footer() {
     <footer>
       <div className="mt-16 flex flex-col items-center">
         <div className="mb-3 flex space-x-4">
-          <SocialIcon kind="mail" href={`mailto:${siteMetadata.email}`} size={6} />
-          <SocialIcon kind="facebook" href={siteMetadata.facebook} size={6} />
-          <SocialIcon kind="instagram" href={siteMetadata.instagram} size={6} />
-          <SocialIcon kind="youtube" href={siteMetadata.youtube} size={6} />
-          <SocialIcon kind="twitter" href={siteMetadata.twitter} size={6} />
-          <SocialIcon kind="spotify" href={siteMetadata.spotify} size={6} />
-          <SocialIcon kind="applemusic" href={siteMetadata.applemusic} size={6} />
-          <SocialIcon kind="bandcamp" href={siteMetadata.bandcamp} size={6} />
-          <SocialIcon kind="lastfm" href={siteMetadata.lastfm} size={6} />
+          <SocialIcon kind="mail" href={`mailto:${siteMetadata.email}`} />
+          <SocialIcon kind="facebook" href={siteMetadata.facebook} />
+          <SocialIcon kind="instagram" href={siteMetadata.instagram} />
+          <SocialIcon kind="youtube" href={siteMetadata.youtube} />
+          <SocialIcon kind="twitter" href={siteMetadata.twitter} />
+          <SocialIcon kind="spotify" href={siteMetadata.spotify} />
+          <SocialIcon kind="applemusic" href={siteMetadata.applemusic} />
+          <SocialIcon kind="bandcamp" href={siteMetadata.bandcamp} />
+          <SocialIcon kind="lastfm" href={siteMetadata.lastfm} />
         </div>
         <div className="mb-8 flex space-x-2 text-sm text-gray-500 dark:text-gray-400">
           <div>{`© ${new Date().getFullYear()}`}</div>
diff --git a/components/social-icons/index.tsx b/components/social-icons/index.tsx
index 6bf8aeb..edb5810 100644
--- a/components/social-icons/index.tsx
+++ b/components/social-icons/index.tsx
@@ -22,7 +22,7 @@ const components = {
   lastfm: Lastfm,
 }
 
-const SocialIcon = ({ kind, href, size = 6 }) => {
+const SocialIcon = ({ kind, href }) => {
   if (!href || (kind === 'mail' && !/^mailto:\w+([.-]?\w+)@\w+([.-]?\w+)(.\w{2,3})+$/.test(href)))
     return null
 
@@ -36,9 +36,7 @@ const SocialIcon = ({ kind, href, size = 6 }) => {
       href={href}
     >
       <span className="sr-only">{kind}</span>
-      <SocialSvg
-        className={`fill-current text-gray-700 hover:text-primary-500 dark:text-gray-200 dark:hover:text-primary-400 h-${size} w-${size}`}
-      />
+      <SocialSvg className="h-6 w-6 fill-current text-gray-700 hover:text-primary-500 dark:text-gray-200 dark:hover:text-primary-400" />
     </a>
   )
 }
diff --git a/layouts/AuthorLayout.tsx b/layouts/AuthorLayout.tsx
index 464d2d6..a147cc8 100644
--- a/layouts/AuthorLayout.tsx
+++ b/layouts/AuthorLayout.tsx
@@ -43,15 +43,15 @@ export default function AuthorLayout({ children, frontMatter }: Props) {
               className="rounded-sm"
             />
             <div className="flex space-x-3 pt-8">
-              <SocialIcon kind="mail" href={`mailto:${email}`} size={6} />
-              <SocialIcon kind="facebook" href={facebook} size={6} />
-              <SocialIcon kind="instagram" href={instagram} size={6} />
-              <SocialIcon kind="youtube" href={youtube} size={6} />
-              <SocialIcon kind="twitter" href={twitter} size={6} />
-              <SocialIcon kind="spotify" href={spotify} size={6} />
-              <SocialIcon kind="applemusic" href={applemusic} size={6} />
-              <SocialIcon kind="bandcamp" href={bandcamp} size={6} />
-              <SocialIcon kind="lastfm" href={lastfm} size={6} />
+              <SocialIcon kind="mail" href={`mailto:${email}`} />
+              <SocialIcon kind="facebook" href={facebook} />
+              <SocialIcon kind="instagram" href={instagram} />
+              <SocialIcon kind="youtube" href={youtube} />
+              <SocialIcon kind="twitter" href={twitter} />
+              <SocialIcon kind="spotify" href={spotify} />
+              <SocialIcon kind="applemusic" href={applemusic} />
+              <SocialIcon kind="bandcamp" href={bandcamp} />
+              <SocialIcon kind="lastfm" href={lastfm} />
             </div>
           </div>
           <div className="prose max-w-none pt-8 pb-8 dark:prose-dark xl:col-span-2">{children}</div>