Section intro structure and styling

src/components/SectionIntro.js

@@ -6,26 +6,32 @@ let headlineLight = 'text-indigo'
 
 const IntroDefault = ({ ...props }) => (
   <div className={`${props.classes}`}>
-    <h3
-      className={`
+    {props.intro && (
+      <h3
+        className={`
       ${
         props.light ? headlineDark : headlineLight
       } opacity-50 text-sm font-light uppercase pt-2 pb-1`}
-    >
-      {props.intro}
-    </h3>
-    <h1
-      className={`${props.light ? headlineDark : ''}
+      >
+        {props.intro}
+      </h3>
+    )}
+    {props.headline && (
+      <h1
+        className={`${props.light ? headlineDark : ''}
      font-light pt-1 pb-2`}
-    >
-      {props.headline}
-    </h1>
-    <p
-      className={`${props.light ? headlineDark : ''} 
+      >
+        {props.headline}
+      </h1>
+    )}
+    {props.text && (
+      <p
+        className={`${props.light ? headlineDark : ''} 
     font-light leading-normal opacity-70`}
-    >
-      {props.text}
-    </p>
+      >
+        {props.text}
+      </p>
+    )}
   </div>
 )