From 678983229838edc815ad72b25979c6c1383c8810 Mon Sep 17 00:00:00 2001 From: GermanGrandas Date: Sat, 6 Mar 2021 21:34:56 -0500 Subject: [PATCH 1/2] adding the language context --- .vscode/settings.json | 6 +++ gatsby-browser.js | 1 + gatsby-config.js | 100 ++++++++++++++++++------------------- gatsby-node.js | 50 ++++++++++++------- package.json | 2 + src/components/header.js | 59 +++++++++++----------- src/components/language.js | 43 ++++++++++++++++ src/components/layout.js | 64 ++++++++++++------------ src/data/speakers.json | 23 ++++++++- src/pages/index.js | 65 ++++++++++++++++-------- src/pages/speakers.js | 42 ++++++++-------- src/templates/speaker.js | 31 ++++++------ 12 files changed, 299 insertions(+), 187 deletions(-) create mode 100644 .vscode/settings.json create mode 100644 src/components/language.js diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..db785c8 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,6 @@ +{ + "editor.formatOnSave": true, + "editor.codeActionsOnSave": { + "source.fixAll.eslint": true + } + } \ No newline at end of file diff --git a/gatsby-browser.js b/gatsby-browser.js index ff807f1..86a8199 100644 --- a/gatsby-browser.js +++ b/gatsby-browser.js @@ -5,3 +5,4 @@ */ // You can delete this file if you're not using it +import 'bootstrap/dist/css/bootstrap.min.css'; diff --git a/gatsby-config.js b/gatsby-config.js index 9901537..edeca6c 100644 --- a/gatsby-config.js +++ b/gatsby-config.js @@ -1,53 +1,53 @@ module.exports = { - siteMetadata: { - title: `PyCon Website Template`, - description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`, - author: `@gatsbyjs`, - }, - plugins: [ - `gatsby-plugin-react-helmet`, - { - resolve: `gatsby-source-filesystem`, - options: { - name: `images`, - path: `${__dirname}/src/images`, - }, + siteMetadata: { + title: `PyCon Website Template`, + description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`, + author: `@gatsbyjs`, }, - /*Data from json files */ - `gatsby-transformer-json`, - { - resolve: `gatsby-source-filesystem`, - options: { - name: `data`, - path: `${__dirname}/src/data/`, - }, - }, - `gatsby-transformer-sharp`, - `gatsby-plugin-sharp`, - { - resolve: `gatsby-plugin-manifest`, - options: { - name: `gatsby-starter-default`, - short_name: `starter`, - start_url: `/`, - background_color: `#663399`, - theme_color: `#663399`, - display: `minimal-ui`, - icon: `src/images/gatsby-icon.png`, // This path is relative to the root of the site. - }, - }, - `gatsby-plugin-gatsby-cloud`, - // this (optional) plugin enables Progressive Web App + Offline functionality - // To learn more, visit: https://gatsby.dev/offline - // `gatsby-plugin-offline`, - { - resolve: `gatsby-plugin-intl`, - options: { - path: `${__dirname}/src/intl`, - languages: [`es`, `en`], - defaultLanguage: `es`, - redirect: false, - }, - }, - ], + plugins: [ + `gatsby-plugin-react-helmet`, + { + resolve: `gatsby-source-filesystem`, + options: { + name: `images`, + path: `${__dirname}/src/images`, + }, + }, + /*Data from json files */ + `gatsby-transformer-json`, + { + resolve: `gatsby-source-filesystem`, + options: { + name: `data`, + path: `${__dirname}/src/data/`, + }, + }, + `gatsby-transformer-sharp`, + `gatsby-plugin-sharp`, + { + resolve: `gatsby-plugin-manifest`, + options: { + name: `gatsby-starter-default`, + short_name: `starter`, + start_url: `/`, + background_color: `#663399`, + theme_color: `#663399`, + display: `minimal-ui`, + icon: `src/images/gatsby-icon.png`, // This path is relative to the root of the site. + }, + }, + `gatsby-plugin-gatsby-cloud`, + // this (optional) plugin enables Progressive Web App + Offline functionality + // To learn more, visit: https://gatsby.dev/offline + // `gatsby-plugin-offline`, + { + resolve: `gatsby-plugin-intl`, + options: { + path: `${__dirname}/src/intl`, + languages: [`es`, `en`], + defaultLanguage: `es`, + redirect: false, + }, + }, + ], }; diff --git a/gatsby-node.js b/gatsby-node.js index aec761f..a296fff 100644 --- a/gatsby-node.js +++ b/gatsby-node.js @@ -3,26 +3,40 @@ * * See: https://www.gatsbyjs.com/docs/node-apis/ */ +exports.onCreatePage = ({ page, actions }) => { + const { createPage, deletePage } = actions; + deletePage(page); + // You can access the variable "locale" in your page queries now + createPage({ + ...page, + context: { + ...page.context, + locale: page.context.intl.language, + defaultLocale: page.context.intl.defaultLanguage, + }, + }); +}; + exports.createPages = async function ({ actions, graphql }) { - const { data } = await graphql(` - query { - allSpeakersJson { - nodes { - description - id - image - name - price + const { data } = await graphql(` + query { + allSpeakersJson { + nodes { + description + id + image + name + price + } + } } - } - } - `); + `); - data.allSpeakersJson.nodes.forEach((node) => { - actions.createPage({ - path: `/speakers/${node.id}`, - component: require.resolve(`./src/templates/speaker.js`), - context: { speakerID: node.id }, + data.allSpeakersJson.nodes.forEach((node) => { + actions.createPage({ + path: `/speakers/${node.id}`, + component: require.resolve(`./src/templates/speaker.js`), + context: { speakerID: node.id }, + }); }); - }); }; diff --git a/package.json b/package.json index e7ebec9..bb5935b 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "version": "0.1.0", "author": "Kyle Mathews ", "dependencies": { + "bootstrap": "^4.6.0", "gatsby": "^2.32.8", "gatsby-image": "^2.11.0", "gatsby-plugin-gatsby-cloud": "^1.0.2", @@ -18,6 +19,7 @@ "gatsby-transformer-sharp": "^2.12.0", "prop-types": "^15.7.2", "react": "^16.12.0", + "react-bootstrap": "^1.5.1", "react-dom": "^16.12.0", "react-helmet": "^6.1.0" }, diff --git a/src/components/header.js b/src/components/header.js index 314affc..6aa645d 100644 --- a/src/components/header.js +++ b/src/components/header.js @@ -1,42 +1,45 @@ -import { Link } from 'gatsby'; -import PropTypes from 'prop-types'; +// import { Link } from 'gatsby'; import React from 'react'; +import PropTypes from 'prop-types'; +import { injectIntl, Link } from 'gatsby-plugin-intl'; +import Language from './language'; const Header = ({ siteTitle }) => ( -
-
-

