Static homepage complete

components/jambonz-ui.js

@@ -3,6 +3,15 @@ import classNames from 'classnames';
 import * as Icons from 'react-feather';
 import { nanoid } from 'nanoid';
 
+export function normalizeSubtext(subtext) {
+  // Normalize how we work with the subtext as an array[]
+  if (!Array.isArray(subtext)) {
+    subtext = [subtext];
+  }
+
+  return subtext;
+}
+
 export function H1({ children }) {
   return <div className="h1">{children}</div>;
 }
@@ -46,12 +55,15 @@ export function MXS({ children }) {
 export function Hero({ data, subStyle }) {
   const classes = {
     'hero': true,
+    'pad': true,
   };
 
   if (subStyle) {
     classes[`hero--${subStyle}`] = true;
   }
 
+  data.subtext = normalizeSubtext(data.subtext);
+
   return (
     <div className={classNames(classes)}>
       <div className="wrap hero__wrap">
@@ -59,11 +71,9 @@ export function Hero({ data, subStyle }) {
           <H1>{data.headline}</H1>
         </div>
         <div className="hero__subtext">
-          {Array.isArray(data.subtext) ? data.subtext.map((subtext) => {
+          {data.subtext.map((subtext) => {
             return <H5 key={nanoid()}>{subtext}</H5>;
-          }) : (
-            <H5>{data.subtext}</H5>
-          )}
+          })}
         </div>
         {data.cta && (
           <div className="hero__cta">

components/kit-of-parts.js

@@ -6,7 +6,7 @@ export default function KitOfParts({pageData}) {
   return (
     <div className="kop">
       {/* High-level design information */}
-      <div className="hero">
+      <div className="hero pad">
         <div className="wrap">
           <H1>
             <div>Kit of Parts</div>