diff --git a/.gitignore b/.gitignore index f813275..b1ea9f4 100644 --- a/.gitignore +++ b/.gitignore @@ -67,3 +67,4 @@ yarn-error.log .pnp.js # Yarn Integrity file .yarn-integrity +**/resources/ \ No newline at end of file diff --git a/src/components/header.js b/src/components/header.jsx similarity index 94% rename from src/components/header.js rename to src/components/header.jsx index 8990b7e..51e2480 100644 --- a/src/components/header.js +++ b/src/components/header.jsx @@ -2,6 +2,8 @@ import { Link } from "gatsby" import PropTypes from "prop-types" import React from "react" +import Logo from "./logo" + const Header = ({ siteTitle }) => (
( textDecoration: `none`, }} > + {siteTitle} diff --git a/src/components/image.js b/src/components/image.js deleted file mode 100644 index e61edb6..0000000 --- a/src/components/image.js +++ /dev/null @@ -1,32 +0,0 @@ -import React from "react" -import { useStaticQuery, graphql } from "gatsby" -import Img from "gatsby-image" - -/* - * This component is built using `gatsby-image` to automatically serve optimized - * images with lazy loading and reduced file sizes. The image is loaded using a - * `useStaticQuery`, which allows us to load the image from directly within this - * component, rather than having to pass the image data down from pages. - * - * For more information, see the docs: - * - `gatsby-image`: https://gatsby.dev/gatsby-image - * - `useStaticQuery`: https://www.gatsbyjs.org/docs/use-static-query/ - */ - -const Image = () => { - const data = useStaticQuery(graphql` - query { - placeholderImage: file(relativePath: { eq: "gatsby-astronaut.png" }) { - childImageSharp { - fluid(maxWidth: 300) { - ...GatsbyImageSharpFluid - } - } - } - } - `) - - return -} - -export default Image diff --git a/src/components/layout.js b/src/components/layout.jsx similarity index 100% rename from src/components/layout.js rename to src/components/layout.jsx diff --git a/src/components/logo.jsx b/src/components/logo.jsx new file mode 100644 index 0000000..210037f --- /dev/null +++ b/src/components/logo.jsx @@ -0,0 +1,26 @@ +import React from "react" +import { useStaticQuery, graphql } from "gatsby" +import Img from "gatsby-image" + +const Logo = () => { + const data = useStaticQuery(graphql` + query { + placeholderImage: file(relativePath: { eq: "lekol-plus-Logo.png" }) { + childImageSharp { + fluid(maxWidth: 300) { + ...GatsbyImageSharpFluid + } + } + } + } + `) + + return ( + + ) +} + +export default Logo diff --git a/src/components/seo.js b/src/components/seo.jsx similarity index 100% rename from src/components/seo.js rename to src/components/seo.jsx diff --git a/src/images/lekol-plus-Logo.png b/src/images/lekol-plus-Logo.png new file mode 100644 index 0000000..c9f7faa Binary files /dev/null and b/src/images/lekol-plus-Logo.png differ diff --git a/src/pages/404.js b/src/pages/404.jsx similarity index 100% rename from src/pages/404.js rename to src/pages/404.jsx diff --git a/src/pages/index.js b/src/pages/index.js deleted file mode 100644 index 6f061ca..0000000 --- a/src/pages/index.js +++ /dev/null @@ -1,22 +0,0 @@ -import React from "react" -import { Link } from "gatsby" - -import Layout from "../components/layout" -import Image from "../components/image" -import SEO from "../components/seo" - -const IndexPage = () => ( - - -

Hi people

-

Welcome to your new Gatsby site.

-

Now go build something great.

-
- -
- Go to page 2
- Go to "Using TypeScript" - -) - -export default IndexPage diff --git a/src/pages/index.jsx b/src/pages/index.jsx new file mode 100644 index 0000000..de5e43f --- /dev/null +++ b/src/pages/index.jsx @@ -0,0 +1,13 @@ +import React from "react" +import { Link } from "gatsby" + +import Layout from "../components/layout" +import SEO from "../components/seo" + +const IndexPage = () => ( + + + +) + +export default IndexPage diff --git a/src/pages/page-2.js b/src/pages/page-2.js deleted file mode 100644 index 666c23e..0000000 --- a/src/pages/page-2.js +++ /dev/null @@ -1,16 +0,0 @@ -import React from "react" -import { Link } from "gatsby" - -import Layout from "../components/layout" -import SEO from "../components/seo" - -const SecondPage = () => ( - - -

Hi from the second page

-

Welcome to page 2

- Go back to the homepage - -) - -export default SecondPage diff --git a/src/pages/using-typescript.tsx b/src/pages/using-typescript.tsx deleted file mode 100644 index f9212ca..0000000 --- a/src/pages/using-typescript.tsx +++ /dev/null @@ -1,34 +0,0 @@ -// If you don't want to use TypeScript you can delete this file! -import React from "react" -import { PageProps, Link, graphql } from "gatsby" - -import Layout from "../components/layout" -import SEO from "../components/seo" - -type DataProps = { - site: { - buildTime: string - } -} - -const UsingTypescript: React.FC> = ({ data, path }) => ( - - -

Gatsby supports TypeScript by default!

-

This means that you can create and write .ts/.tsx files for your pages, components etc. Please note that the gatsby-*.js files (like gatsby-node.js) currently don't support TypeScript yet.

-

For type checking you'll want to install typescript via npm and run tsc --init to create a .tsconfig file.

-

You're currently on the page "{path}" which was built on {data.site.buildTime}.

-

To learn more, head over to our documentation about TypeScript.

- Go back to the homepage - -) - -export default UsingTypescript - -export const query = graphql` - { - site { - buildTime(formatString: "YYYY-MM-DD hh:mm a z") - } - } -`