From a74802d33afd2edd45cee240b0ee2120f1a533eb Mon Sep 17 00:00:00 2001
From: Sarbik Betal <sarbikb55@gmail.com>
Date: Fri, 25 Sep 2020 15:37:39 +0530
Subject: [PATCH 1/4] [Fix] Align social icons to the left

---
 src/components/markdown.js        | 19 +++++++++++++++++--
 src/components/markdownPreview.js |  3 ++-
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/components/markdown.js b/src/components/markdown.js
index 3c41c48..ed5e305 100644
--- a/src/components/markdown.js
+++ b/src/components/markdown.js
@@ -26,6 +26,18 @@ const Markdown = props => {
     }
     return ""
   }
+  const SectionTitle = props => {
+    if (props.label) {
+      return (
+        <>
+          {`<h3 align="left">${props.label}</h3>`}
+          <br />
+          <br />
+        </>
+      )
+    }
+    return ""
+  }
   const DisplayWork = props => {
     if (props.prefix && props.project) {
       if (props.link) {
@@ -61,7 +73,7 @@ const Markdown = props => {
     if (props.username) {
       return (
         <>
-          {`<a href="${props.base}/${props.username}" target="blank"><img align="center" src="${props.icon}" alt="${props.username}" height="30" width="30" /></a>`}
+          {`<a href="${props.base}/${props.username}" target="blank" style="margin:0.5rem"><img align="center" src="${props.icon}" alt="${props.username}" height="30" width="30" /></a>`}
           <br />
         </>
       )
@@ -273,7 +285,10 @@ const Markdown = props => {
           github={props.social.github}
         />
       </>
-      {isSocial(props.social) ? `<p align="center">` : ""} <br />
+      {isSocial(props.social) ? `<p align="left">` : ""} <br />
+      <>
+        <SectionTitle label="Connect with me:" />
+      </>
       <>
         <DisplaySocial
           base="https://codepen.io"
diff --git a/src/components/markdownPreview.js b/src/components/markdownPreview.js
index 8eb9737..2d87d9b 100644
--- a/src/components/markdownPreview.js
+++ b/src/components/markdownPreview.js
@@ -104,7 +104,8 @@ const MarkdownPreview = props => {
   }
   const SocialPreview = props => {
     return (
-      <div className="flex justify-center items-end">
+      <div className="flex justify-start items-end flex-wrap">
+        <h3 className="w-full text-lg sm:text-xl">Connect with me:</h3> 
         <DisplaySocial
           base="https://codepen.io"
           icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/codepen.svg"

From 852931e37d1906f9dc0e3249e1a8dd8fa7f5c61e Mon Sep 17 00:00:00 2001
From: Sarbik Betal <sarbikb55@gmail.com>
Date: Fri, 25 Sep 2020 15:53:05 +0530
Subject: [PATCH 2/4] [Add] added a sectionTitle element.

---
 src/components/markdownPreview.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/markdownPreview.js b/src/components/markdownPreview.js
index 2d87d9b..6db7c4e 100644
--- a/src/components/markdownPreview.js
+++ b/src/components/markdownPreview.js
@@ -18,6 +18,12 @@ const MarkdownPreview = props => {
     }
     return null
   }
+  const SectionTitle = props => {
+    if (props.label) {
+      return <h3 className="w-full text-lg sm:text-xl">{props.label}</h3>
+    }
+    return null
+  }
   const DisplayWork = props => {
     if (props.prefix && props.project) {
       if (props.link) {
@@ -105,7 +111,7 @@ const MarkdownPreview = props => {
   const SocialPreview = props => {
     return (
       <div className="flex justify-start items-end flex-wrap">
-        <h3 className="w-full text-lg sm:text-xl">Connect with me:</h3> 
+        <SectionTitle label="Connect with me:" />
         <DisplaySocial
           base="https://codepen.io"
           icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/codepen.svg"

From 8e91804d48cb1d4c9afe36e2664e3378d3e1dc79 Mon Sep 17 00:00:00 2001
From: Sarbik Betal <sarbikb55@gmail.com>
Date: Fri, 25 Sep 2020 16:11:25 +0530
Subject: [PATCH 3/4] [Fix] Align skills to the left

---
 src/components/markdown.js        | 1 +
 src/components/markdownPreview.js | 1 +
 2 files changed, 2 insertions(+)

diff --git a/src/components/markdown.js b/src/components/markdown.js
index ed5e305..5c52a43 100644
--- a/src/components/markdown.js
+++ b/src/components/markdown.js
@@ -145,6 +145,7 @@ const Markdown = props => {
     })
     return listChosenSkills.length > 0 ? (
       <>
+        <SectionTitle label="Languages and Tools:" />
         {`<p align="left">${listChosenSkills.join(" ")}</p>`}
         <br />
         <br />
diff --git a/src/components/markdownPreview.js b/src/components/markdownPreview.js
index 6db7c4e..79075e6 100644
--- a/src/components/markdownPreview.js
+++ b/src/components/markdownPreview.js
@@ -277,6 +277,7 @@ const MarkdownPreview = props => {
     })
     return listSkills.length > 0 ? (
       <div className="flex flex-wrap justify-start items-center">
+        <SectionTitle label="Languages and Tools:" />
         {listSkills}
       </div>
     ) : (

From 894c1ebb1e5ddc211bc04dff5edaffe9db73b8b0 Mon Sep 17 00:00:00 2001
From: Sarbik Betal <sarbikb55@gmail.com>
Date: Fri, 25 Sep 2020 16:55:30 +0530
Subject: [PATCH 4/4] Code review changes.

---
 src/components/markdown.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/markdown.js b/src/components/markdown.js
index 5c52a43..4b76429 100644
--- a/src/components/markdown.js
+++ b/src/components/markdown.js
@@ -73,7 +73,7 @@ const Markdown = props => {
     if (props.username) {
       return (
         <>
-          {`<a href="${props.base}/${props.username}" target="blank" style="margin:0.5rem"><img align="center" src="${props.icon}" alt="${props.username}" height="30" width="30" /></a>`}
+          {`<a href="${props.base}/${props.username}" target="blank"><img align="center" src="${props.icon}" alt="${props.username}" height="30" width="40" /></a>`}
           <br />
         </>
       )