styles import to gatsby-browser

gatsby-browser.js

@@ -1,7 +1,16 @@
 import React from "react"
 import './src/styles/global.scss'
+import './src/components/Header/Header.scss'
+import './src/components/About/About.scss'
+import './src/components/Offers/Offers.scss'
+import './src/components/Articles/Articles.scss'
 import './src/components/Articles/ArticleCard/ArticleCard.scss'
 import './src/components/Newsletter/Newsletter.scss'
+import './src/components/Article/Article.scss'
+import './src/components/Articles/MoreArticles/MoreArticles.scss'
+import './src/components/Books/Books.scss'
+import './src/components/Contacts/Contacts.scss'
+import './src/components/Footer/Footer.scss'
 
 import 'prismjs/themes/prism-tomorrow.css'
 import 'prismjs/plugins/line-numbers/prism-line-numbers.css'

src/components/About/About.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types'
 import { Link } from 'gatsby'
-import './About.scss'
 
 import ContactsIcon from '../../images/contacts-icon.svg'
 

src/components/Article/Article.js

@@ -5,7 +5,6 @@ import Img from "gatsby-image"
 import useSiteMetadataQuery from '../../hooks/useSiteMetadataQuery'
 import slugify from '../../helpers/slugify'
 import { Link } from 'gatsby'
-import './Article.scss'
 
 import ViewsIcon from '../../images/views-icon.svg'
 import VkIcon from '../../images/vk-icon.svg'

src/components/Articles/Articles.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types'
 import ArticleCard from './ArticleCard/ArticleCard'
-import './Articles.scss'
 
 const Articles = ({ data: { edges } }) => {
   return (

src/components/Articles/MoreArticles/MoreArticles.js

@@ -2,7 +2,6 @@ import React from 'react';
 import { useLocation } from '@reach/router'
 import useMoreArticlesQuery from '../../../hooks/useMoreArticlesQuery'
 import ArticleCard from '../ArticleCard/ArticleCard'
-import './MoreArticles.scss'
 
 const MoreArticles = () => {
   const { edges } = useMoreArticlesQuery()

src/components/Books/Books.js

@@ -2,7 +2,6 @@ import React from 'react';
 import PropTypes from 'prop-types'
 import slugify from '../../helpers/slugify'
 import Img from "gatsby-image"
-import './Books.scss'
 
 const Books = ({ data: { edges } }) => {
   return (

src/components/Contacts/Contacts.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types'
 import ContactsFrom from './ContactsForm/ContactsForm';
-import './Contacts.scss'
 
 import MemoIcon from '../../images/memo-icon.svg'
 

src/components/Footer/Footer.js

@@ -2,7 +2,6 @@ import React from 'react';
 import { Link } from 'gatsby'
 import PropTypes from 'prop-types'
 import useSiteMetadataQuery from '../../hooks/useSiteMetadataQuery'
-import './Footer.scss'
 
 import GitHubButton from 'react-github-btn'
 import LogoIcon from '../../images/logo-icon.svg'

src/components/Header/Header.js

@@ -4,7 +4,6 @@ import PropTypes from 'prop-types'
 import { Link } from 'gatsby'
 import useSiteMetadataQuery from '../../hooks/useSiteMetadataQuery'
 import ThemeContext from '../../context/ThemeContext'
-import './Header.scss'
 
 import LogoIcon from '../../images/logo-icon.svg'
 import TelegramIcon from '../../images/telegram-icon.svg'

src/components/Offers/Offers.js

@@ -2,7 +2,6 @@ import React from 'react';
 import usePopularArticlesQuery from '../../hooks/usePopularArticlesQuery'
 import useTagsQuery from '../../hooks/useTagsQuery'
 import useBooksQuery from '../../hooks/useBooksQuery'
-import './Offers.scss'
 import Popular from './Popular/Popular'
 import Tags from './Tags/Tags'
 import Books from './Books/Books'