-
Notifications
You must be signed in to change notification settings - Fork 10
/
layout.js
74 lines (68 loc) · 1.73 KB
/
layout.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
/**
* Layout component that queries for data
* with Gatsby's useStaticQuery component
*
* See: https://www.gatsbyjs.org/docs/use-static-query/
*/
import React from "react"
import PropTypes from "prop-types"
import { useStaticQuery, graphql, Link } from "gatsby"
import Header from "./header"
import "./layout.scss"
const Layout = ({ children }) => {
const data = useStaticQuery(graphql`
query SiteTitleQuery {
site {
siteMetadata {
title
}
}
}
`)
return (
<>
<Header siteTitle={data.site.siteMetadata.title} />
<div
style={{
margin: `0 auto`,
maxWidth: 960,
padding: `0 1.0875rem 1.45rem`,
}}
>
<main>{children}</main>
</div>
<footer>
<div id="footerContainer">
<div className="row">
<div className="half">
<Link to="/about">このサイトについて</Link>
</div>
<div className="half" style={{ textAlign: `right` }}>
<img
src="https://drive.google.com/uc?id=1ReaOXbZz2mHy2CKZ7cQONvot6vp3S02m"
alt="筑波大学"
id="footerLogo"
/>
</div>
</div>
<div>
<p id="copyright">
© {new Date().getFullYear()},{` `}
<a
href="https://www.stb.tsukuba.ac.jp/~webgaku/"
target="_blank"
rel="noopener noreferrer"
>
筑波大学Webページ学生委員会
</a>
</p>
</div>
</div>
</footer>
</>
)
}
Layout.propTypes = {
children: PropTypes.node.isRequired,
}
export default Layout