diff --git a/gatsby-config.js b/gatsby-config.js index f63b21d..591f3fa 100644 --- a/gatsby-config.js +++ b/gatsby-config.js @@ -7,6 +7,9 @@ module.exports = { siteMetadata: { title: 'devthread.ru', + titleTemplate: '%s · статьи и руководства по веб-разработке', + description: 'сборник статей и руководств по тематике веб-разработки и IT для того чтобы помочь вам', + url: 'https://devthread.ru', menuLinks: [ { name: 'Статьи', diff --git a/package-lock.json b/package-lock.json index 518e5cf..12dd9db 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12321,6 +12321,22 @@ "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-3.0.0.tgz", "integrity": "sha512-XzgvowFrwDo6TWcpJ/WTiarb9UI6lhA4PMzS7n1joK3sHfBBBOQHUc0U4u57D6DWO9vHv6lVSWx2Q/Ymfyv4hw==" }, + "react-fast-compare": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz", + "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==" + }, + "react-helmet": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-6.1.0.tgz", + "integrity": "sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==", + "requires": { + "object-assign": "^4.1.1", + "prop-types": "^15.7.2", + "react-fast-compare": "^3.1.1", + "react-side-effect": "^2.1.0" + } + }, "react-hot-loader": { "version": "4.12.21", "resolved": "https://registry.npmjs.org/react-hot-loader/-/react-hot-loader-4.12.21.tgz", @@ -12380,6 +12396,11 @@ "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.7.2.tgz", "integrity": "sha512-u5l7fhAJXecWUJzVxzMRU2Zvw8m4QmDNHlTrT5uo3KBlYBhmChd7syAakBoay1yIiVhx/8Fi7a6v6kQZfsw81Q==" }, + "react-side-effect": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.0.tgz", + "integrity": "sha512-IgmcegOSi5SNX+2Snh1vqmF0Vg/CbkycU9XZbOHJlZ6kMzTmi3yc254oB1WCkgA7OQtIAoLmcSFuHTc/tlcqXg==" + }, "read": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz", diff --git a/package.json b/package.json index 348a85f..638b09b 100644 --- a/package.json +++ b/package.json @@ -15,13 +15,16 @@ "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1" }, "dependencies": { + "@reach/router": "^1.3.4", "gatsby": "^2.23.12", "gatsby-plugin-react-svg": "^3.0.0", "gatsby-plugin-sass": "^2.3.7", "gatsby-source-filesystem": "^2.3.14", "node-sass": "^4.14.1", + "prop-types": "^15.7.2", "react": "^16.12.0", - "react-dom": "^16.12.0" + "react-dom": "^16.12.0", + "react-helmet": "^6.1.0" }, "devDependencies": { "prettier": "2.0.5" diff --git a/src/components/About/About.js b/src/components/About/About.js new file mode 100644 index 0000000..4d20776 --- /dev/null +++ b/src/components/About/About.js @@ -0,0 +1,41 @@ +import React from 'react'; +import { Link } from 'gatsby' +import './About.scss' + +import ContactsIcon from '../../images/contacts-icon.svg' + +const About = ({ title, pageTitle }) => { + return ( +
+
+

{pageTitle}

+
+
+
+

{title}

+

публикуем статьи о мире веб-разрабоки и IT

+

+ этот сайт придуман для того, чтобы помочь вам разобраться с вашей проблемой и решить её. Сайт содержит + в себе статьи и руководства. +

+

+ ~ к тому же здесь публикуются различные новости которые произошли за последнее время +

+
+
+
+ + контакты +
+ +
+
+
+ ) +} + +export default About \ No newline at end of file diff --git a/src/components/About/About.scss b/src/components/About/About.scss new file mode 100644 index 0000000..10afc1b --- /dev/null +++ b/src/components/About/About.scss @@ -0,0 +1,106 @@ +@import '../../styles/variables.scss'; + +.about { + & .about-heading { + margin-bottom: 45px; + } + & .about-content { + &__info { + & span { + display: block; + margin-bottom: 15px; + } + & h2 { + font-size: 28px; + margin-bottom: 10px; + } + & h3 { + max-width: 720px; + font-size: 48px; + margin-bottom: 20px; + } + & p { + font-size: 18px; + font-weight: 500; + margin-bottom: 35px; + } + } + &__contacts { + & .contacts-heading { + display: flex; + align-items: center; + & svg { + position: relative; + top: 1px; + } + & span { + margin-left: 14px; + font-weight: 700; + font-size: 24px; + } + } + & ul { + margin-top: 15px; + padding-left: 38px; + & li { + margin-bottom: 10px; + } + } + } + } +} + +.dark { + & .about { + color: $white-clr; + } +} + +@media (max-width: 768px) { + .about { + & .about-content { + & h2 { + font-size: 24px; + } + & h3 { + font-size: 42px; + } + & p { + font-size: 16px; + } + } + } +} + +@media (max-width: 576px) { + .about { + & .about-content { + & h2 { + font-size: 21px; + } + & h3 { + font-size: 36px; + } + &__contacts { + & .contacts-heading { + & span { + font-size: 21px; + } + } + } + } + } +} + +@media (max-width: 500px) { + .about { + & .about-content { + & h2 { + font-size: 18px; + } + & h3 { + font-size: 30px; + } + } + } +} \ No newline at end of file diff --git a/src/components/Layout/Layout.js b/src/components/Layout/Layout.js index 3055e13..507fbd0 100644 --- a/src/components/Layout/Layout.js +++ b/src/components/Layout/Layout.js @@ -9,7 +9,7 @@ const Layout = ({ children }) => { return ( <>
- {children} + {children}