From 1ecbcf6f5d4021c17a41d810d324be9af6384e0a Mon Sep 17 00:00:00 2001 From: Richard Pastenes Date: Wed, 7 Oct 2020 10:48:53 -0700 Subject: [PATCH] Exercise 4 --- site/gatsby-config.js | 11 +++++--- site/package.json | 1 + site/src/components/footer.js | 34 +++++++++++++++++++++--- site/src/components/header.js | 5 +++- site/src/images/favicon.png | Bin 0 -> 6582 bytes site/src/pages/tickets.js | 47 ++++++++++++++++++++++++++++++++++ 6 files changed, 90 insertions(+), 8 deletions(-) create mode 100644 site/src/images/favicon.png create mode 100644 site/src/pages/tickets.js diff --git a/site/gatsby-config.js b/site/gatsby-config.js index 09b788e..9ddc0bd 100644 --- a/site/gatsby-config.js +++ b/site/gatsby-config.js @@ -2,9 +2,12 @@ module.exports = { siteMetadata: { title: `SketchXConf 2020`, - description: `description`, - author: `@you`, - siteUrl: `https://monica.dev/gatsbyworkshop`, + description: `A conference site mockup made from a Gatsby Workshop`, + author: `Richard Pastenes`, + social: { + twitter: `@richardpastenes`, + }, + siteUrl: `https://gatsby-workshop-richard.netlify.app/`, }, plugins: [ `gatsby-plugin-react-helmet`, @@ -17,7 +20,7 @@ module.exports = { background_color: `#ffffff`, theme_color: `#000`, display: `minimal-ui`, - icon: `src/images/pencil-icon.png`, + icon: `src/images/favicon.png`, }, }, `gatsby-plugin-postcss`, diff --git a/site/package.json b/site/package.json index 7733ad3..da0b798 100644 --- a/site/package.json +++ b/site/package.json @@ -17,6 +17,7 @@ "react": "16.13.1", "react-dom": "16.13.1", "react-helmet": "5.2.1", + "react-icons": "^3.11.0", "typeface-inter": "^3.12.0" }, "husky": { diff --git a/site/src/components/footer.js b/site/src/components/footer.js index 73a1c8b..5f4bb11 100644 --- a/site/src/components/footer.js +++ b/site/src/components/footer.js @@ -1,7 +1,23 @@ import React from "react"; -import { Link } from "gatsby"; +import { useStaticQuery, graphql, Link } from "gatsby"; +import { FaTwitter } from "react-icons/fa"; export default function footer() { + const data = useStaticQuery(graphql` + query FooterQuery { + site { + siteMetadata { + author + siteUrl + social { + twitter + } + title + description + } + } + } + `); return (
@@ -11,13 +27,14 @@ export default function footer() { to="/" className="no-underline text-gray-700 hover:text-gray-500" > - © SketchXConf 2020 + © {data.site.siteMetadata.title} •{" "} + {data.site.siteMetadata.description}

+

+ + Twitter + + +

diff --git a/site/src/components/header.js b/site/src/components/header.js index 59e82a3..e64301b 100644 --- a/site/src/components/header.js +++ b/site/src/components/header.js @@ -5,7 +5,10 @@ import Logo from "../images/pencil-icon.png"; function Header({ siteTitle }) { const [isExpanded, toggleExpansion] = useState(false); - const NavLinks = [{ href: "/", name: "Home" }]; + const NavLinks = [ + { href: "/", name: "Home" }, + { href: "/tickets", name: "Tickets" }, + ]; return (