diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/BlockLink.tsx | 12 | ||||
| -rw-r--r-- | src/components/Footer.tsx | 103 | ||||
| -rw-r--r-- | src/components/SEO.tsx | 103 |
3 files changed, 135 insertions, 83 deletions
diff --git a/src/components/BlockLink.tsx b/src/components/BlockLink.tsx new file mode 100644 index 0000000..f2724e7 --- /dev/null +++ b/src/components/BlockLink.tsx @@ -0,0 +1,12 @@ +import React from "react"; +import { BlockAnchor, BlockBody } from "../styles"; + +const BlockLink = ({ children, ...attributes }) => { + return ( + <BlockBody theme={{ link: true }}> + <BlockAnchor {...attributes}>{children}</BlockAnchor> + </BlockBody> + ); +}; + +export default BlockLink; diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx new file mode 100644 index 0000000..3e6932b --- /dev/null +++ b/src/components/Footer.tsx @@ -0,0 +1,103 @@ +import React from "react"; +import { Footer } from "../styles"; + +const SHORT_CHARS = [ + "0", + "1", + "2", + "3", + "4", + "5", + "6", + "7", + "8", + "9", + "a", + "b", + "c", + "d", + "e", + "f", + "g", + "h", + "i", + "j", + "k", + "l", + "m", + "n", + "o", + "p", + "q", + "r", + "s", + "t", + "u", + "v", + "w", + "x", + "y", + "z", + "A", + "B", + "C", + "D", + "E", + "F", + "G", + "H", + "I", + "J", + "K", + "L", + "M", + "N", + "O", + "P", + "Q", + "R", + "S", + "T", + "U", + "V", + "W", + "X", + "Y", + "Z", +]; + +function toShort(valu: number): string { + return ( + valu + .toString() + .match(/.{1,2}/g) + ?.map((s) => SHORT_CHARS[parseInt(s)]) + .join("") ?? "" + ); +} + +function getTimestamp(seconds: number): string { + const date = new Date(seconds * 1000); + const dateArr = [ + date.getUTCFullYear(), + date.getUTCMonth(), + date.getUTCDate(), + date.getUTCHours(), + date.getUTCMinutes(), + ]; + + return dateArr.map(toShort).join(".") + "-0"; +} + +const FooterInfo = ({ timestamp }) => { + return ( + <Footer> + <span> + ©2022 kjhoerr@https://submelon.dev/: + {getTimestamp(parseInt(timestamp))} + </span> + </Footer> + ); +}; + +export default FooterInfo; diff --git a/src/components/SEO.tsx b/src/components/SEO.tsx index e3683df..6d3323b 100644 --- a/src/components/SEO.tsx +++ b/src/components/SEO.tsx @@ -1,88 +1,25 @@ import React from "react"; -import PropTypes from "prop-types"; -import { Helmet } from "react-helmet"; -import { useStaticQuery, graphql } from "gatsby"; -interface MetaProps { - name: string; - content: string; -} - -interface SEOProps { - description: string; - lang: string; - meta: MetaProps[]; - title: string; -} - -function SEO({ description, lang, meta, title }: SEOProps): React.ReactElement { - const { site } = useStaticQuery( - graphql` - query { - site { - siteMetadata { - title - description - author - } - } - } - ` - ); - const metaDescription = description || site.siteMetadata.description; +export function Head(): React.ReactElement { + const metaDescription = + "The official website of Kevin Hoerr, developer of websites."; return ( - <Helmet - htmlAttributes={{ - lang, - }} - title={title} - titleTemplate={`%s | ${site.siteMetadata.title}`} - meta={[ - { - name: `description`, - content: metaDescription, - }, - { - property: `og:title`, - content: title, - }, - { - property: `og:description`, - content: metaDescription, - }, - { - property: `og:type`, - content: `website`, - }, - { - name: `twitter:card`, - content: `summary`, - }, - { - name: `twitter:creator`, - content: site.siteMetadata.author, - }, - { - name: `twitter:title`, - content: title, - }, - { - name: `twitter:description`, - content: metaDescription, - }, - ].concat(meta)} - /> + <> + <meta name="twitter:description" content={metaDescription} /> + <meta + name="twitter:title" + content="Kevin J Hoerr <kjhoerr@submelon.tech>" + /> + <meta name="twitter:creator" content="Kevin J Hoerr" /> + <meta name="twitter:card" content="summary" /> + <meta property="og:type" content="website" /> + <meta property="og:description" content={metaDescription} /> + <meta + property="og:title" + content="Kevin J Hoerr <kjhoerr@submelon.tech>" + /> + <meta name="description" content={metaDescription} /> + <title>Kevin J Hoerr <kjhoerr@submelon.tech></title> + </> ); } -SEO.defaultProps = { - lang: `en`, - meta: [], - description: ``, -}; -SEO.propTypes = { - description: PropTypes.string, - lang: PropTypes.string, - meta: PropTypes.arrayOf(PropTypes.object), - title: PropTypes.string.isRequired, -}; -export default SEO; |
