diff --git a/src/components/Footer/index.js b/src/components/Footer/index.js new file mode 100644 index 0000000..656736d --- /dev/null +++ b/src/components/Footer/index.js @@ -0,0 +1,34 @@ +import React from 'react'; +import { StaticQuery, graphql } from 'gatsby'; + +import style from './style.module.css'; + +const query = graphql` + query FooterQuery { + site { + siteMetadata { + buildId + } + } + } +`; + +const Footer = () => ( + +); + +export default Footer; diff --git a/src/components/Footer/style.module.css b/src/components/Footer/style.module.css new file mode 100644 index 0000000..71c42ee --- /dev/null +++ b/src/components/Footer/style.module.css @@ -0,0 +1,26 @@ +@import url('../../globals.module.css'); + +.footer { + display: flex; + align-items: flex-start; + margin: var(--spacing-margin) 0; + + @media screen and (max-width: 800px) { + display: block; + } + + & img { + vertical-align: text-top; + width: 80px; + height: 15px; + } +} + +.list { + composes: inline-list with-separator-left; + flex: 1; +} + +.buildId { + color: color(var(--color-brown) blend(var(--color-tan) 25%)); +} diff --git a/src/components/Layout/index.js b/src/components/Layout/index.js index 5ba6cd9..d4361f1 100644 --- a/src/components/Layout/index.js +++ b/src/components/Layout/index.js @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import { Helmet } from 'react-helmet'; import Header from 'components/Header'; +import Footer from 'components/Footer'; const Layout = ({ title, children }) => @@ -10,6 +11,7 @@ const Layout = ({ title, children }) =>
{ children } +