diff --git a/src/docs/components/SimpleCard.js b/src/docs/components/SimpleCard.js
index cd93b6af9..7cbafc0a6 100644
--- a/src/docs/components/SimpleCard.js
+++ b/src/docs/components/SimpleCard.js
@@ -5,8 +5,7 @@ import React from 'react';
// ===================================================
const SimpleCard = ({
title,
- children,
- isDarkMode
+ children
}) => (
diff --git a/src/docs/pages/archive.js b/src/docs/pages/archive.js
index 4f781a258..3c9abc375 100644
--- a/src/docs/pages/archive.js
+++ b/src/docs/pages/archive.js
@@ -7,7 +7,7 @@ import Meta from '../components/Meta';
import Shell from '../components/Shell';
import SnippetCard from '../components/SnippetCard';
-import { capitalize, getRawCodeBlocks as getCodeBlocks } from '../util';
+import { getRawCodeBlocks as getCodeBlocks } from '../util';
// ===================================================
// Individual snippet category/tag page
diff --git a/src/docs/pages/glossary.js b/src/docs/pages/glossary.js
new file mode 100644
index 000000000..f6004a1b0
--- /dev/null
+++ b/src/docs/pages/glossary.js
@@ -0,0 +1,60 @@
+import React from 'react';
+import { graphql } from 'gatsby';
+import { connect } from 'react-redux';
+import { pushNewPage } from '../state/app';
+
+import Meta from '../components/Meta';
+import Shell from '../components/Shell';
+import SimpleCard from '../components/SimpleCard';
+
+// ===================================================
+// Individual snippet category/tag page
+// ===================================================
+const GlossaryPage = props => {
+ const posts = props.data.snippetDataJson.data;
+ console.log(posts);
+
+ React.useEffect(() => {
+ props.dispatch(pushNewPage('Glossary', props.path));
+ }, []);
+
+ return (
+ <>
+
+
+ Glossary
+ Developers use a lot of terminology daily. Every once in a while, you might find a term you do not know. We know how frustrating that can get, so we provide you with a handy glossary of frequently used web development terms.
+ {posts &&
+ posts.map(term => (
+
+ {term.attributes.text}
+
+ ))}
+
+ >
+ );
+};
+
+export default connect(
+ state => ({
+ isDarkMode: state.app.isDarkMode,
+ lastPageTitle: state.app.lastPageTitle,
+ lastPageUrl: state.app.lastPageUrl,
+ searchQuery: state.app.searchQuery,
+ }),
+ null,
+)(GlossaryPage);
+
+export const archivePageQuery = graphql`
+ query GlossaryPage {
+ snippetDataJson(meta: {type: {eq: "glossaryTermArray"}}) {
+ data {
+ attributes {
+ text
+ }
+ title
+ id
+ }
+ }
+ }
+`;
diff --git a/src/docs/pages/list.js b/src/docs/pages/list.js
index 77d936f46..3f8287a0b 100644
--- a/src/docs/pages/list.js
+++ b/src/docs/pages/list.js
@@ -61,16 +61,21 @@ const ListPage = props => {
return acc;
}, []);
const staticPages = [
+ {
+ url: 'beginner',
+ title: 'Beginner snippets',
+ description: 'Snippets aimed towards individuals at the start of their web developer journey.',
+ },
+ {
+ url: 'glossary',
+ title: 'Glossary',
+ description: 'A handy glossary of web development terminology.',
+ },
{
url: 'about',
title: 'About',
description: 'A few word about us, our goals and our projects.',
},
- {
- url: 'beginner',
- title: 'Beginner snippets',
- description: 'Snippets aimed towards individuals at the start of their web developer journey.',
- }
];
React.useEffect(() => {
diff --git a/src/docs/templates/TagPage.js b/src/docs/templates/TagPage.js
index 80e709197..03c9bf766 100644
--- a/src/docs/templates/TagPage.js
+++ b/src/docs/templates/TagPage.js
@@ -66,7 +66,6 @@ export const tagPageQuery = graphql`
totalCount
edges {
node {
- excerpt(pruneLength: 400)
id
html
rawMarkdownBody