Skip to content

Commit 6af2ec5

Browse files
JDetmarpraveenwebkidunot89karthikvt26lastnamearya
authored
Update (#1)
* add font display swap * add style for blockquote (hasura#53) * add config for trailing slash (hasura#54) * misc: handle empty values for github button, sidebar links * setup prettier, eslint (hasura#61) * add prettier setup * add eslint package & eslint settings update * add dark mode theme (close hasura#16) (hasura#62) * add prettier setup * add eslint package & eslint settings update * Add title tag for a11y * add dark mode toggle switch * basic theme setup * add Global Styles file * add dark mode for reading content * fix ~ padding in pre element * add dark mode for NextPrevious Buttons * update NextPrevious refactor to Functional Component * fix ~ Main top padding * fix ~ Table row background on dark mode Co-authored-by: Praveen Durairaju <praveend.web@gmail.com> * add target _blank for external sidebar links (close hasura#59) (hasura#63) * update theme, fix dark mode theme on mobile (hasura#64) Co-authored-by: Praveen Durairaju <praveend.web@gmail.com> Co-authored-by: Geoffrey K Taylor <geoffrey.taylor@outlook.com> Co-authored-by: Praveen Durairaju <praveen@hasura.io> Co-authored-by: Karthik Venkateswaran <karthikvt26@users.noreply.github.com> Co-authored-by: Jigyasu Arya <arya.jigyasu6815@gmail.com>
1 parent 32f45de commit 6af2ec5

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+2932
-1769
lines changed

.eslintrc.json

Lines changed: 37 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,48 @@
11
{
2-
"env": {
3-
"browser": true
2+
"extends": [
3+
"eslint:recommended",
4+
"plugin:import/errors",
5+
"plugin:react/recommended",
6+
"plugin:jsx-a11y/recommended",
7+
"prettier",
8+
"prettier/react"
9+
],
10+
"plugins": ["react", "import", "jsx-a11y"],
11+
"settings": {
12+
"react": {
13+
"version": "detect"
14+
}
415
},
5-
"globals": {
6-
"graphql": false
16+
"rules": {
17+
"react/prop-types": 0,
18+
"react/react-in-jsx-scope": "off",
19+
"lines-between-class-members": ["error", "always"],
20+
"padding-line-between-statements": [
21+
"error",
22+
{ "blankLine": "always", "prev": ["const", "let", "var"], "next": "*" },
23+
{
24+
"blankLine": "always",
25+
"prev": ["const", "let", "var"],
26+
"next": ["const", "let", "var"]
27+
},
28+
{ "blankLine": "always", "prev": "directive", "next": "*" },
29+
{ "blankLine": "any", "prev": "directive", "next": "directive" }
30+
]
731
},
32+
"parser": "babel-eslint",
833
"parserOptions": {
934
"ecmaVersion": 10,
1035
"sourceType": "module",
1136
"ecmaFeatures": {
1237
"jsx": true
1338
}
39+
},
40+
"env": {
41+
"es6": true,
42+
"browser": true,
43+
"node": true
44+
},
45+
"globals": {
46+
"graphql": false
1447
}
1548
}

.prettierrc

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"printWidth": 100,
3+
"jsxBracketSameLine": false,
4+
"singleQuote": true,
5+
"tabWidth": 2,
6+
"trailingComma": "es5"
7+
}

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ We also wanted to serve these tutorials in sub paths of [learn.hasura.io](https:
1818
- Progressive Web App, Works Offline
1919
- Google Analytics Integration
2020
- Automatically generated sidebar navigation, table of contents, previous/next
21+
- Dark Mode toggle
2122
- Edit on Github
2223
- Fully customisable
2324
- Rich embeds and live code editor using MDX

config.js

Lines changed: 77 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,67 +1,81 @@
11
const config = {
2-
"gatsby": {
3-
"pathPrefix": "/",
4-
"siteUrl": "https://learn.hasura.io",
5-
"gaTrackingId": null
6-
},
7-
"header": {
8-
"logo": "https://graphql-engine-cdn.hasura.io/learn-hasura/assets/homepage/favicon.png",
9-
"logoLink": "https://learn.hasura.io",
10-
"title": "Gatsby Gitbook Boilerplate",
11-
"githubUrl": "https://github.com/hasura/gatsby-gitbook-boilerplate",
12-
"helpUrl": "",
13-
"tweetText": "",
14-
"links": [
15-
{ "text": "", "link": ""}
16-
],
17-
"search": {
18-
"enabled": false,
19-
"indexName": "",
20-
"algoliaAppId": process.env.GATSBY_ALGOLIA_APP_ID,
21-
"algoliaSearchKey": process.env.GATSBY_ALGOLIA_SEARCH_KEY,
22-
"algoliaAdminKey": process.env.ALGOLIA_ADMIN_KEY
23-
}
24-
},
25-
"sidebar": {
26-
"forcedNavOrder": [
27-
"/introduction",
28-
"/codeblock"
29-
],
30-
"collapsedNav": [
31-
"/codeblock"
32-
],
33-
"links": [
34-
{ "text": "Hasura", "link": "https://hasura.io"},
35-
],
36-
"frontline": false,
37-
"ignoreIndex": true,
38-
},
39-
"siteMetadata": {
40-
"title": "Gatsby Gitbook Boilerplate | Hasura",
41-
"description": "Documentation built with mdx. Powering learn.hasura.io ",
42-
"ogImage": null,
43-
"docsLocation": "https://github.com/hasura/gatsby-gitbook-boilerplate/tree/master/content",
44-
"favicon": "https://graphql-engine-cdn.hasura.io/img/hasura_icon_black.svg"
45-
},
46-
"pwa": {
47-
"enabled": false, // disabling this will also remove the existing service worker.
48-
"manifest": {
49-
"name": "Gatsby Gitbook Starter",
50-
"short_name": "GitbookStarter",
51-
"start_url": "/",
52-
"background_color": "#6b37bf",
53-
"theme_color": "#6b37bf",
54-
"display": "standalone",
55-
"crossOrigin": "use-credentials",
56-
icons: [
57-
{
58-
src: "src/pwa-512.png",
59-
sizes: `512x512`,
60-
type: `image/png`,
61-
},
62-
],
63-
},
64-
}
2+
gatsby: {
3+
pathPrefix: '/',
4+
siteUrl: 'https://hasura.io',
5+
gaTrackingId: null,
6+
trailingSlash: false,
7+
},
8+
header: {
9+
logo: 'https://graphql-engine-cdn.hasura.io/learn-hasura/assets/homepage/brand.svg',
10+
logoLink: 'https://hasura.io/learn/',
11+
title:
12+
"<a href='https://hasura.io/learn/'><img class='img-responsive' src='https://graphql-engine-cdn.hasura.io/learn-hasura/assets/homepage/learn-logo.svg' alt='Learn logo' /></a>",
13+
githubUrl: 'https://github.com/hasura/gatsby-gitbook-boilerplate',
14+
helpUrl: '',
15+
tweetText: '',
16+
social: `<li>
17+
<a href="https://twitter.com/hasurahq" target="_blank" rel="noopener">
18+
<div class="twitterBtn">
19+
<img src='https://graphql-engine-cdn.hasura.io/learn-hasura/assets/homepage/twitter-brands-block.svg' alt={'Discord'}/>
20+
</div>
21+
</a>
22+
</li>
23+
<li>
24+
<a href="https://discordapp.com/invite/hasura" target="_blank" rel="noopener">
25+
<div class="discordBtn">
26+
<img src='https://graphql-engine-cdn.hasura.io/learn-hasura/assets/homepage/discord-brands-block.svg' alt={'Discord'}/>
27+
</div>
28+
</a>
29+
</li>`,
30+
links: [{ text: '', link: '' }],
31+
search: {
32+
enabled: false,
33+
indexName: '',
34+
algoliaAppId: process.env.GATSBY_ALGOLIA_APP_ID,
35+
algoliaSearchKey: process.env.GATSBY_ALGOLIA_SEARCH_KEY,
36+
algoliaAdminKey: process.env.ALGOLIA_ADMIN_KEY,
37+
},
38+
},
39+
sidebar: {
40+
forcedNavOrder: [
41+
'/introduction', // add trailing slash if enabled above
42+
'/codeblock',
43+
],
44+
collapsedNav: [
45+
'/codeblock', // add trailing slash if enabled above
46+
],
47+
links: [{ text: 'Hasura', link: 'https://hasura.io' }],
48+
frontline: false,
49+
ignoreIndex: true,
50+
title:
51+
"<a href='https://hasura.io/learn/'>graphql </a><div class='greenCircle'></div><a href='https://hasura.io/learn/graphql/react/introduction/'>react</a>",
52+
},
53+
siteMetadata: {
54+
title: 'Gatsby Gitbook Boilerplate | Hasura',
55+
description: 'Documentation built with mdx. Powering hasura.io/learn ',
56+
ogImage: null,
57+
docsLocation: 'https://github.com/hasura/gatsby-gitbook-boilerplate/tree/master/content',
58+
favicon: 'https://graphql-engine-cdn.hasura.io/img/hasura_icon_black.svg',
59+
},
60+
pwa: {
61+
enabled: false, // disabling this will also remove the existing service worker.
62+
manifest: {
63+
name: 'Gatsby Gitbook Starter',
64+
short_name: 'GitbookStarter',
65+
start_url: '/',
66+
background_color: '#6b37bf',
67+
theme_color: '#6b37bf',
68+
display: 'standalone',
69+
crossOrigin: 'use-credentials',
70+
icons: [
71+
{
72+
src: 'src/pwa-512.png',
73+
sizes: `512x512`,
74+
type: `image/png`,
75+
},
76+
],
77+
},
78+
},
6579
};
6680

6781
module.exports = config;

gatsby-config.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ const plugins = [
1111
}
1212
},
1313
'gatsby-plugin-emotion',
14-
'gatsby-plugin-remove-trailing-slashes',
1514
'gatsby-plugin-react-helmet',
1615
{
1716
resolve: "gatsby-source-filesystem",
@@ -77,6 +76,12 @@ if (config.pwa && config.pwa.enabled && config.pwa.manifest) {
7776
} else {
7877
plugins.push('gatsby-plugin-remove-serviceworker');
7978
}
79+
80+
// check and remove trailing slash
81+
if (config.gatsby && !config.gatsby.trailingSlash) {
82+
plugins.push('gatsby-plugin-remove-trailing-slashes');
83+
}
84+
8085
module.exports = {
8186
pathPrefix: config.gatsby.pathPrefix,
8287
siteMetadata: {

gatsby-node.js

Lines changed: 40 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
1-
const componentWithMDXScope = require("gatsby-plugin-mdx/component-with-mdx-scope");
2-
const path = require("path");
3-
const startCase = require("lodash.startcase");
1+
const componentWithMDXScope = require('gatsby-plugin-mdx/component-with-mdx-scope');
2+
3+
const path = require('path');
4+
5+
const startCase = require('lodash.startcase');
6+
7+
const config = require('./config');
48

59
exports.createPages = ({ graphql, actions }) => {
610
const { createPage } = actions;
11+
712
return new Promise((resolve, reject) => {
813
resolve(
914
graphql(
@@ -33,11 +38,11 @@ exports.createPages = ({ graphql, actions }) => {
3338
// Create blog posts pages.
3439
result.data.allMdx.edges.forEach(({ node }) => {
3540
createPage({
36-
path: node.fields.slug ? node.fields.slug : "/",
37-
component: path.resolve("./src/templates/docs.js"),
41+
path: node.fields.slug ? node.fields.slug : '/',
42+
component: path.resolve('./src/templates/docs.js'),
3843
context: {
39-
id: node.fields.id
40-
}
44+
id: node.fields.id,
45+
},
4146
});
4247
});
4348
})
@@ -48,18 +53,18 @@ exports.createPages = ({ graphql, actions }) => {
4853
exports.onCreateWebpackConfig = ({ actions }) => {
4954
actions.setWebpackConfig({
5055
resolve: {
51-
modules: [path.resolve(__dirname, "src"), "node_modules"],
52-
alias: {
53-
$components: path.resolve(__dirname, "src/components"),
54-
buble: '@philpl/buble' // to reduce bundle size
55-
}
56-
}
56+
modules: [path.resolve(__dirname, 'src'), 'node_modules'],
57+
alias: {
58+
$components: path.resolve(__dirname, 'src/components'),
59+
buble: '@philpl/buble', // to reduce bundle size
60+
},
61+
},
5762
});
5863
};
5964

6065
exports.onCreateBabelConfig = ({ actions }) => {
6166
actions.setBabelPlugin({
62-
name: "@babel/plugin-proposal-export-default-from"
67+
name: '@babel/plugin-proposal-export-default-from',
6368
});
6469
};
6570

@@ -68,28 +73,37 @@ exports.onCreateNode = ({ node, getNode, actions }) => {
6873

6974
if (node.internal.type === `Mdx`) {
7075
const parent = getNode(node.parent);
71-
let value = parent.relativePath.replace(parent.ext, "");
7276

73-
if (value === "index") {
74-
value = "";
77+
let value = parent.relativePath.replace(parent.ext, '');
78+
79+
if (value === 'index') {
80+
value = '';
7581
}
7682

77-
createNodeField({
78-
name: `slug`,
79-
node,
80-
value: `/${value}`
81-
});
83+
if (config.gatsby && config.gatsby.trailingSlash) {
84+
createNodeField({
85+
name: `slug`,
86+
node,
87+
value: value === '' ? `/` : `/${value}/`,
88+
});
89+
} else {
90+
createNodeField({
91+
name: `slug`,
92+
node,
93+
value: `/${value}`,
94+
});
95+
}
8296

8397
createNodeField({
84-
name: "id",
98+
name: 'id',
8599
node,
86-
value: node.id
100+
value: node.id,
87101
});
88102

89103
createNodeField({
90-
name: "title",
104+
name: 'title',
91105
node,
92-
value: node.frontmatter.title || startCase(parent.name)
106+
value: node.frontmatter.title || startCase(parent.name),
93107
});
94108
}
95109
};

0 commit comments

Comments
 (0)