home: add leaf icon to h1

src/components/leaf-icon.js

@@ -0,0 +1,13 @@
+import { SvgIcon } from "@mui/material"
+import React from "react"
+
+const LeafIcon = props => (
+  <SvgIcon {...props}>
+    <path
+      d="M16.7745 11.8704C17.85 11.4939 18.7309 11.1136 19.647 10.882C21.2473 10.4791 22.245 11.1042 22.768 12.6819C23.8213 15.8599 21.0916 20.8246 18.5417 21.6606C14.6456 22.937 10.8125 23.4435 6.78653 22.5473C1.31969 21.3311 -0.71462 16.5942 0.218156 11.5316C0.700307 8.91646 2.73832 8.11819 4.97847 9.42668C5.4087 9.67708 5.82594 9.95007 6.4379 10.3304C6.72534 9.0219 6.8366 7.87909 7.2353 6.84924C7.88992 5.16233 8.57235 3.44718 9.5385 1.93724C10.5529 0.351995 12.2293 -0.308838 14.0911 0.135483C16.0253 0.596748 16.9822 2.16693 17.1324 3.9894C17.3048 6.09804 17.0805 8.24057 17.0044 10.3699C16.9914 10.8105 16.8746 11.2473 16.7745 11.8704Z"
+      fill="#0FB45D"
+    />
+  </SvgIcon>
+)
+
+export default LeafIcon

src/pages/index.js

@@ -4,9 +4,10 @@ import { Link as GatsbyLink, graphql } from "gatsby"
 import Bio from "../components/bio"
 import Layout from "../components/layout"
 import Seo from "../components/seo"
-import { Box, Button, Link, List, ListItem, ListItemIcon, ListItemText, Stack, Typography } from "@mui/material"
+import { Box, Button, Link, List, ListItem, ListItemIcon, ListItemText, Stack, SvgIcon, Typography } from "@mui/material"
 import EastIcon from '@mui/icons-material/East'
 import { H1Separator, H2Separator } from "../components/heading-separators"
+import LeafIcon from "../components/leaf-icon"
 
 const serviceMenu = [
   { label: "Support", path: "/" },
@@ -46,7 +47,10 @@ const BlogIndex = ({ data, location }) => {
           variant="h1"
           sx={{ fontWeight: 400, fontSize: 44, lineHeight: "40px" }}
         >
-          Autonomic is a co-operative that is owned and run by its workers
+          Autonomic is a co-operative that is owned and run by its workers{" "}
+          <span>
+            <LeafIcon />
+          </span>
         </Typography>
       </Box>
       <H1Separator title="What we offer" component="h2" />
@@ -115,39 +119,6 @@ const BlogIndex = ({ data, location }) => {
           Contact us at hello@autonomic.zone
         </Button>
       </Box>
-      {/* <Bio /> */}
-      {/* <ol style={{ listStyle: `none` }}>
-        {posts.map(post => {
-          const title = post.frontmatter.title || post.fields.slug
-
-          return (
-            <li key={post.fields.slug}>
-              <article
-                className="post-list-item"
-                itemScope
-                itemType="http://schema.org/Article"
-              >
-                <header>
-                  <h2>
-                    <Link to={post.fields.slug} itemProp="url">
-                      <span itemProp="headline">{title}</span>
-                    </Link>
-                  </h2>
-                  <small>{post.frontmatter.date}</small>
-                </header>
-                <section>
-                  <p
-                    dangerouslySetInnerHTML={{
-                      __html: post.frontmatter.description || post.excerpt,
-                    }}
-                    itemProp="description"
-                  />
-                </section>
-              </article>
-            </li>
-          )
-        })}
-      </ol> */}
     </Layout>
   )
 }