fix: Add Twitter as social profile

konstantinmuenster · Oct 30, 2021 · 81f4e60 · 81f4e60
1 parent fc0a1b2
commit 81f4e60
Show file tree

Hide file tree

Showing 8 changed files with 46 additions and 0 deletions.
diff --git a/example-site/content/settings.json b/example-site/content/settings.json
@@ -13,6 +13,7 @@
             "github": "https://github.com/konstantinmuenster",
             "medium": "https://konstantinmuenster.medium.com",
             "linkedin": "https://linkedin.com",
+            "twitter": "https://twitter.com",
             "mail": "mailto:mail@konstantin.digital"
         }
     },

diff --git a/gatsby-theme-portfolio-minimal/README.md b/gatsby-theme-portfolio-minimal/README.md
@@ -308,6 +308,7 @@ The theme settings can be divided in two parts. There is a `settings.json` file
             "github": "",
             "medium": "",
             "linkedin": "",
+            "twitter": "",
             "mail": ""
         }
     },

diff --git a/gatsby-theme-portfolio-minimal/src/components/Icon/IconTwitter.tsx b/gatsby-theme-portfolio-minimal/src/components/Icon/IconTwitter.tsx
@@ -0,0 +1,37 @@
+import React from 'react';
+
+interface IconTwitterProps {
+    color?: string;
+}
+
+export function IconTwitter(props: IconTwitterProps): React.ReactElement {
+    return (
+        <svg
+            version="1.1"
+            id="Mail"
+            fill={props.color || 'var(--primary-color)'}
+            xmlns="http://www.w3.org/2000/svg"
+            x="0px"
+            y="0px"
+            viewBox="0 0 310 310"
+        >
+            <g id="XMLID_826_">
+                <path
+                    id="XMLID_827_"
+                    d="M302.973,57.388c-4.87,2.16-9.877,3.983-14.993,5.463c6.057-6.85,10.675-14.91,13.494-23.73
+                c0.632-1.977-0.023-4.141-1.648-5.434c-1.623-1.294-3.878-1.449-5.665-0.39c-10.865,6.444-22.587,11.075-34.878,13.783
+                c-12.381-12.098-29.197-18.983-46.581-18.983c-36.695,0-66.549,29.853-66.549,66.547c0,2.89,0.183,5.764,0.545,8.598
+                C101.163,99.244,58.83,76.863,29.76,41.204c-1.036-1.271-2.632-1.956-4.266-1.825c-1.635,0.128-3.104,1.05-3.93,2.467
+                c-5.896,10.117-9.013,21.688-9.013,33.461c0,16.035,5.725,31.249,15.838,43.137c-3.075-1.065-6.059-2.396-8.907-3.977
+                c-1.529-0.851-3.395-0.838-4.914,0.033c-1.52,0.871-2.473,2.473-2.513,4.224c-0.007,0.295-0.007,0.59-0.007,0.889
+                c0,23.935,12.882,45.484,32.577,57.229c-1.692-0.169-3.383-0.414-5.063-0.735c-1.732-0.331-3.513,0.276-4.681,1.597
+                c-1.17,1.32-1.557,3.16-1.018,4.84c7.29,22.76,26.059,39.501,48.749,44.605c-18.819,11.787-40.34,17.961-62.932,17.961
+                c-4.714,0-9.455-0.277-14.095-0.826c-2.305-0.274-4.509,1.087-5.294,3.279c-0.785,2.193,0.047,4.638,2.008,5.895
+                c29.023,18.609,62.582,28.445,97.047,28.445c67.754,0,110.139-31.95,133.764-58.753c29.46-33.421,46.356-77.658,46.356-121.367
+                c0-1.826-0.028-3.67-0.084-5.508c11.623-8.757,21.63-19.355,29.773-31.536c1.237-1.85,1.103-4.295-0.33-5.998
+                C307.394,57.037,305.009,56.486,302.973,57.388z"
+                />
+            </g>
+        </svg>
+    );
+}
diff --git a/gatsby-theme-portfolio-minimal/src/components/Icon/index.tsx b/gatsby-theme-portfolio-minimal/src/components/Icon/index.tsx
@@ -5,6 +5,7 @@ import { IconGithub } from './IconGithub';
 import { IconLinkedIn } from './IconLinkedIn';
 import { IconMail } from './IconMail';
 import { IconMedium } from './IconMedium';
+import { IconTwitter } from './IconTwitter';
 
 interface IconProps {
     name: string;
@@ -25,6 +26,8 @@ export function Icon(props: IconProps): React.ReactElement | null {
             return <IconMail color={props.color} />;
         case 'medium':
             return <IconMedium color={props.color} />;
+        case 'twitter':
+            return <IconTwitter color={props.color} />;
         default:
             return null;
     }

diff --git a/gatsby-theme-portfolio-minimal/src/components/SocialProfiles/configuration.ts b/gatsby-theme-portfolio-minimal/src/components/SocialProfiles/configuration.ts
@@ -4,4 +4,5 @@ export const socialProfileLabels = {
     medium: 'Medium',
     linkedin: 'LinkedIn',
     mail: 'Mail',
+    twitter: 'Twitter',
 };
diff --git a/gatsby-theme-portfolio-minimal/src/components/SocialProfiles/index.tsx b/gatsby-theme-portfolio-minimal/src/components/SocialProfiles/index.tsx
@@ -11,6 +11,7 @@ export enum SocialProfile {
     Medium = 'medium',
     Mail = 'mail',
     LinkedIn = 'linkedin',
+    Twitter = 'twitter',
 }
 
 interface SocialProfilesProps {

diff --git a/gatsby-theme-portfolio-minimal/src/gatsby/node/createSchemaCustomization.js b/gatsby-theme-portfolio-minimal/src/gatsby/node/createSchemaCustomization.js
@@ -51,6 +51,7 @@ module.exports = ({ actions }) => {
         medium: String
         linkedin: String
         mail: String
+        twitter: String
     }
     type Logo {
         text: String

diff --git a/gatsby-theme-portfolio-minimal/src/hooks/useSiteMetadata.tsx b/gatsby-theme-portfolio-minimal/src/hooks/useSiteMetadata.tsx
@@ -44,6 +44,7 @@ export const query = graphql`
                         linkedin
                         mail
                         medium
+                        twitter
                     }
                     titleTemplate
                 }