diff --git a/Makefile b/Makefile index 27e5208f..40d37372 100644 --- a/Makefile +++ b/Makefile @@ -15,3 +15,6 @@ deploy-dev-from-local: update: npm run fetch-data + +build-size: + npm run size diff --git a/components/admin/AdminLayout.js b/components/admin/AdminLayout.js index 9b9766a4..445bb24c 100644 --- a/components/admin/AdminLayout.js +++ b/components/admin/AdminLayout.js @@ -1,17 +1,19 @@ -import './admin.scss'; - import React from 'react'; import PropTypes from 'prop-types'; +import block from 'bem-css-modules'; +import styles from './admin.module.scss'; import AdminSidebar from './AdminSidebar'; +const b = block(styles); + const AdminLayout = ({ children }) => ( -
-
-
+
+
+
-
{children}
+
{children}
); diff --git a/components/admin/AdminSidebar.js b/components/admin/AdminSidebar.js index e59bc781..f9e43254 100644 --- a/components/admin/AdminSidebar.js +++ b/components/admin/AdminSidebar.js @@ -1,7 +1,6 @@ -import './admin-sidebar.scss'; - import React from 'react'; import { useRouter } from 'next/router'; +import block from 'bem-css-modules'; import Link from 'components/common/Link'; import Text from 'components/common/Text'; @@ -10,14 +9,16 @@ import Dispatcher from 'lib/components/Dispatcher'; import { authActions } from 'redux/ducks/auth'; import { ADMIN_ROUTES, ROUTES_NAMES } from 'routes'; +import styles from './admin-sidebar.module.scss'; +const b = block(styles); const IGNORE_ROUTES = ['login', 'preview'].map(page => ROUTES_NAMES.admin[page]); const AdminSidebar = () => { const router = useRouter(); return ( -
-
    +
    +
      {ADMIN_ROUTES.filter(({ name }) => !IGNORE_ROUTES.includes(name)).map(({ name, page }) => (
    • {/* FIXME: active */} diff --git a/components/admin/admin-sidebar.scss b/components/admin/admin-sidebar.module.scss similarity index 84% rename from components/admin/admin-sidebar.scss rename to components/admin/admin-sidebar.module.scss index 96862716..e382505e 100644 --- a/components/admin/admin-sidebar.scss +++ b/components/admin/admin-sidebar.module.scss @@ -1,5 +1,5 @@ .admin-sidebar { - &-nav-list { + &__nav-list { list-style-type: none; margin: 0 0 30px; padding: 0; diff --git a/components/admin/admin.scss b/components/admin/admin.module.scss similarity index 82% rename from components/admin/admin.scss rename to components/admin/admin.module.scss index 8ed890d5..e15297c0 100644 --- a/components/admin/admin.scss +++ b/components/admin/admin.module.scss @@ -1,16 +1,16 @@ .admin-panel { padding: 0 90px 60px; - &-grid { + &__grid { display: flex; - &__aside { + &-aside { flex: 0 0 auto; padding-right: 20px; width: 100px; } - &__main { + &-main { flex: 1 1 auto; font-size: 0.9rem; } diff --git a/components/articles/Article.js b/components/articles/Article.js index 00c669b7..dcf33a18 100644 --- a/components/articles/Article.js +++ b/components/articles/Article.js @@ -1,8 +1,10 @@ -import 'styles/pages/article.scss'; +import styles from 'styles/pages/article.module.scss'; import React from 'react'; import { useRouter } from 'next/router'; import flatten from 'lodash/flatten'; +import cn from 'classnames'; +import block from 'bem-css-modules'; import { MetaTitle, @@ -25,6 +27,7 @@ import host from 'utils/host'; import CollectionNote from './CollectionNote'; +const b = block(styles); const COVER_SIZES = [1200, 1000, 770, 640, 360]; const Article = ({ @@ -44,7 +47,7 @@ const Article = ({ }) => { const router = useRouter(); const { brands, authors, ...tagsObject } = tagsByTopic; - const renderTagImage = getTagImageRenderer({ className: 'article-page__tag-image' }); + const renderTagImage = getTagImageRenderer({ className: styles['article-page__tag-image'] }); const imageUrl = images.page || images.horizontal; // https://caniuse.com/#feat=array-flat const tags = flatten(Object.values(tagsObject)); @@ -58,31 +61,31 @@ const Article = ({ -
      -
      -
      {subtitle}
      +
      +
      +
      {subtitle}
      {type === 'text' && ( {title} )}
      -
      +
      {/* TODO: hover corresponding image and title simultaneously */} {(!!brands.length || !!authors.length) && ( -
      +
      {brands.concat(authors).map(tag => getTagLink({ - className: 'article-page__tag-image-link', + className: b('tag-image-link'), render: renderTagImage, tag, }) )} -
      +
      {renderNodeList(brands.map(tag => getTagLink({ tag })))} {!!brands.length && !!authors.length && ','} @@ -91,22 +94,22 @@ const Article = ({
      )} -
      {title}
      +
      {title}
      -
      +
      {type === 'audio' && } {type === 'video' && } {collection && collection.articles.length > 1 && } {fiberyRenderer(text.content)}
      -
      +
      -
      +
      {tags.map(tag => ( -
      +
      {getTagLink({ tag })}
      ))} diff --git a/components/articles/CollectionNote.js b/components/articles/CollectionNote.js index 7aa453ab..21d94db2 100644 --- a/components/articles/CollectionNote.js +++ b/components/articles/CollectionNote.js @@ -1,5 +1,8 @@ +import styles from 'styles/pages/article.module.scss'; + import React from 'react'; import PropTypes from 'prop-types'; +import block from 'bem-css-modules'; import Text from 'components/common/Text'; import Link from 'components/common/Link'; @@ -9,8 +12,10 @@ import { CollectionShape } from 'utils/customPropTypes'; import { ROUTES_NAMES } from 'routes'; -const CollectionNoteItem = ({ hideLink, text, slug }) => ( -
      +const b = block(styles); + +const CollectionNoteItem = ({ className, hideLink, text, slug }) => ( +
      {hideLink ? ( text ) : ( @@ -22,31 +27,33 @@ const CollectionNoteItem = ({ hideLink, text, slug }) => ( ); CollectionNoteItem.propTypes = { + className: PropTypes.string.isRequired, hideLink: PropTypes.bool.isRequired, text: PropTypes.string.isRequired, slug: PropTypes.string.isRequired, }; const CollectionNote = ({ data: { cover, articleIndex = 0, name, articles } }) => ( -
      +
      {cover && ( {name} )} -
      -
      +
      +
      {` ${articleIndex + 1} `}
      - {name} + {name}
      {articles.map(({ _id, slug, title }, i) => ( { const { tagId, articlesIds } = block; const { tags, articles } = data; @@ -25,41 +27,33 @@ const ArticlesByTag2 = ({ block, data }) => { const topicLink = getTopicLink({ topic: topicSlug, dark: true }); return ( - -
      -
      + +
      +
      {isBrand && getTagImageRenderer({ theme: 'dark', - className: 'articles-by-tag-2__logo', + className: b('logo'), })(tag)} -
      +
      : {tagLink}
      -
      - {topicLink} -
      +
      {topicLink}
      -
      -
      +
      +
      -
      +
      -
      -
      - {topicLink} -
      +
      +
      {topicLink}
      ); diff --git a/components/articles/blocks/ArticlesByTag3.js b/components/articles/blocks/ArticlesByTag3.js index 6e163b85..d47c208e 100644 --- a/components/articles/blocks/ArticlesByTag3.js +++ b/components/articles/blocks/ArticlesByTag3.js @@ -1,4 +1,4 @@ -import './articlesByTag3.scss'; +import './articlesByTag3.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/blocks/BannerBlock.js b/components/articles/blocks/BannerBlock.js index 9689fd96..ecfff2d6 100644 --- a/components/articles/blocks/BannerBlock.js +++ b/components/articles/blocks/BannerBlock.js @@ -1,4 +1,4 @@ -import './banner.scss'; +import './banner.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/blocks/BlockWrapper.js b/components/articles/blocks/BlockWrapper.js index 8551c4df..189e99ff 100644 --- a/components/articles/blocks/BlockWrapper.js +++ b/components/articles/blocks/BlockWrapper.js @@ -1,4 +1,4 @@ -import './blockWrapper.scss'; +import './blockWrapper.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/blocks/DiaryBlock.js b/components/articles/blocks/DiaryBlock.js index 121dfa0e..78aef29c 100644 --- a/components/articles/blocks/DiaryBlock.js +++ b/components/articles/blocks/DiaryBlock.js @@ -1,4 +1,4 @@ -import './diary.scss'; +import './diary.module.scss'; import React, { useEffect } from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/blocks/TagPageBlockB.js b/components/articles/blocks/TagPageBlockB.js index dd4d398b..143ae319 100644 --- a/components/articles/blocks/TagPageBlockB.js +++ b/components/articles/blocks/TagPageBlockB.js @@ -1,4 +1,4 @@ -import './tagPageBlockB.scss'; +import './tagPageBlockB.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/blocks/TagPageBlockCD.js b/components/articles/blocks/TagPageBlockCD.js index 9f4778a1..23ea5508 100644 --- a/components/articles/blocks/TagPageBlockCD.js +++ b/components/articles/blocks/TagPageBlockCD.js @@ -1,4 +1,4 @@ -import './tagPageBlockCD.scss'; +import './tagPageBlockCD.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/blocks/TagsByTopic.js b/components/articles/blocks/TagsByTopic.js index aeb06a2b..7aa1865a 100644 --- a/components/articles/blocks/TagsByTopic.js +++ b/components/articles/blocks/TagsByTopic.js @@ -1,4 +1,4 @@ -import './tagsByTopic.scss'; +import './tagsByTopic.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/blocks/TwoArticlesInRow.js b/components/articles/blocks/TwoArticlesInRow.js index 48a49649..7b7d65f5 100644 --- a/components/articles/blocks/TwoArticlesInRow.js +++ b/components/articles/blocks/TwoArticlesInRow.js @@ -1,4 +1,4 @@ -import './twoInRow.scss'; +import './twoInRow.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/blocks/articlesByTag2.scss b/components/articles/blocks/articlesByTag2.module.scss similarity index 96% rename from components/articles/blocks/articlesByTag2.scss rename to components/articles/blocks/articlesByTag2.module.scss index 731748bd..c900b03b 100644 --- a/components/articles/blocks/articlesByTag2.scss +++ b/components/articles/blocks/articlesByTag2.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; .articles-by-tag-2 { display: flex; @@ -127,7 +127,7 @@ } // ALERT HACK. - &__card1 { + &__card-1 { margin: 20px 0; } diff --git a/components/articles/blocks/articlesByTag3.scss b/components/articles/blocks/articlesByTag3.module.scss similarity index 96% rename from components/articles/blocks/articlesByTag3.scss rename to components/articles/blocks/articlesByTag3.module.scss index fb894188..2c92115a 100644 --- a/components/articles/blocks/articlesByTag3.scss +++ b/components/articles/blocks/articlesByTag3.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; .articles-by-tag-3 { &__title { diff --git a/components/articles/blocks/banner.scss b/components/articles/blocks/banner.module.scss similarity index 93% rename from components/articles/blocks/banner.scss rename to components/articles/blocks/banner.module.scss index 25a3c069..087619aa 100644 --- a/components/articles/blocks/banner.scss +++ b/components/articles/blocks/banner.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; .banner { position: relative; diff --git a/components/articles/blocks/blockWrapper.scss b/components/articles/blocks/blockWrapper.module.scss similarity index 89% rename from components/articles/blocks/blockWrapper.scss rename to components/articles/blocks/blockWrapper.module.scss index 168fc293..4619555b 100644 --- a/components/articles/blocks/blockWrapper.scss +++ b/components/articles/blocks/blockWrapper.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; .block { &.wir-no-background { diff --git a/components/articles/blocks/diary.scss b/components/articles/blocks/diary.module.scss similarity index 97% rename from components/articles/blocks/diary.scss rename to components/articles/blocks/diary.module.scss index 642dad6d..fc198291 100644 --- a/components/articles/blocks/diary.scss +++ b/components/articles/blocks/diary.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; .diary { &__content { diff --git a/components/articles/blocks/tagPageBlockB.scss b/components/articles/blocks/tagPageBlockB.module.scss similarity index 95% rename from components/articles/blocks/tagPageBlockB.scss rename to components/articles/blocks/tagPageBlockB.module.scss index f8cc58bb..cb845bb7 100644 --- a/components/articles/blocks/tagPageBlockB.scss +++ b/components/articles/blocks/tagPageBlockB.module.scss @@ -1,4 +1,4 @@ -@import 'responsiveness'; +@import 'styles/responsiveness'; .tag-page-block-b { display: flex; diff --git a/components/articles/blocks/tagPageBlockCD.scss b/components/articles/blocks/tagPageBlockCD.module.scss similarity index 95% rename from components/articles/blocks/tagPageBlockCD.scss rename to components/articles/blocks/tagPageBlockCD.module.scss index aa2ebfec..44050130 100644 --- a/components/articles/blocks/tagPageBlockCD.scss +++ b/components/articles/blocks/tagPageBlockCD.module.scss @@ -1,4 +1,4 @@ -@import 'responsiveness'; +@import 'styles/responsiveness'; .tag-page-block-cd { display: flex; diff --git a/components/articles/blocks/tagsByTopic.scss b/components/articles/blocks/tagsByTopic.module.scss similarity index 96% rename from components/articles/blocks/tagsByTopic.scss rename to components/articles/blocks/tagsByTopic.module.scss index 9e87b4cf..a330e5fc 100644 --- a/components/articles/blocks/tagsByTopic.scss +++ b/components/articles/blocks/tagsByTopic.module.scss @@ -1,4 +1,4 @@ -@import 'responsiveness'; +@import 'styles/responsiveness'; .tags-by-topic { display: flex; diff --git a/components/articles/blocks/twoInRow.scss b/components/articles/blocks/twoInRow.module.scss similarity index 95% rename from components/articles/blocks/twoInRow.scss rename to components/articles/blocks/twoInRow.module.scss index 853efcd2..9395778a 100644 --- a/components/articles/blocks/twoInRow.scss +++ b/components/articles/blocks/twoInRow.module.scss @@ -1,4 +1,4 @@ -@import 'responsiveness'; +@import 'styles/responsiveness'; .two-in-row { display: flex; diff --git a/components/articles/cards/ArticleCard.js b/components/articles/cards/ArticleCard.js index c5af6364..45cb0803 100644 --- a/components/articles/cards/ArticleCard.js +++ b/components/articles/cards/ArticleCard.js @@ -1,4 +1,4 @@ -import './article.scss'; +import './article.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/cards/CardWrapper.js b/components/articles/cards/CardWrapper.js index 5c999fa3..d71e1c2d 100644 --- a/components/articles/cards/CardWrapper.js +++ b/components/articles/cards/CardWrapper.js @@ -1,4 +1,4 @@ -import './cardWrapper.scss'; +import './cardWrapper.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/cards/PlaceholderCard.js b/components/articles/cards/PlaceholderCard.js index c5971e71..7ebb7d6d 100644 --- a/components/articles/cards/PlaceholderCard.js +++ b/components/articles/cards/PlaceholderCard.js @@ -1,4 +1,4 @@ -import './placeholder.scss'; +import './placeholder.module.scss'; import React from 'react'; diff --git a/components/articles/cards/TagCard.js b/components/articles/cards/TagCard.js index 69e90e2f..a9d39f3a 100644 --- a/components/articles/cards/TagCard.js +++ b/components/articles/cards/TagCard.js @@ -1,6 +1,6 @@ -import './tagCard.scss'; -import './location.scss'; -import './person.scss'; +import './tagCard.module.scss'; +import './location.module.scss'; +import './person.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/articles/cards/article.scss b/components/articles/cards/article.module.scss similarity index 99% rename from components/articles/cards/article.scss rename to components/articles/cards/article.module.scss index 404cedc4..c1ab7cd9 100644 --- a/components/articles/cards/article.scss +++ b/components/articles/cards/article.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; @import './cards'; diff --git a/components/articles/cards/auto.js b/components/articles/cards/auto.js index 3492e52d..28bf7cac 100644 --- a/components/articles/cards/auto.js +++ b/components/articles/cards/auto.js @@ -1,4 +1,4 @@ -// This data must be in sync with article.scss file. +// This data must be in sync with article.module.scss file. // TODO: to generate SCSS rules based on this file. diff --git a/components/articles/cards/cardWrapper.scss b/components/articles/cards/cardWrapper.module.scss similarity index 92% rename from components/articles/cards/cardWrapper.scss rename to components/articles/cards/cardWrapper.module.scss index cee63742..2bffac02 100644 --- a/components/articles/cards/cardWrapper.scss +++ b/components/articles/cards/cardWrapper.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; @import './cards'; diff --git a/components/articles/cards/location.scss b/components/articles/cards/location.module.scss similarity index 97% rename from components/articles/cards/location.scss rename to components/articles/cards/location.module.scss index db7bf1b5..de301604 100644 --- a/components/articles/cards/location.scss +++ b/components/articles/cards/location.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; @import './cards'; diff --git a/components/articles/cards/person.scss b/components/articles/cards/person.module.scss similarity index 98% rename from components/articles/cards/person.scss rename to components/articles/cards/person.module.scss index a778d60c..9b73d659 100644 --- a/components/articles/cards/person.scss +++ b/components/articles/cards/person.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; @import './cards'; diff --git a/components/articles/cards/placeholder.scss b/components/articles/cards/placeholder.module.scss similarity index 89% rename from components/articles/cards/placeholder.scss rename to components/articles/cards/placeholder.module.scss index ee1a4ca1..1aa2de44 100644 --- a/components/articles/cards/placeholder.scss +++ b/components/articles/cards/placeholder.module.scss @@ -1,4 +1,4 @@ -@import 'responsiveness'; +@import 'styles/responsiveness'; @import './cards'; diff --git a/components/articles/cards/tagCard.scss b/components/articles/cards/tagCard.module.scss similarity index 97% rename from components/articles/cards/tagCard.scss rename to components/articles/cards/tagCard.module.scss index a34cee0e..c7d007c9 100644 --- a/components/articles/cards/tagCard.scss +++ b/components/articles/cards/tagCard.module.scss @@ -1,5 +1,5 @@ -@import 'responsiveness'; -@import 'variables'; +@import 'styles/responsiveness'; +@import 'styles/variables'; .tag-card { // diff --git a/components/auth/LoginForm.js b/components/auth/LoginForm.js index fc1835f6..ef5fdfe0 100644 --- a/components/auth/LoginForm.js +++ b/components/auth/LoginForm.js @@ -1,4 +1,4 @@ -import './login-form.scss'; +import './login-form.module.scss'; import React from 'react'; import cn from 'classnames'; diff --git a/components/auth/login-form.scss b/components/auth/login-form.module.scss similarity index 97% rename from components/auth/login-form.scss rename to components/auth/login-form.module.scss index 878042f9..1877c66d 100644 --- a/components/auth/login-form.scss +++ b/components/auth/login-form.module.scss @@ -1,4 +1,4 @@ -@import 'variables'; +@import 'styles/variables'; .login-form { width: 100%; diff --git a/components/common/Button.js b/components/common/Button.js index 5d3e2725..a385c559 100644 --- a/components/common/Button.js +++ b/components/common/Button.js @@ -1,4 +1,4 @@ -import './ui/button.scss'; +import './ui/button.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/common/ButtonGroup.js b/components/common/ButtonGroup.js index 24a9decd..3a4cb062 100644 --- a/components/common/ButtonGroup.js +++ b/components/common/ButtonGroup.js @@ -1,13 +1,13 @@ -import './ui/button-group.scss'; - import React from 'react'; import cn from 'classnames'; import PropTypes from 'prop-types'; +import block from 'bem-css-modules'; +import styles from './ui/button-group.module.scss'; + +const b = block(styles); const ButtonGroup = ({ children, icon, className }) => ( -
      - {children} -
      +
      {children}
      ); ButtonGroup.propTypes = { diff --git a/components/common/Picture.js b/components/common/Picture.js index 45f8d4ff..bc1e9704 100644 --- a/components/common/Picture.js +++ b/components/common/Picture.js @@ -1,7 +1,10 @@ -import './picture.scss'; - import React from 'react'; import PropTypes from 'prop-types'; +import cn from 'classnames'; +import block from 'bem-css-modules'; +import styles from './ui/picture.module.scss'; + +const b = block(styles); // checkout `styles/responsiveness.scss` const BREAKPOINTS = { @@ -16,7 +19,7 @@ const getMedia = ({ min, max }) => [min && `(min-width: ${min}px)`, max && `(max-width: ${max}px)`].filter(Boolean).join(' and '); const Picture = ({ className, sources, alt }) => ( - + {Object.entries(sources).map(([screen, src]) => ( ))} diff --git a/components/common/Table.js b/components/common/Table.js index 2cd03de8..1de35cb0 100644 --- a/components/common/Table.js +++ b/components/common/Table.js @@ -1,4 +1,4 @@ -import './ui/table.scss'; +import './ui/table.module.scss'; import React from 'react'; import PropTypes from 'prop-types'; diff --git a/components/common/form/FormWrapper.js b/components/common/form/FormWrapper.js index 2b814385..f5d60e5f 100644 --- a/components/common/form/FormWrapper.js +++ b/components/common/form/FormWrapper.js @@ -1,11 +1,10 @@ -import './forms.scss'; - import React from 'react'; import { connect } from 'react-redux'; import PropTypes from 'prop-types'; import { Formik } from 'formik'; import identity from 'lodash/identity'; import noop from 'lodash/noop'; +import styles from './forms.module.scss'; const FormWrapper = ({ action, @@ -40,7 +39,7 @@ const FormWrapper = ({ {form => ( <> {children(form)} -

      {form.errors.global}

      +

      {form.errors.global}

      )} diff --git a/components/common/form/forms.scss b/components/common/form/forms.module.scss similarity index 54% rename from components/common/form/forms.scss rename to components/common/form/forms.module.scss index 6d27ef8c..246c0245 100644 --- a/components/common/form/forms.scss +++ b/components/common/form/forms.module.scss @@ -1,4 +1,4 @@ -@import 'variables'; +@import 'styles/variables'; .form-error { color: $error; diff --git a/components/common/layout/CoreLayout.js b/components/common/layout/CoreLayout.js index f28a9b9c..8bfe7dfd 100644 --- a/components/common/layout/CoreLayout.js +++ b/components/common/layout/CoreLayout.js @@ -1,5 +1,3 @@ -import './layout.scss'; - import React from 'react'; import PropTypes from 'prop-types'; import cn from 'classnames'; diff --git a/components/common/layout/Footer.js b/components/common/layout/Footer.js index e18245b8..a1039f50 100644 --- a/components/common/layout/Footer.js +++ b/components/common/layout/Footer.js @@ -1,6 +1,6 @@ -import './footer.scss'; - import React from 'react'; +import cn from 'classnames'; +import block from 'bem-css-modules'; import Text, { useLocalization } from 'components/common/Text'; import Link from 'components/common/Link'; @@ -13,33 +13,38 @@ import ShareButtons from 'components/social/ShareButtons'; import { TOPICS } from 'constants'; import { NETWORKS } from 'constants/social'; import { ROUTES_NAMES } from 'routes'; +import footer from './footer/index.module.scss'; +import layout from './footer/layout.module.scss'; import SubscribeForm from './footer/SubscribeForm'; +const f = block(footer); +const l = block(layout); + const Footer = () => ( -