1 files changed, 28 insertions, 0 deletions
diff --git a/src/js/cms-preview-templates/contact.js b/src/js/cms-preview-templates/contact.js
new file mode 100644
index 0000000..dea318c
--- /dev/null
+++ b/src/js/cms-preview-templates/contact.js
@@ -0,0 +1,28 @@
+import React from "react";
+
+const ContactEntry = ({heading, text}) =>
+  <div>
+    <h4 className="f4 b lh-title mb2 primary">{ heading }</h4>
+    <p>{ text }</p>
+  </div>;
+
+const ContactEntries = ({data}) => data && data.length > 0
+    ? <div className="flex-ns mb3">
+      {data.map(({heading, text}) => <ContactEntry heading={heading} text={text} />)}
+    </div>
+    : "";
+
+export default class ContactPreview extends React.Component {
+  render() {
+    const {entry, getAsset, widgetFor} = this.props;
+    const entryContactEntries = entry.getIn(["data", "contact_entries"]);
+    const contactEntries = entryContactEntries ? entryContactEntries.toJS() : [];
+    return <div className="ph3 bg-off-white">
+      <img src={getAsset(entry.getIn(["data", "logo"]))} alt="" className="db w4 center pv4" />
+      <div className="center mw6 pv3">
+        { widgetFor("body") }
+        <ContactEntries data={contactEntries} />
+      </div>
+    </div>;
+  }
+}