- - {siteTitle} - -

-
-
+

+ + {siteTitle} + +

+ + + ); Header.propTypes = { - siteTitle: PropTypes.string, + siteTitle: PropTypes.string, }; Header.defaultProps = { - siteTitle: ``, + siteTitle: ``, }; export default Header; diff --git a/src/components/language.js b/src/components/language.js new file mode 100644 index 0000000..dac4917 --- /dev/null +++ b/src/components/language.js @@ -0,0 +1,43 @@ +import React from 'react'; +import { IntlContextConsumer, changeLocale } from 'gatsby-plugin-intl'; + +const languageName = { + es: 'Español', + en: 'English', +}; + +const Language = () => { + const languageClick = (e, language) => { + e.preventDefault(); + changeLocale(language); + }; + + return ( +
+ + {({ languages, language: currentLocale }) => + languages.map((language) => ( + languageClick(e, language)} + style={{ + color: + currentLocale === language + ? `yellow` + : `white`, + margin: 10, + textDecoration: `underline`, + cursor: `pointer`, + }} + href="/" + > + {languageName[language]} + + )) + } + +
+ ); +}; + +export default Language; diff --git a/src/components/layout.js b/src/components/layout.js index 2a3683e..98c9ec0 100644 --- a/src/components/layout.js +++ b/src/components/layout.js @@ -13,43 +13,43 @@ import Header from './header'; import './layout.css'; const Layout = ({ children }) => { - const data = useStaticQuery(graphql` - query SiteTitleQuery { - site { - siteMetadata { - title + const data = useStaticQuery(graphql` + query SiteTitleQuery { + site { + siteMetadata { + title + } + } } - } - } - `); + `); - return ( - <> -
-
-
{children}
-
- © {new Date().getFullYear()}, Built with - {` `} - Gatsby -
-
- - ); + return ( + <> +
+
+
{children}
+
+ © {new Date().getFullYear()}, Built with + {` `} + Gatsby +
+
+ + ); }; Layout.propTypes = { - children: PropTypes.node.isRequired, + children: PropTypes.node.isRequired, }; export default Layout; diff --git a/src/data/speakers.json b/src/data/speakers.json index c16cf69..ca01cab 100644 --- a/src/data/speakers.json +++ b/src/data/speakers.json @@ -4,13 +4,32 @@ "name": "Thermaltake CA-1D4-00S1NN-00 Versa H15 mATX Case", "description": "Thermaltake new Versa H15 micro case is ideal for home-computer builders and gamers, creating enough space for high-end hardware and expansion. The ample ventilation options, cleanable air filter, and a perforated mesh bezel help to keep the entire system cool and dust-free. Versa H15 combines a manageable frame size with extensive options to customize user s computer or gaming system.", "image": "https://s.yimg.com/aah/outletpc/thermaltake-ca-1d4-00s1nn-00-versa-h15-matx-case-162.jpg", - "price": "61.88" + "price": "61.88", + "node_locale" : "en" + }, + { + "id": "3", + "name": "Thermaltake CA-1D4-00S1NN-00 Versa H15 mATX Case", + "description": "Thermaltake new Versa H15 micro case is ideal for home-computer builders and gamers, creating enough space for high-end hardware and expansion. The ample ventilation options, cleanable air filter, and a perforated mesh bezel help to keep the entire system cool and dust-free. Versa H15 combines a manageable frame size with extensive options to customize user s computer or gaming system.", + "image": "https://s.yimg.com/aah/outletpc/thermaltake-ca-1d4-00s1nn-00-versa-h15-matx-case-162.jpg", + "price": "61.88", + "node_locale" : "es" }, { "id": "2", "name": "Western Digital WD10EZEX 1TB Blue 7200RPM SATA 6.0Gb/s 3.5inch Hard Drive", "description": "Western Digital 1TB WD10EZEX Caviar Blue 3.5 inch 7200rpm internal hard drive. With this drive you get the capacity and the performance you demand to build a high speed, high capacity modern desktop computer. The WD Blue 1tb gives your system the storage it needs and the speed you want - with 1 terabyte of capacity to store all your files, videos, and pictures. Features 64MB cache and a 3.5 inch form factor. This 1 TB SATA HDD has the room you need to store gigabytes upon gigabytes of high definition media, and the read and write speeds to easily access and manage it all.", "image": "https://s.yimg.com/aah/outletpc/western-digital-wd10ezex-1tb-sata-iii-3-5-desktop-hard-drive-58.jpg", - "price": "43.99" + "price": "43.99", + "node_locale" : "en" + }, + + { + "id": "4", + "name": "Western Digital WD10EZEX 1TB Blue 7200RPM SATA 6.0Gb/s 3.5inch Hard Drive", + "description": "Western Digital 1TB WD10EZEX Caviar Blue 3.5 inch 7200rpm internal hard drive. With this drive you get the capacity and the performance you demand to build a high speed, high capacity modern desktop computer. The WD Blue 1tb gives your system the storage it needs and the speed you want - with 1 terabyte of capacity to store all your files, videos, and pictures. Features 64MB cache and a 3.5 inch form factor. This 1 TB SATA HDD has the room you need to store gigabytes upon gigabytes of high definition media, and the read and write speeds to easily access and manage it all.", + "image": "https://s.yimg.com/aah/outletpc/western-digital-wd10ezex-1tb-sata-iii-3-5-desktop-hard-drive-58.jpg", + "price": "43.99", + "node_locale" : "es" } ] \ No newline at end of file diff --git a/src/pages/index.js b/src/pages/index.js index 2dac793..a457d71 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -1,28 +1,51 @@ import React from 'react'; -import { Link } from 'gatsby'; +import { Link, graphql } from 'gatsby'; import { useIntl } from 'gatsby-plugin-intl'; +import Proptypes from 'prop-types'; -const IndexPage = () => { - const intl = useIntl(); +import Layout from '../components/layout'; +const IndexPage = ({ data }) => { + const intl = useIntl(); + const speakers = data.allSpeakersJson.nodes; + // console.log(speakers); + return ( + +
    +
      +
    • + En +
      • +
    • + Es +
      • +
    • + Speakers +
      • +
    +
+

{intl.formatMessage({ id: 'index.title' })}

+ + ); +}; - return ( - <> -
    -
      -
    • - En -
      • -
    • - Es -
      • -
    • - Speakers -
      • -
    -
-

{intl.formatMessage({ id: 'index.title' })}

- - ); +IndexPage.propTypes = { + data: Proptypes.object, }; +export const query = graphql` + query SpeakersPosts($locale: String, $defaultLocale: String) { + allSpeakersJson( + filter: { + node_locale: { eq: $locale } + or: { node_locale: { eq: $defaultLocale } } + } + ) { + nodes { + id + name + node_locale + } + } + } +`; export default IndexPage; diff --git a/src/pages/speakers.js b/src/pages/speakers.js index 4818e5c..5dd094b 100644 --- a/src/pages/speakers.js +++ b/src/pages/speakers.js @@ -3,33 +3,33 @@ import Proptypes from 'prop-types'; import { graphql, Link } from 'gatsby'; export const query = graphql` - query { - allSpeakersJson { - nodes { - id - name - } + query { + allSpeakersJson { + nodes { + id + name + } + } } - } `; const SpeakersPage = ({ data }) => { - const speakers = data.allSpeakersJson.nodes; - return ( -
-

Speakers

-
    - {speakers.map(({ id, name }) => ( -
  • - {name} -
    • - ))} -
-
- ); + const speakers = data.allSpeakersJson.nodes; + return ( +
+

Speakers

+
    + {speakers.map(({ id, name }) => ( +
  • + {name} +
    • + ))} +
+
+ ); }; SpeakersPage.propTypes = { - data: Proptypes.object, + data: Proptypes.object, }; export default SpeakersPage; diff --git a/src/templates/speaker.js b/src/templates/speaker.js index cc21844..d4e24df 100644 --- a/src/templates/speaker.js +++ b/src/templates/speaker.js @@ -3,29 +3,30 @@ import Proptypes from 'prop-types'; import { graphql } from 'gatsby'; export const query = graphql` - query($speakerID: String!) { - speakersJson(id: { eq: $speakerID }) { - description - id - image - name - price + query($speakerID: String!, $locale: String) { + speakersJson(id: { eq: $speakerID }, node_locale: { eq: $locale }) { + description + id + image + name + price + } } - } `; const Speaker = ({ data }) => { - const { speakersJson } = data; + const { speakersJson } = data; - return ( -
- {console.log(data)} 
{JSON.stringify(speakersJson, null, 2)}
-
- ); + return ( +
+ {console.log(data)}{' '} + 
{JSON.stringify(speakersJson, null, 2)}
+
+ ); }; Speaker.propTypes = { - data: Proptypes.object, + data: Proptypes.object, }; export default Speaker; From b773e5ee781a78eb92ae86308b7385eb3bd08b30 Mon Sep 17 00:00:00 2001 From: GermanGrandas Date: Mon, 8 Mar 2021 09:03:01 -0500 Subject: [PATCH 2/2] Body background, nav bar completed --- assets/favicon.ico | Bin 0 -> 1150 bytes gatsby-node.js | 58 ++--- package.json | 1 + src/components/SiteBar.js | 15 +- src/components/language.js | 5 +- src/components/layout.css | 19 ++ src/images/anniversary.svg | 1 + src/images/asteroids.png | Bin 0 -> 46917 bytes src/images/asteroids.svg | 1 + src/images/asteroids.webp | Bin 0 -> 13794 bytes src/images/background-intro-complete.png | Bin 0 -> 235002 bytes src/images/background-intro-complete.svg | 1 + src/images/background-intro-complete.webp | Bin 0 -> 23334 bytes src/images/background-intro.png | Bin 0 -> 148257 bytes src/images/background-intro.svg | 1 + src/images/background.jpg | Bin 0 -> 95029 bytes src/images/background.svg | 248 ++++++++++++++++++++++ src/images/background.webp | Bin 0 -> 16760 bytes src/images/empty-photo.svg | 35 +++ src/images/gatsby-astronaut.png | Bin 167273 -> 0 bytes src/images/gatsby-icon.png | Bin 21212 -> 0 bytes src/images/icon.svg | 79 +++++++ src/images/logo.png | Bin 0 -> 10574 bytes src/images/logo.svg | 1 + src/images/logo.webp | Bin 0 -> 5016 bytes src/images/logo_reverse.svg | 103 +++++++++ src/images/logo_reverse.webp | Bin 0 -> 26398 bytes src/images/opimage.jpg | Bin 0 -> 47926 bytes src/images/planet-0.svg | 1 + src/images/planet-1.svg | 1 + src/images/planet-2.svg | 1 + src/images/planet-3.svg | 1 + src/images/planet-orange.png | Bin 0 -> 37378 bytes src/images/planet-orange.svg | 1 + src/images/planet-pink.png | Bin 0 -> 28909 bytes src/images/planet-pink.svg | 1 + src/images/planet-pink.webp | Bin 0 -> 4562 bytes src/images/resources/facebook-group.jpg | Bin 0 -> 294117 bytes src/images/resources/facebook-page.jpg | Bin 0 -> 222097 bytes src/images/resources/facebook-profile.jpg | Bin 0 -> 207105 bytes src/images/resources/linkedin-page.jpg | Bin 0 -> 142183 bytes src/images/resources/linkedin-profile.jpg | Bin 0 -> 157485 bytes src/images/resources/profile.jpg | Bin 0 -> 326850 bytes src/images/resources/twitter.jpg | Bin 0 -> 211427 bytes src/images/timeline-item-0.svg | 1 + src/images/timeline-item-1.svg | 1 + src/images/timeline-item-2.svg | 1 + src/images/timeline-item-3.svg | 1 + src/images/title.png | Bin 0 -> 301730 bytes src/images/title.svg | 1 + src/images/title.webp | Bin 0 -> 15888 bytes src/images/whale.png | Bin 0 -> 154042 bytes src/images/whale.svg | 1 + src/images/whale.webp | Bin 0 -> 28140 bytes src/pages/index.js | 26 +-- 55 files changed, 555 insertions(+), 51 deletions(-) create mode 100644 assets/favicon.ico create mode 100644 src/images/anniversary.svg create mode 100644 src/images/asteroids.png create mode 100644 src/images/asteroids.svg create mode 100644 src/images/asteroids.webp create mode 100644 src/images/background-intro-complete.png create mode 100644 src/images/background-intro-complete.svg create mode 100644 src/images/background-intro-complete.webp create mode 100644 src/images/background-intro.png create mode 100644 src/images/background-intro.svg create mode 100644 src/images/background.jpg create mode 100644 src/images/background.svg create mode 100644 src/images/background.webp create mode 100644 src/images/empty-photo.svg delete mode 100644 src/images/gatsby-astronaut.png delete mode 100644 src/images/gatsby-icon.png create mode 100644 src/images/icon.svg create mode 100644 src/images/logo.png create mode 100644 src/images/logo.svg create mode 100644 src/images/logo.webp create mode 100644 src/images/logo_reverse.svg create mode 100644 src/images/logo_reverse.webp create mode 100644 src/images/opimage.jpg create mode 100644 src/images/planet-0.svg create mode 100644 src/images/planet-1.svg create mode 100644 src/images/planet-2.svg create mode 100644 src/images/planet-3.svg create mode 100644 src/images/planet-orange.png create mode 100644 src/images/planet-orange.svg create mode 100644 src/images/planet-pink.png create mode 100644 src/images/planet-pink.svg create mode 100644 src/images/planet-pink.webp create mode 100644 src/images/resources/facebook-group.jpg create mode 100644 src/images/resources/facebook-page.jpg create mode 100644 src/images/resources/facebook-profile.jpg create mode 100644 src/images/resources/linkedin-page.jpg create mode 100644 src/images/resources/linkedin-profile.jpg create mode 100644 src/images/resources/profile.jpg create mode 100644 src/images/resources/twitter.jpg create mode 100644 src/images/timeline-item-0.svg create mode 100644 src/images/timeline-item-1.svg create mode 100644 src/images/timeline-item-2.svg create mode 100644 src/images/timeline-item-3.svg create mode 100644 src/images/title.png create mode 100644 src/images/title.svg create mode 100644 src/images/title.webp create mode 100644 src/images/whale.png create mode 100644 src/images/whale.svg create mode 100644 src/images/whale.webp diff --git a/assets/favicon.ico b/assets/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..7c1f0b101d9807948bb5d098afe7c7f91d3a69b3 GIT binary patch literal 1150 zcmY+EYe-a45XWa9q#{1c(ClFl5xp&o^n+^_`5~!3BtZoB5EKguR76cnF!h62V5X_1 zyI_eCu~I}Yb=9O=G7?-N&CE5-Cz{Xo?(S*+*S%tQ`Q3Z&ocYh0nRD(EsrcvXOMDNZ zBrVZ;BHF>Qi7m@^eh~4TzvnXY`>I>EHi8&66U2lw$Czjr7{i7+_^c=~W;D!RM#mgs zHZbn#s!(-?It>2qE*s_!Fm4QV3Tt_6Vp3pBQSYQ!^4H|}MEYcS9`+3560T}?EBS3_ zp9p4k46MJO2{4>ar>F6G+qxRwRa!rFoBQ6I+gl3tS@#ZI^s3Y)DeEBy@=&c5!h`bg z1QJ4!xyqPpo0;dK5Od>GqQB+K?2GFqQEzTkD0r9q=Pm5ECE>I? z#M0b?jBR#aOb?ApZN+s7*3aG0doahDql||0P+5$oTBpM)#(M|F@V8!mT4gw2L^(u~iRWXc+7(aOqnO@B#A^(_&_1Qp}D{iqW0{G4_3s?M~=xQL{^rwUL9z#E&6r zzw;z%`uCV5E!cztG}59?Sj`skcX-_K;ck8M!qg1($N{yZ2f+owC#f_d-mAHw=3GZ< z!$aNf8q#*_QVlB=j_Ch|F%>}jeD!nx3S4Y?49M^yg zJv3Jvb9qSm*i=QT=#dA`0?q{0oy{b}skFe4<n zfC**LKfD8+MVv{*P-kin(goEf%}t*u?>xU~-+0yLH4n5WC~MglXWYc#%qw~&2J-mt z`$?sJ>TFH;>hC9#efBW&`bsgbSm*)zfu3Stqg`MO8|LIbDY^kSqFcQC#aoGr0*Mxx b0sfx|VU!Ew5cUh)!uS#8hZ42$mjmrT6u+T~ literal 0 HcmV?d00001 diff --git a/gatsby-node.js b/gatsby-node.js index a296fff..6fd9940 100644 --- a/gatsby-node.js +++ b/gatsby-node.js @@ -4,39 +4,39 @@ * See: https://www.gatsbyjs.com/docs/node-apis/ */ exports.onCreatePage = ({ page, actions }) => { - const { createPage, deletePage } = actions; - deletePage(page); - // You can access the variable "locale" in your page queries now - createPage({ - ...page, - context: { - ...page.context, - locale: page.context.intl.language, - defaultLocale: page.context.intl.defaultLanguage, - }, - }); + const { createPage, deletePage } = actions; + deletePage(page); + // You can access the variable "locale" in your page queries now + createPage({ + ...page, + context: { + ...page.context, + locale: page.context.intl.language, + defaultLocale: page.context.intl.defaultLanguage, + }, + }); }; exports.createPages = async function ({ actions, graphql }) { - const { data } = await graphql(` - query { - allSpeakersJson { - nodes { - description - id - image - name - price - } - } + const { data } = await graphql(` + query { + allSpeakersJson { + nodes { + description + id + image + name + price } - `); + } + } + `); - data.allSpeakersJson.nodes.forEach((node) => { - actions.createPage({ - path: `/speakers/${node.id}`, - component: require.resolve(`./src/templates/speaker.js`), - context: { speakerID: node.id }, - }); + data.allSpeakersJson.nodes.forEach((node) => { + actions.createPage({ + path: `/speakers/${node.id}`, + component: require.resolve(`./src/templates/speaker.js`), + context: { speakerID: node.id }, }); + }); }; diff --git a/package.json b/package.json index 9b365af..ecfd1e1 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "dependencies": { "bootstrap": "^4.6.0", "gatsby": "^2.32.8", + "gatsby-background-image": "^1.4.1", "gatsby-image": "^3.0.0", "gatsby-plugin-gatsby-cloud": "^1.0.2", "gatsby-plugin-intl": "^0.3.3", diff --git a/src/components/SiteBar.js b/src/components/SiteBar.js index f2aa534..46825af 100644 --- a/src/components/SiteBar.js +++ b/src/components/SiteBar.js @@ -12,7 +12,7 @@ const SiteBar = ({ intl }) => { collapseOnSelect className="navbar" expand="lg" - bg="light" + // bg="light" variant="light" fixed="top" > @@ -22,32 +22,33 @@ const SiteBar = ({ intl }) => {