Я бы хотел настроить эту тему gatsby https://github.com/NK-WebDev/gatsby-theme-teranova ( live demo ). Структура исходного кода темы и демо выглядит обобщенно c для тем gatsby.
Структура исходного кода демо выглядит следующим образом:
demo
src/pages
index.mdx
static/images
banner.png
favicon.png
logo.svg
gatsby-config.js
package.json
Структура исходный код темы выглядит следующим образом:
gatsby-theme-teranova
data
content
services
branding.mdx
logo-design.mdx
marketing.mdx
web-design.mdx
about.jpg
about.mdx
banner.jpg
intro.mdx
index.js
src
components
about.js
contact.js
service.js
services.js
...
pages
index.mdx
theme.js
static/images
banner.png
favicon.png
logo.svg
gatsby-config.js
index.js
package.json
Я думал, что текстовое содержимое веб-страницы темы определено в файлах * .mdx (здесь: gatsby-theme-teranova/data/content/about.mdx, gatsby-theme-teranova/data/content/contact.mdx, et c.) и отображается с соответствующими *. js файлами темы (здесь: gatsby-theme-teranova/src/components/about.js, gatsby-theme-teranova/src/components/contact.js, et c.). В демоверсии просто demo/src/pages/index.mdx. Означает, что содержимое встроенной темы не изменено в демоверсии. Я ожидал, что размещение пользовательского текстового содержимого в demo/data/content/about.mdx, et c. будет тень на соответствующий контент веб-страницы. Но при работе gatsby develop это не так. Это просто игнорируется. Как правильно выполнять затенение текста веб-страницы?
Кстати: мне не ясно, правильно ли затенение в демоверсии. До тех пор, пока banner.png, favicon.png и lo go .svg демо-версии не отличаются от файлов темы, их не нужно будет явно включать в демо-источник.