added markdown, organized templates, fixed email overflow issue in pikachu

src/shared/MarkdownHelpText.js

@@ -0,0 +1,22 @@
+import React from 'react';
+
+const MarkdownHelpText = ({ className }) => {
+  return (
+    <div className={className}>
+      <p className="text-gray-800 text-xs">
+        You can use{' '}
+        <a
+          className="text-blue-600 hover:underline"
+          target="_blank"
+          rel="noopener noreferrer"
+          href="https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet"
+        >
+          GitHub Flavored Markdown
+        </a>{' '}
+        to style this section of text.
+      </p>
+    </div>
+  );
+};
+
+export default MarkdownHelpText;

src/shared/TabBar.js

@@ -28,13 +28,13 @@ const TabBar = ({ tabs, currentTab, setCurrentTab }) => {
       <ul id="tabs" ref={tabsRef} className="flex overflow-x-scroll">
         {tabs.map(tab =>
           currentTab === tab ? (
-            <li key={tab} className="mx-1">
+            <li key={tab} className="mx-1 list-none">
               <div className="whitespace-no-wrap bg-gray-700 text-white rounded-md text-sm py-2 px-6 font-medium">
                 {tab}
               </div>
             </li>
           ) : (
-            <li key={tab} className="mx-1">
+            <li key={tab} className="mx-1 list-none">
               <div
                 className="bg-white whitespace-no-wrap rounded-md cursor-pointer text-sm py-2 px-6 font-medium hover:bg-gray-200"
                 onClick={() => setCurrentTab(tab)}

src/shared/TextArea.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import MarkdownHelpText from './MarkdownHelpText';
 
 const TextArea = ({ label, placeholder, value, onChange, className, rows = 5 }) => (
   <div className={`w-full flex flex-col ${className}`}>
@@ -12,6 +13,8 @@ const TextArea = ({ label, placeholder, value, onChange, className, rows = 5 })
       onChange={e => onChange(e.target.value)}
       placeholder={placeholder}
     />
+
+    <MarkdownHelpText className="mt-2" />
   </div>
 );