small fix

src/components/Image.js

@@ -1,8 +1,7 @@
-import * as React from "react"
+import {getImage} from "gatsby-plugin-image"
-import {GatsbyImage, getImage} from "gatsby-plugin-image"
 import {useStaticQuery, graphql} from "gatsby"
 
-const Image = ({name}) => {
+const Image = (name) => {
   const { images: { edges: images } } = useStaticQuery(graphql`
 query {
   images: allFile(filter: {relativeDirectory: {eq: "images"}}) {
@@ -21,9 +20,7 @@ query {
   const propName = name
   const imageData = images.find(({node: {name}}) => name === propName)
   const image = getImage(imageData.node)
-	return (
+  return image
-    <GatsbyImage image={image} />
-	)
 }
 
 export default Image

src/pages/posts/init.js

@@ -2,6 +2,7 @@ import * as React from "react"
 import * as styles from "../../styles/Post.module.css"
 import * as homeStyles from "../../styles/Home.module.css"
 import Header from "../../components/Header"
+import Footer from "../../components/Footer"
 import {StaticImage} from "gatsby-plugin-image"
 
 const InitPage = () => {
@@ -57,6 +58,8 @@ const InitPage = () => {
           </p>
         </section>
       </main>
+
+      <Footer />
     </>
   )
 }

src/pages/posts/law.js

@@ -1,7 +1,8 @@
 import * as React from "react"
 import Image from "../../components/Image"
 import Header from "../../components/Header"
-import {StaticImage} from "gatsby-plugin-image"
+import Footer from "../../components/Footer"
+import {StaticImage, GatsbyImage} from "gatsby-plugin-image"
 import * as styles from "../../styles/Post.module.css"
 import * as homeStyles from "../../styles/Home.module.css"
 import {Link} from "gatsby"
@@ -37,7 +38,7 @@ const LawPage = () => {
                     <h3>{element.title}<br />{element.titleEn}</h3>
                   </div>
                   <small></small>
-                  <Image name={`group${element.path}bg`} alt="test" />
+                  <GatsbyImage image={Image(`group${element.path}bg`)} alt="test" />
                 </Link>
               })
             }
@@ -45,6 +46,7 @@ const LawPage = () => {
         </section>
       </main>
 
+      <Footer />
     </>
   )
 }

src/pages/posts/map.js

@@ -2,6 +2,7 @@ import * as React from "react"
 import * as styles from "../../styles/Post.module.css"
 import * as homeStyles from "../../styles/Home.module.css"
 import Header from "../../components/Header"
+import Footer from "../../components/Footer"
 import {StaticImage} from "gatsby-plugin-image"
 import Copyright from "../../components/Copyright"
 import DownloadReport from "../../components/DownloadReport"
@@ -200,6 +201,8 @@ const MapPage = () => {
           </div>
         </section>
       </main>
+
+      <Footer />
     </>
   )
 }

src/templates/law.js

@@ -1,6 +1,9 @@
 import * as React from "react"
 import Header from "../components/Header"
-import {StaticImage} from "gatsby-plugin-image"
+import Footer from "../components/Footer"
+import Image from "../components/Image"
+import {GatsbyImage} from "gatsby-plugin-image"
+import {Link} from "gatsby"
 import * as style from "../styles/Post.module.css"
 import * as homeStyle from "../styles/Home.module.css"
 
@@ -10,21 +13,22 @@ const LawPage = (props) => {
   return (
     <>
       <Header Background={
-        <StaticImage placeholder="blurred"
+        <GatsbyImage placeholder="blurred"
           style={{
             gridArea: "1/1",
             maxHeight: "50vh",
           }}
           layout="fullWidth"
           alt="header background"
-          src="../images/mainbg.webp"
+          image={Image(`group${element.path}bg`)}
         />
       } />
 
       <main className={homeStyle.container}>
         <section className={style.post}>
+          <Link to="../"><h3>{"<<"}返回目录</h3></Link>
           <h2>{element.title}<br />{element.titleEn}</h2>
-          <small>发布于 {element.date}</small>
+          <small>{element.date}</small>
           <hr />
           {element.videos.map((video) => {
             const poster = video.substr(0, video.indexOf('.mp4')) + '_poster.jpg';
@@ -36,6 +40,7 @@ const LawPage = (props) => {
         </section>
       </main>
 
+      <Footer />
     </>
   )
 }