diff --git a/src/components/CodeExamples/CodeExamples.js b/src/components/CodeExamples/CodeExamples.js
index 4d264763..d7573773 100644
--- a/src/components/CodeExamples/CodeExamples.js
+++ b/src/components/CodeExamples/CodeExamples.js
@@ -1,53 +1,58 @@
import React, { useState } from "react";
-import SyntaxHighlighter from "react-syntax-highlighter";
import classNames from "classnames";
-
-import "./CodeExamples.scss";
+import { Light as SyntaxHighlighter } from "react-syntax-highlighter";
+import { javascript, go, python, bash } from 'react-syntax-highlighter/dist/esm/languages/hljs';
import Colors from "./Colors";
-import { python, curl, node, go } from "./Code";
+import * as snippets from "./Code";
+import "./CodeExamples.scss";
+
+SyntaxHighlighter.registerLanguage('javascript', javascript);
+SyntaxHighlighter.registerLanguage('go', go);
+SyntaxHighlighter.registerLanguage('python', python);
+SyntaxHighlighter.registerLanguage('bash', bash);
export default function CodeExamples() {
const [active, setActive] = useState(1);
return (
-
- - setActive(1)} className={classNames({ active: active === 1 })}>
+
+
+
+
+
+
{active === 1 && (
-
- {curl}
+
+ {snippets.curl}
)}
{active === 2 && (
- {python}
+ {snippets.python}
)}
{active === 3 && (
-
- {node}
+
+ {snippets.node}
)}
{active === 4 && (
- {go}
+ {snippets.go}
)}
diff --git a/src/components/CodeExamples/CodeExamples.scss b/src/components/CodeExamples/CodeExamples.scss
index b174a0ff..f4ae1ead 100644
--- a/src/components/CodeExamples/CodeExamples.scss
+++ b/src/components/CodeExamples/CodeExamples.scss
@@ -7,7 +7,7 @@
align-items: flex-end;
height: 65px;
- li {
+ button {
display: block;
flex: 1;
color: $white60;
@@ -30,23 +30,23 @@
}
}
- li:hover,
- li.active {
+ button:hover,
+ button.active {
color: $white;
background-color: #171917;
line-height: 65px;
}
- li:first-child {
+ button:first-child {
border-top-left-radius: 12px;
}
- li:last-child {
+ button:last-child {
border-top-right-radius: 12px;
}
- li.filler,
- li.filler:hover {
+ button.filler,
+ button.filler:hover {
flex: 1;
height: 57px;
border-top-right-radius: 12px;
diff --git a/src/components/Mailing/Mailing.scss b/src/components/Mailing/Mailing.scss
index 33b46dd2..bb95a4a8 100644
--- a/src/components/Mailing/Mailing.scss
+++ b/src/components/Mailing/Mailing.scss
@@ -43,7 +43,7 @@
display: inline-block;
vertical-align: middle;
margin: -2px 8px 0 0;
- background-image: url('/images/green-check.svg');
+ background-image: url('../../images/green-check.svg');
background-repeat: no-repeat;
background-size: 28px;
background-position: top -300px center;
diff --git a/src/components/seo.js b/src/components/seo.js
new file mode 100644
index 00000000..cacf237e
--- /dev/null
+++ b/src/components/seo.js
@@ -0,0 +1,83 @@
+/**
+ * SEO component that queries for data with
+ * Gatsby's useStaticQuery React hook
+ *
+ * See: https://www.gatsbyjs.org/docs/use-static-query/
+ */
+
+import React from "react";
+import PropTypes from "prop-types";
+import Helmet from "react-helmet";
+import { useStaticQuery, graphql } from "gatsby";
+
+function SEO({ lang, meta }) {
+ const { site } = useStaticQuery(
+ graphql`
+ query {
+ site {
+ siteMetadata {
+ title
+ author
+ description
+ }
+ }
+ }
+ `
+ );
+
+ return (
+
+ );
+}
+
+SEO.defaultProps = {
+ lang: `en`,
+ meta: [],
+ description: ``
+};
+
+SEO.propTypes = {
+ lang: PropTypes.string,
+ meta: PropTypes.arrayOf(PropTypes.object)
+};
+
+export default SEO;
diff --git a/public/fonts/hinted-subset-HaasGrotDispR-55Roman.woff b/src/fonts/hinted-subset-HaasGrotDispR-55Roman.woff
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotDispR-55Roman.woff
rename to src/fonts/hinted-subset-HaasGrotDispR-55Roman.woff
diff --git a/public/fonts/hinted-subset-HaasGrotDispR-55Roman.woff2 b/src/fonts/hinted-subset-HaasGrotDispR-55Roman.woff2
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotDispR-55Roman.woff2
rename to src/fonts/hinted-subset-HaasGrotDispR-55Roman.woff2
diff --git a/public/fonts/hinted-subset-HaasGrotDispR-65Medium.woff b/src/fonts/hinted-subset-HaasGrotDispR-65Medium.woff
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotDispR-65Medium.woff
rename to src/fonts/hinted-subset-HaasGrotDispR-65Medium.woff
diff --git a/public/fonts/hinted-subset-HaasGrotDispR-65Medium.woff2 b/src/fonts/hinted-subset-HaasGrotDispR-65Medium.woff2
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotDispR-65Medium.woff2
rename to src/fonts/hinted-subset-HaasGrotDispR-65Medium.woff2
diff --git a/public/fonts/hinted-subset-HaasGrotTextR-55Roman.woff b/src/fonts/hinted-subset-HaasGrotTextR-55Roman.woff
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotTextR-55Roman.woff
rename to src/fonts/hinted-subset-HaasGrotTextR-55Roman.woff
diff --git a/public/fonts/hinted-subset-HaasGrotTextR-55Roman.woff2 b/src/fonts/hinted-subset-HaasGrotTextR-55Roman.woff2
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotTextR-55Roman.woff2
rename to src/fonts/hinted-subset-HaasGrotTextR-55Roman.woff2
diff --git a/public/fonts/hinted-subset-HaasGrotTextR-65Medium.woff b/src/fonts/hinted-subset-HaasGrotTextR-65Medium.woff
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotTextR-65Medium.woff
rename to src/fonts/hinted-subset-HaasGrotTextR-65Medium.woff
diff --git a/public/fonts/hinted-subset-HaasGrotTextR-65Medium.woff2 b/src/fonts/hinted-subset-HaasGrotTextR-65Medium.woff2
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotTextR-65Medium.woff2
rename to src/fonts/hinted-subset-HaasGrotTextR-65Medium.woff2
diff --git a/public/fonts/hinted-subset-HaasGrotTextR-75Bold.woff b/src/fonts/hinted-subset-HaasGrotTextR-75Bold.woff
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotTextR-75Bold.woff
rename to src/fonts/hinted-subset-HaasGrotTextR-75Bold.woff
diff --git a/public/fonts/hinted-subset-HaasGrotTextR-75Bold.woff2 b/src/fonts/hinted-subset-HaasGrotTextR-75Bold.woff2
similarity index 100%
rename from public/fonts/hinted-subset-HaasGrotTextR-75Bold.woff2
rename to src/fonts/hinted-subset-HaasGrotTextR-75Bold.woff2
diff --git a/src/global.scss b/src/global.scss
index 5418630f..705ba4d8 100644
--- a/src/global.scss
+++ b/src/global.scss
@@ -2,40 +2,40 @@
@font-face {
font-family: "Haas Grot Disp";
- src: url("/fonts/hinted-subset-HaasGrotDispR-55Roman.woff2") format("woff2"),
- url("/fonts/hinted-subset-HaasGrotDispR-55Roman.woff") format("woff");
+ src: url("./fonts/hinted-subset-HaasGrotDispR-55Roman.woff2") format("woff2"),
+ url("./fonts/hinted-subset-HaasGrotDispR-55Roman.woff") format("woff");
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: "Haas Grot Disp";
- src: url("/fonts/hinted-subset-HaasGrotDispR-65Medium.woff2") format("woff2"),
- url("/fonts/hinted-subset-HaasGrotDispR-65Medium.woff") format("woff");
+ src: url("./fonts/hinted-subset-HaasGrotDispR-65Medium.woff2") format("woff2"),
+ url("./fonts/hinted-subset-HaasGrotDispR-65Medium.woff") format("woff");
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: "Haas Grot Text";
- src: url("/fonts/hinted-subset-HaasGrotTextR-75Bold.woff2") format("woff2"),
- url("/fonts/hinted-subset-HaasGrotTextR-75Bold.woff") format("woff");
+ src: url("./fonts/hinted-subset-HaasGrotTextR-75Bold.woff2") format("woff2"),
+ url("./fonts/hinted-subset-HaasGrotTextR-75Bold.woff") format("woff");
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: "Haas Grot Text";
- src: url("/fonts/hinted-subset-HaasGrotTextR-65Medium.woff2") format("woff2"),
- url("/fonts/hinted-subset-HaasGrotTextR-65Medium.woff") format("woff");
+ src: url("./fonts/hinted-subset-HaasGrotTextR-65Medium.woff2") format("woff2"),
+ url("./fonts/hinted-subset-HaasGrotTextR-65Medium.woff") format("woff");
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: "Haas Grot Text";
- src: url("/fonts/hinted-subset-HaasGrotTextR-55Roman.woff2") format("woff2"),
- url("/fonts/hinted-subset-HaasGrotTextR-55Roman.woff") format("woff");
+ src: url("./fonts/hinted-subset-HaasGrotTextR-55Roman.woff2") format("woff2"),
+ url("./fonts/hinted-subset-HaasGrotTextR-55Roman.woff") format("woff");
font-weight: normal;
font-style: normal;
}
diff --git a/public/images/green-check.svg b/src/images/green-check.svg
similarity index 100%
rename from public/images/green-check.svg
rename to src/images/green-check.svg
diff --git a/src/images/logo.svg b/src/images/logo.svg
index 452f0d32..16c695f9 100644
--- a/src/images/logo.svg
+++ b/src/images/logo.svg
@@ -1,4 +1,4 @@
-
+