- implement actions section

- implement settings section

src/templates/Onyx.js

@@ -37,6 +37,7 @@ const Onyx = ({ data }) => {
   return (
     <PageContext.Provider value={{ data, heading: Heading }}>
       <div
+        id="page"
         className="p-10 rounded"
         style={{
           fontFamily: data.metadata.font,

src/templates/blocks/Awards/AwardsA.js

@@ -17,7 +17,9 @@ const AwardItem = (x) => (
         </h6>
       )}
     </div>
-    <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    {x.summary && (
+      <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    )}
   </div>
 );
 

src/templates/blocks/Certifications/CertificationsA.js

@@ -17,7 +17,9 @@ const CertificationItem = (x) => (
         </h6>
       )}
     </div>
-    <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    {x.summary && (
+      <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    )}
   </div>
 );
 

src/templates/blocks/Education/EducationA.js

@@ -21,7 +21,9 @@ const EducationItem = (x) => (
         <span className="text-sm font-medium">{x.gpa}</span>
       </div>
     </div>
-    <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    {x.summary && (
+      <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    )}
   </div>
 );
 

src/templates/blocks/Projects/ProjectsA.js

@@ -21,7 +21,9 @@ const ProjectItem = (x) => (
         </h6>
       )}
     </div>
-    <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    {x.summary && (
+      <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    )}
   </div>
 );
 

src/templates/blocks/References/ReferencesA.js

@@ -9,7 +9,9 @@ const ReferenceItem = (x) => (
     <span className="text-xs">{x.position}</span>
     <span className="text-xs">{x.phone}</span>
     <span className="text-xs">{x.email}</span>
-    <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    {x.summary && (
+      <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    )}
   </div>
 );
 

src/templates/blocks/Skills/SkillsA.js

@@ -15,7 +15,7 @@ const SkillsA = () => {
   return safetyCheck(data.skills) ? (
     <div>
       <Heading>{data.skills.heading}</Heading>
-      <div className="grid grid-cols-2 gap-2">
+      <div className="grid grid-cols-2 row-gap-2 col-gap-4">
         {data.skills.items.map(SkillItem)}
       </div>
     </div>

src/templates/blocks/Work/WorkA.js

@@ -16,7 +16,9 @@ const WorkItem = (x) => (
         </h6>
       )}
     </div>
-    <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    {x.summary && (
+      <ReactMarkdown className="markdown mt-2 text-sm" source={x.summary} />
+    )}
   </div>
 );