diff --git a/.eslintrc.js b/.eslintrc.js index 5b58818c7..07e0bb6a1 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,34 +1,30 @@ module.exports = { - env: { - browser: true, - node: true, - es6: true, + parser: '@babel/eslint-parser', + parserOptions: { + requireConfigFile: false, }, - extends: '@csssr/eslint-config-core', - plugins: ['react-hooks', '@emotion'], + extends: [ + require.resolve('@csssr/linters/eslint/base'), + require.resolve('@csssr/linters/eslint/react'), + ], + plugins: ['@emotion'], rules: { - 'prettier/prettier': [ + // Отключения + 'react/prop-types': 'off', // потому что много где нет + 'react/forbid-prop-types': 'off', // чтобы можно было оставить object и не уточнять до shape + 'jsx-a11y/anchor-is-valid': 'off', // потому что Next + 'react/no-danger': 'off', // потому что много где используется + 'no-nested-ternary': 'off', + + // Донастройка + camelcase: [ 'error', { - useTabs: false, - printWidth: 100, - semi: false, - singleQuote: true, - jsxSingleQuote: false, - trailingComma: 'all', - bracketSpacing: true, + properties: 'never', }, ], - 'react/react-in-jsx-scope': 'off', - 'react/prop-types': 'off', - 'react/jsx-no-target-blank': 'off', - 'react-hooks/rules-of-hooks': 'error', - 'react-hooks/exhaustive-deps': 'warn', + + // Доп. правила '@emotion/pkg-renaming': 'error', }, - settings: { - react: { - version: 'detect', - }, - }, } diff --git a/.prettierrc.js b/.prettierrc.js new file mode 100644 index 000000000..b8638d711 --- /dev/null +++ b/.prettierrc.js @@ -0,0 +1,9 @@ +module.exports = { + useTabs: false, + printWidth: 100, + semi: false, + singleQuote: true, + jsxSingleQuote: false, + trailingComma: 'all', + bracketSpacing: true, +} diff --git a/components/BenchmarkEmail/BenchmarkEmail.jsx b/components/BenchmarkEmail/BenchmarkEmail.jsx index 6b33cb606..17a76e8f3 100644 --- a/components/BenchmarkEmail/BenchmarkEmail.jsx +++ b/components/BenchmarkEmail/BenchmarkEmail.jsx @@ -1,59 +1,61 @@ -import styled from '@emotion/styled' -import styles from './BenchmarkEmail.styles' +/* eslint-disable camelcase */ import { Heading, SubHeading } from '@csssr/core-design' import { PictureSmart } from '@csssr/csssr.images/dist/react' +import styled from '@emotion/styled' + +import styles from './BenchmarkEmail.styles' import TextField from './TextField' const BenchmarkEmail = ({ className }) => { const isWindowContext = typeof window !== 'undefined' function rmspaces(x) { - var leftx = 0 - var rightx = x.length - 1 - while (x.charAt(leftx) == ' ') { + let leftx = 0 + let rightx = x.length - 1 + while (x.charAt(leftx) === ' ') { leftx++ } - while (x.charAt(rightx) == ' ') { + while (x.charAt(rightx) === ' ') { --rightx } - var q = x.substr(leftx, rightx - leftx + 1) - if (leftx == x.length && rightx == -1) { + let q = x.substr(leftx, rightx - leftx + 1) + if (leftx === x.length && rightx === -1) { q = '' } return q } function checkfield(data) { - if (rmspaces(data) == '') { + if (rmspaces(data) === '') { return false } else { return true } } function isemail(data) { - var flag = false + let flag = false if ( - data.indexOf('@', 0) == -1 || - data.indexOf('\\', 0) != -1 || - data.indexOf('/', 0) != -1 || + data.indexOf('@', 0) === -1 || + data.indexOf('\\', 0) !== -1 || + data.indexOf('/', 0) !== -1 || !checkfield(data) || - data.indexOf('.', 0) == -1 || - data.indexOf('@') == 0 || + data.indexOf('.', 0) === -1 || + data.indexOf('@') === 0 || data.lastIndexOf('.') < data.lastIndexOf('@') || - data.lastIndexOf('.') == data.length - 1 || - data.lastIndexOf('@') != data.indexOf('@') || - data.indexOf(',', 0) != -1 || - data.indexOf(':', 0) != -1 || - data.indexOf(';', 0) != -1 + data.lastIndexOf('.') === data.length - 1 || + data.lastIndexOf('@') !== data.indexOf('@') || + data.indexOf(',', 0) !== -1 || + data.indexOf(':', 0) !== -1 || + data.indexOf(';', 0) !== -1 ) { return flag } else { - var temp = rmspaces(data) - if (temp.indexOf(' ', 0) != -1) { + const temp = rmspaces(data) + if (temp.indexOf(' ', 0) !== -1) { flag = true } - var e2 = temp.length - temp.lastIndexOf('.') - 1 - var i1 = temp.indexOf('@') - if (temp.charAt(i1 + 1) == '.' || e2 < 1) { + const e2 = temp.length - temp.lastIndexOf('.') - 1 + const i1 = temp.indexOf('@') + if (temp.charAt(i1 + 1) === '.' || e2 < 1) { flag = true } return !flag @@ -61,36 +63,36 @@ const BenchmarkEmail = ({ className }) => { } function submit_LY6HHClick() { - var retVal = true - var frm = isWindowContext && document.getElementById('formbox_screen_subscribe_LY6HH') + let retVal = true + let frm = isWindowContext && document.getElementById('formbox_screen_subscribe_LY6HH') if (!isemail(isWindowContext && document.getElementsByName('fldemail_LY6HH')[0].value)) { alert('Please enter the Email Address') isWindowContext && document.getElementsByName('fldemail_LY6HH')[0].classList.add('error') retVal = false } - if (retVal == true) { + if (retVal === true) { frm = '_LY6HH' - var f = isWindowContext && document.createElement('form') + const f = isWindowContext && document.createElement('form') f.setAttribute('accept-charset', 'UTF-8') f.setAttribute('method', 'post') f.setAttribute('action', 'https://lb.benchmarkemail.com//code/lbform') - var elms = + const elms = isWindowContext && document.getElementsByName('frmLB' + frm)[0].getElementsByTagName('*') - var ty = '' - for (var ei = 0; ei < elms.length; ei++) { + let ty = '' + for (let ei = 0; ei < elms.length; ei++) { ty = elms[ei].type if ( - ty == 'hidden' || - ty == 'text' || - (ty == 'checkbox' && elms[ei].checked) || - (ty == 'radio' && elms[ei].checked) || - ty == 'textarea' || - ty == 'select-one' || - ty == 'button' + ty === 'hidden' || + ty === 'text' || + (ty === 'checkbox' && elms[ei].checked) || + (ty === 'radio' && elms[ei].checked) || + ty === 'textarea' || + ty === 'select-one' || + ty === 'button' ) { - var elm = elms[ei] - if (elm.id != '') { - var i = document.createElement('input') + const elm = elms[ei] + if (elm.id !== '') { + const i = document.createElement('input') i.type = 'hidden' i.name = elm.name.replace('_LY6HH', '') i.id = elm.id @@ -119,18 +121,18 @@ const BenchmarkEmail = ({ className }) => { } function debounce_LY6HH(func, wait, immediate) { - var timeout + let timeout return function () { - var context = this, - args = arguments - var later = function () { + const context = this + const args = arguments + const later = function () { timeout = null if (!immediate) { func.apply(context, args) } } - var callNow = immediate && !timeout + const callNow = immediate && !timeout clearTimeout(timeout) timeout = setTimeout(later, wait) if (callNow) { @@ -139,7 +141,7 @@ const BenchmarkEmail = ({ className }) => { } } - var hasVerticalCenter_LY6HH = + const hasVerticalCenter_LY6HH = isWindowContext && document.getElementsByClassName('position-centered') function verticalCenter_LY6HH(element) { if (element) { @@ -148,15 +150,15 @@ const BenchmarkEmail = ({ className }) => { } setTimeout(function () { if (hasVerticalCenter_LY6HH.length > 0) { - var windowHeight = Math.max( + const windowHeight = Math.max( isWindowContext && document.documentElement.clientHeight, window.innerHeight || 0, ) - var formElement_LY6HH = + const formElement_LY6HH = isWindowContext && document.getElementsByClassName('formbox-editor_LY6HH')[0] - var formHeight_LY6HH = formElement_LY6HH.clientHeight + const formHeight_LY6HH = formElement_LY6HH.clientHeight if (formHeight_LY6HH < windowHeight) { - var newPosition = 0 + let newPosition = 0 newPosition = (windowHeight - formHeight_LY6HH) / 2 formElement_LY6HH.style.top = newPosition + 'px' } else { @@ -170,7 +172,7 @@ const BenchmarkEmail = ({ className }) => { } if (hasVerticalCenter_LY6HH.length > 0) { - var resizeEvent_LY6HH = debounce_LY6HH(function () { + const resizeEvent_LY6HH = debounce_LY6HH(function () { verticalCenter_LY6HH() }, 250) window.addEventListener('resize', resizeEvent_LY6HH) @@ -236,6 +238,7 @@ const BenchmarkEmail = ({ className }) => { />
+ {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}
css` diff --git a/components/BenchmarkEmail/TextField/TextField.jsx b/components/BenchmarkEmail/TextField/TextField.jsx index 13bec079e..d67a189c9 100644 --- a/components/BenchmarkEmail/TextField/TextField.jsx +++ b/components/BenchmarkEmail/TextField/TextField.jsx @@ -1,7 +1,8 @@ -import React, { useState } from 'react' -import { string } from 'prop-types' -import cn from 'classnames' import styled from '@emotion/styled' +import cn from 'classnames' +import { string } from 'prop-types' +import React, { useState } from 'react' + import styles from './TextField.styles' const TextField = ({ className, id, name, label, testId, autocomplete, type = 'text' }) => { diff --git a/components/BenchmarkEmail/TextField/TextField.styles.js b/components/BenchmarkEmail/TextField/TextField.styles.js index 2ef60077f..da001c5b4 100644 --- a/components/BenchmarkEmail/TextField/TextField.styles.js +++ b/components/BenchmarkEmail/TextField/TextField.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../utils/style/calcRem' const base = ({ colors }) => css` diff --git a/components/ContactForm/ContactForm.jsx b/components/ContactForm/ContactForm.jsx index 2c522e4e0..2a038d0b8 100644 --- a/components/ContactForm/ContactForm.jsx +++ b/components/ContactForm/ContactForm.jsx @@ -1,17 +1,19 @@ -import { useState } from 'react' -import { string } from 'prop-types' -import Fade from 'react-reveal/Fade' +import { AnimatedButton } from '@csssr/core-design' +import styled from '@emotion/styled' import cn from 'classnames' -import { Field, Form as ReactFinalForm } from 'react-final-form' import { FORM_ERROR } from 'final-form' -import styled from '@emotion/styled' -import styles from './ContactForm.styles' -import { AnimatedButton } from '@csssr/core-design' -import TextField from './TextField' -import FormStateMessage from './FormStateMessage' +import { string } from 'prop-types' +import { useState } from 'react' +import { Field, Form as ReactFinalForm } from 'react-final-form' +import Fade from 'react-reveal/Fade' + import testEmails from '../../utils/testEmails' import rateFormValidationRules from '../../utils/validators/rateFormValidationRules' +import styles from './ContactForm.styles' +import FormStateMessage from './FormStateMessage' +import TextField from './TextField' + const Component = ({ className, kind, @@ -80,7 +82,7 @@ const Component = ({ return (

- Отправляя данную форму, я подтверждаю своё согласие на получение рекламных и информационных материалов, - а также факт своего ознакомления и согласия с + Отправляя данную форму, я подтверждаю своё согласие на получение рекламных + и информационных материалов, а также факт своего ознакомления и согласия с {' '} Политикой конфиденциальности diff --git a/components/ContactForm/ContactForm.styles.js b/components/ContactForm/ContactForm.styles.js index a52563b8a..8fe264e9c 100644 --- a/components/ContactForm/ContactForm.styles.js +++ b/components/ContactForm/ContactForm.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import { calcRem } from '../../utils/style/calcRem' const base = ({ breakpoints: { tablet, mobile }, colors }) => css` diff --git a/components/ContactForm/FormStateMessage/FormStateMessage.jsx b/components/ContactForm/FormStateMessage/FormStateMessage.jsx index 74e3ac4df..e7ffae35d 100644 --- a/components/ContactForm/FormStateMessage/FormStateMessage.jsx +++ b/components/ContactForm/FormStateMessage/FormStateMessage.jsx @@ -1,9 +1,10 @@ -import React from 'react' -import cn from 'classnames' +import { Text } from '@csssr/core-design' import styled from '@emotion/styled' -import styles from './FormStateMessage.styles' +import cn from 'classnames' import { func, oneOf, string } from 'prop-types' -import { Text } from '@csssr/core-design' +import React from 'react' + +import styles from './FormStateMessage.styles' const FormStateMessage = ({ className, kind, status, testId, onTryAgain }) => { const getMessage = () => { @@ -41,6 +42,7 @@ const FormStateMessage = ({ className, kind, status, testId, onTryAgain }) => { {status === 'fail' && ( <> + {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */} Попробуйте
еще раз diff --git a/components/ContactForm/FormStateMessage/FormStateMessage.styles.js b/components/ContactForm/FormStateMessage/FormStateMessage.styles.js index 83ccdd50b..72ca83d22 100644 --- a/components/ContactForm/FormStateMessage/FormStateMessage.styles.js +++ b/components/ContactForm/FormStateMessage/FormStateMessage.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import { calcRem } from '../../../utils/style/calcRem' const base = ({ breakpoints: { mobile }}) => css` @@ -86,4 +87,5 @@ const StyledFormStateMessage = (props) => { ${base({ breakpoints })} ` } + export default StyledFormStateMessage diff --git a/components/ContactForm/TextField/TextField.jsx b/components/ContactForm/TextField/TextField.jsx index a755392e9..fcdc42d05 100644 --- a/components/ContactForm/TextField/TextField.jsx +++ b/components/ContactForm/TextField/TextField.jsx @@ -1,7 +1,8 @@ -import React from 'react' -import { string, bool } from 'prop-types' -import cn from 'classnames' import styled from '@emotion/styled' +import cn from 'classnames' +import { bool, string } from 'prop-types' +import React from 'react' + import styles from './TextField.styles' const TextField = ({ diff --git a/components/ContactForm/TextField/TextField.styles.js b/components/ContactForm/TextField/TextField.styles.js index 159db554d..40f6a2063 100644 --- a/components/ContactForm/TextField/TextField.styles.js +++ b/components/ContactForm/TextField/TextField.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../utils/style/calcRem' const base = ({ colors }) => css` diff --git a/components/DateFormatter.jsx b/components/DateFormatter.jsx index 4811c9c53..35d868638 100644 --- a/components/DateFormatter.jsx +++ b/components/DateFormatter.jsx @@ -1,7 +1,7 @@ -import { parseISO, format } from 'date-fns' -import { ru, enUS } from 'date-fns/locale' +import { format, parseISO } from 'date-fns' +import { enUS, ru } from 'date-fns/locale' -export default function DateFormatter({ children, className, language }) { +const DateFormatter = ({ children, className, language }) => { const date = parseISO(children) const locale = language === 'ru' ? ru : enUS const localeFormat = language === 'ru' ? 'd MMMM, yyyy' : 'LLLL d, yyyy' @@ -11,3 +11,5 @@ export default function DateFormatter({ children, className, language }) { ) } + +export default DateFormatter diff --git a/components/Grid/Grid.jsx b/components/Grid/Grid.jsx index 989a85904..993fbf494 100644 --- a/components/Grid/Grid.jsx +++ b/components/Grid/Grid.jsx @@ -1,6 +1,7 @@ +import { Grid as OriginGrid } from '@csssr/core-design' import styled from '@emotion/styled' + import styles from './Grid.styles' -import { Grid as OriginGrid } from '@csssr/core-design' export const Grid = styled(OriginGrid)` ${styles} diff --git a/components/Layout/Layout.jsx b/components/Layout/Layout.jsx index 64de4a61f..26a0cb676 100644 --- a/components/Layout/Layout.jsx +++ b/components/Layout/Layout.jsx @@ -1,16 +1,17 @@ -import React from 'react' +import { CookiesPopup, Footer, Header } from '@csssr/core-design' import { Global } from '@emotion/react' +import React from 'react' + import Meta from '../Meta' + import styles from './Layout.styles' -import { Header, Footer } from '@csssr/core-design' -import { CookiesPopup } from '@csssr/core-design' const presetByLanguage = { en: 'defaultEn', ru: 'defaultRu', } -export default function Layout({ children, language, type }) { +const Layout = ({ children, language, type }) => { return ( <> @@ -40,3 +41,5 @@ export default function Layout({ children, language, type }) { ) } + +export default Layout diff --git a/components/Layout/Layout.styles.js b/components/Layout/Layout.styles.js index 276b2f5b8..72fb132ab 100644 --- a/components/Layout/Layout.styles.js +++ b/components/Layout/Layout.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, above, mobile }}) => css` diff --git a/components/Newsletter/Newsletter.jsx b/components/Newsletter/Newsletter.jsx index cecd56818..8547b2b2c 100644 --- a/components/Newsletter/Newsletter.jsx +++ b/components/Newsletter/Newsletter.jsx @@ -1,12 +1,14 @@ -import React from 'react' -import styled from '@emotion/styled' -import styles, { dynamicFooterStyles } from './Newsletter.styles' -import { Global } from '@emotion/react' -import { PictureSmart } from '@csssr/csssr.images/dist/react' import { Heading, Text } from '@csssr/core-design' -import { Grid } from '../Grid' -import ContactForm from '../ContactForm' +import { PictureSmart } from '@csssr/csssr.images/dist/react' +import { Global } from '@emotion/react' +import styled from '@emotion/styled' +import React from 'react' + import { newsletterData } from '../../data/newsletter' +import ContactForm from '../ContactForm' +import { Grid } from '../Grid' + +import styles, { dynamicFooterStyles } from './Newsletter.styles' const Newsletter = ({ className, diff --git a/components/Newsletter/Newsletter.styles.js b/components/Newsletter/Newsletter.styles.js index 290f7aad9..92dc82d3c 100644 --- a/components/Newsletter/Newsletter.styles.js +++ b/components/Newsletter/Newsletter.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../utils/style/calcRem' const base = ({ breakpoints: { mobile, tablet, desktop }, colors }) => css` diff --git a/components/Post/Body/Body.jsx b/components/Post/Body/Body.jsx index 08112aad5..f3b610b9b 100644 --- a/components/Post/Body/Body.jsx +++ b/components/Post/Body/Body.jsx @@ -1,15 +1,14 @@ -import React from 'react' -import { string, object } from 'prop-types' import styled from '@emotion/styled' import cn from 'classnames' +import { object, string } from 'prop-types' +import React from 'react' import { Grid } from '../../Grid' import PostNewsletter from '../../PostNewsletter' -import Comments from './Comments' -import ReadMore from './ReadMore' import styles from './Body.styles' - +import Comments from './Comments' +import ReadMore from './ReadMore' import { compilerMdx } from './utils/compilerMdx' const Body = ({ diff --git a/components/Post/Body/Body.styles.js b/components/Post/Body/Body.styles.js index 882f480f0..c4897d1b6 100644 --- a/components/Post/Body/Body.styles.js +++ b/components/Post/Body/Body.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, above, mobile }}) => css` diff --git a/components/Post/Body/Caption/Caption.jsx b/components/Post/Body/Caption/Caption.jsx index 8f4e48279..c7fa0bb7f 100644 --- a/components/Post/Body/Caption/Caption.jsx +++ b/components/Post/Body/Caption/Caption.jsx @@ -1,8 +1,9 @@ -import React from 'react' -import cn from 'classnames' -import styled from '@emotion/styled' import { Text } from '@csssr/core-design' -import { string, node, oneOf } from 'prop-types' +import styled from '@emotion/styled' +import cn from 'classnames' +import { node, oneOf, string } from 'prop-types' +import React from 'react' + import styles from './Caption.styles' const Caption = ({ className, size, children }) => ( diff --git a/components/Post/Body/Caption/Caption.styles.js b/components/Post/Body/Caption/Caption.styles.js index 2e1661d93..66671e9dc 100644 --- a/components/Post/Body/Caption/Caption.styles.js +++ b/components/Post/Body/Caption/Caption.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, above, mobile }, colors}) => css` diff --git a/components/Post/Body/Comments/Comments.jsx b/components/Post/Body/Comments/Comments.jsx index a6d5ca741..eb333c095 100644 --- a/components/Post/Body/Comments/Comments.jsx +++ b/components/Post/Body/Comments/Comments.jsx @@ -1,10 +1,11 @@ -import React, { useEffect } from 'react' -import { string } from 'prop-types' -import styled from '@emotion/styled' -import styles, { backgroundImagesStyles } from './Comments.styled' -import { Global } from '@emotion/react' import { Heading } from '@csssr/core-design' +import { Global } from '@emotion/react' +import styled from '@emotion/styled' import { useRouter } from 'next/router' +import { string } from 'prop-types' +import React, { useEffect } from 'react' + +import styles, { backgroundImagesStyles } from './Comments.styled' const insertScript = (src, id, parentElement) => { const script = window.document.createElement('script') diff --git a/components/Post/Body/Comments/Comments.styled.js b/components/Post/Body/Comments/Comments.styled.js index e0eaac5cb..fa7d26053 100644 --- a/components/Post/Body/Comments/Comments.styled.js +++ b/components/Post/Body/Comments/Comments.styled.js @@ -1,6 +1,7 @@ +import { backgroundCssSmart } from '@csssr/csssr.images/dist/utils/backgroundCss' import { css } from '@emotion/react' + import calcRem from '../../../../utils/style/calcRem' -import { backgroundCssSmart } from '@csssr/csssr.images/dist/utils/backgroundCss' const defaultAvatarImages = require.context('../../../../public/components/comments/defaultAvatar') diff --git a/components/Post/Body/Img/Img.jsx b/components/Post/Body/Img/Img.jsx index 7e81a31cf..d4aa209fe 100644 --- a/components/Post/Body/Img/Img.jsx +++ b/components/Post/Body/Img/Img.jsx @@ -1,9 +1,10 @@ -import React from 'react' +import { Picture } from '@csssr/csssr.images/dist/react' import styled from '@emotion/styled' -import { string, arrayOf, object, bool } from 'prop-types' -import styles from './Img.styles' import cn from 'classnames' -import { Picture } from '@csssr/csssr.images/dist/react' +import { arrayOf, bool, object, string } from 'prop-types' +import React from 'react' + +import styles from './Img.styles' const Img = ({ className, diff --git a/components/Post/Body/Img/Img.styles.js b/components/Post/Body/Img/Img.styles.js index 557e495bc..607be7cea 100644 --- a/components/Post/Body/Img/Img.styles.js +++ b/components/Post/Body/Img/Img.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, mobile }}) => css` diff --git a/components/Post/Body/List/List.jsx b/components/Post/Body/List/List.jsx index 9ab7c4de9..f94bf7314 100644 --- a/components/Post/Body/List/List.jsx +++ b/components/Post/Body/List/List.jsx @@ -1,10 +1,11 @@ -import React from 'react' import styled from '@emotion/styled' +import React from 'react' + import styles from './List.styles' const List = ({ className, children, ...otherProps }) => { const list = React.createElement( - `${className.includes('is_ordered') ? 'ol' : 'ul'}`, + String(className.includes('is_ordered') ? 'ol' : 'ul'), { className, ...otherProps }, ...children, ) diff --git a/components/Post/Body/List/List.styles.js b/components/Post/Body/List/List.styles.js index 0591e9b63..b440dab5e 100644 --- a/components/Post/Body/List/List.styles.js +++ b/components/Post/Body/List/List.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react'; + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, mobile }}) => css` diff --git a/components/Post/Body/Note/Note.jsx b/components/Post/Body/Note/Note.jsx index b8ee70d5f..fa6f1ae71 100644 --- a/components/Post/Body/Note/Note.jsx +++ b/components/Post/Body/Note/Note.jsx @@ -1,7 +1,8 @@ -import { string, node } from 'prop-types' -import cn from 'classnames' -import styled from '@emotion/styled' import { Text } from '@csssr/core-design' +import styled from '@emotion/styled' +import cn from 'classnames' +import { node, string } from 'prop-types' + import styles from './Note.styles' const Note = (props) => { diff --git a/components/Post/Body/Note/Note.styles.js b/components/Post/Body/Note/Note.styles.js index 2755dbdb4..bc2dbdf98 100644 --- a/components/Post/Body/Note/Note.styles.js +++ b/components/Post/Body/Note/Note.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react'; + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, mobile }}) => css` diff --git a/components/Post/Body/ParagraphWithImage/ParagraphWithImage.jsx b/components/Post/Body/ParagraphWithImage/ParagraphWithImage.jsx index c0689b13f..dcad2fd2c 100644 --- a/components/Post/Body/ParagraphWithImage/ParagraphWithImage.jsx +++ b/components/Post/Body/ParagraphWithImage/ParagraphWithImage.jsx @@ -1,9 +1,10 @@ -import React from 'react' -import { string, node, arrayOf, object } from 'prop-types' +import { Picture } from '@csssr/csssr.images/dist/react' import styled from '@emotion/styled' import cn from 'classnames' +import { arrayOf, node, object, string } from 'prop-types' +import React from 'react' + import styles from './ParagraphWithImage.styles' -import { Picture } from '@csssr/csssr.images/dist/react' const ParagraphWithImage = ({ children, className, imageSide = 'left', sources, alt }) => { return ( diff --git a/components/Post/Body/ParagraphWithImage/ParagraphWithImage.styles.js b/components/Post/Body/ParagraphWithImage/ParagraphWithImage.styles.js index adbdf466f..6eb5c98ec 100644 --- a/components/Post/Body/ParagraphWithImage/ParagraphWithImage.styles.js +++ b/components/Post/Body/ParagraphWithImage/ParagraphWithImage.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, mobile } }) => css` diff --git a/components/Post/Body/Quote/Quote.jsx b/components/Post/Body/Quote/Quote.jsx index ff60ad613..00933fd6f 100644 --- a/components/Post/Body/Quote/Quote.jsx +++ b/components/Post/Body/Quote/Quote.jsx @@ -1,11 +1,13 @@ -import React from 'react' -import cn from 'classnames' -import { string, node, bool, oneOf } from 'prop-types' import { Link } from '@csssr/core-design' +import { PictureSmart } from '@csssr/csssr.images/dist/react' import styled from '@emotion/styled' -import styles from './Quote.styles' +import cn from 'classnames' +import { bool, node, oneOf, string } from 'prop-types' +import React from 'react' + import { Grid } from '../../../Grid' -import { PictureSmart } from '@csssr/csssr.images/dist/react' + +import styles from './Quote.styles' const Quote = ({ className, diff --git a/components/Post/Body/Quote/Quote.styles.js b/components/Post/Body/Quote/Quote.styles.js index 376d29bba..28daae3c4 100644 --- a/components/Post/Body/Quote/Quote.styles.js +++ b/components/Post/Body/Quote/Quote.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, mobile }, withImage, colors}) => css` diff --git a/components/Post/Body/ReadMore/ReadMore.jsx b/components/Post/Body/ReadMore/ReadMore.jsx index 8d1d4a5bf..1481490d6 100644 --- a/components/Post/Body/ReadMore/ReadMore.jsx +++ b/components/Post/Body/ReadMore/ReadMore.jsx @@ -1,9 +1,11 @@ -import React from 'react' -import styled from '@emotion/styled' -import styles from './ReadMore.styles' import { Heading } from '@csssr/core-design' +import styled from '@emotion/styled' +import React from 'react' + import PostCard from '../../../main/Posts/PostCard' +import styles from './ReadMore.styles' + const ReadMore = ({ className, posts }) => { return (

diff --git a/components/Post/Body/ReadMore/ReadMore.styles.js b/components/Post/Body/ReadMore/ReadMore.styles.js index 983198215..114d40e22 100644 --- a/components/Post/Body/ReadMore/ReadMore.styles.js +++ b/components/Post/Body/ReadMore/ReadMore.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { mobile, tablet, desktop}, colors }) => css` diff --git a/components/Post/Body/Separator/Separator.jsx b/components/Post/Body/Separator/Separator.jsx index c6c289738..3b969d6cd 100644 --- a/components/Post/Body/Separator/Separator.jsx +++ b/components/Post/Body/Separator/Separator.jsx @@ -1,10 +1,11 @@ -import React from 'react' -import { string, oneOf, arrayOf, object } from 'prop-types' -import cn from 'classnames' +import { backgroundCss } from '@csssr/csssr.images/dist/utils' import { css, Global } from '@emotion/react' import styled from '@emotion/styled' +import cn from 'classnames' +import { arrayOf, object, oneOf, string } from 'prop-types' +import React from 'react' + import styles, { bodyDynamicStyle } from './Separator.styles' -import { backgroundCss } from '@csssr/csssr.images/dist/utils' const Separator = ({ className, sources, type, imageName }) => { return ( diff --git a/components/Post/Body/Separator/Separator.styles.js b/components/Post/Body/Separator/Separator.styles.js index 5e42f5ebf..89734d257 100644 --- a/components/Post/Body/Separator/Separator.styles.js +++ b/components/Post/Body/Separator/Separator.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react'; + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, mobile }, lineColor }) => css` diff --git a/components/Post/Body/Table/Table.jsx b/components/Post/Body/Table/Table.jsx index 6cf1555a7..14c4da8e5 100644 --- a/components/Post/Body/Table/Table.jsx +++ b/components/Post/Body/Table/Table.jsx @@ -1,6 +1,7 @@ import styled from '@emotion/styled' -import { string, node, bool, oneOf } from 'prop-types' import cn from 'classnames' +import { bool, node, oneOf, string } from 'prop-types' + import styles from './Table.styles' const Table = ({ className, children, color, withBorders, ...props }) => ( diff --git a/components/Post/Body/Table/Table.styles.js b/components/Post/Body/Table/Table.styles.js index 8692d6a03..87ca2ce26 100644 --- a/components/Post/Body/Table/Table.styles.js +++ b/components/Post/Body/Table/Table.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../../utils/style/calcRem' const base = ({ breakpoints: { mobile, tablet, desktop } }) => css` diff --git a/components/Post/Body/Video/Video.jsx b/components/Post/Body/Video/Video.jsx index 1dec7881a..93e794148 100644 --- a/components/Post/Body/Video/Video.jsx +++ b/components/Post/Body/Video/Video.jsx @@ -1,7 +1,8 @@ -import React from 'react' -import cn from 'classnames' import styled from '@emotion/styled' -import { string, node } from 'prop-types' +import cn from 'classnames' +import { node, string } from 'prop-types' +import React from 'react' + import styles from './Video.styles' const Video = ({ className, src, children }) => @@ -12,6 +13,7 @@ const Video = ({ className, src, children }) =>
) : ( + // eslint-disable-next-line jsx-a11y/media-has-caption
@@ -18,12 +19,12 @@ const NewsAudioLink = ({ className, href, testId = 'NewsAudio:link' }) => ( className="link" href="https://radio.csssr.com/rss/news512.rss" target="_blank" - rel="noopener nofollow" + rel="noopener nofollow noreferrer" > {'RSS подкаста'} - + Прослушать аудио-версию @@ -34,9 +35,6 @@ const NewsAudioLink = ({ className, href, testId = 'NewsAudio:link' }) => ( NewsAudioLink.propTypes = { className: string, - sources: arrayOf(object), - src: string, - alt: string, } export default styled(NewsAudioLink)` diff --git a/components/Post/Header/NewsAudioLink/NewsAudioLink.styles.js b/components/Post/Header/NewsAudioLink/NewsAudioLink.styles.js index fa2a4e388..3b6f0647d 100644 --- a/components/Post/Header/NewsAudioLink/NewsAudioLink.styles.js +++ b/components/Post/Header/NewsAudioLink/NewsAudioLink.styles.js @@ -1,7 +1,8 @@ +import { backgroundCssSmart } from '@csssr/csssr.images/dist/utils/backgroundCss' import { css } from '@emotion/react' + import calcRem from '../../../../utils/style/calcRem' -import { backgroundCssSmart } from '@csssr/csssr.images/dist/utils/backgroundCss' const soundtrackImages = require.context('../../../../public/components/newsAudioLink/images') diff --git a/components/Post/Post.jsx b/components/Post/Post.jsx index 3d92abdf4..f33c58ff1 100644 --- a/components/Post/Post.jsx +++ b/components/Post/Post.jsx @@ -1,15 +1,16 @@ -import { string, object, shape } from 'prop-types' +import { getOriginal } from '@csssr/csssr.images/dist/utils' import styled from '@emotion/styled' -import styles from './Post.styles' -import Head from 'next/head' import cn from 'classnames' -import { getOriginal } from '@csssr/csssr.images/dist/utils' -import Header from './Header' -import Body from './Body' +import Head from 'next/head' +import { object, shape, string } from 'prop-types' + +import newsPostOgImage from '../../public/images/og/news512/all.png' import cleaningTitle from '../../utils/client/cleaningTitle' import getDescription from '../../utils/client/getDescription' -import newsPostOgImage from '../../public/images/og/news512/all.png' +import Body from './Body' +import Header from './Header' +import styles from './Post.styles' const Post = ({ posts, diff --git a/components/Post/Post.styles.js b/components/Post/Post.styles.js index b3537ba54..8aa67c6aa 100644 --- a/components/Post/Post.styles.js +++ b/components/Post/Post.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, mobile }}) => css` diff --git a/components/Post/Subtitle/Subtitle.jsx b/components/Post/Subtitle/Subtitle.jsx index 8ef47fdc9..079547c21 100644 --- a/components/Post/Subtitle/Subtitle.jsx +++ b/components/Post/Subtitle/Subtitle.jsx @@ -1,9 +1,10 @@ -import React from 'react' +import { Text } from '@csssr/core-design' import styled from '@emotion/styled' import cn from 'classnames' -import { string, oneOf, node } from 'prop-types' +import { node, oneOf, string } from 'prop-types' +import React from 'react' + import styles from './Subtitle.styles' -import { Text } from '@csssr/core-design' const Subtitle = ({ className, size, dangerouslySetInnerHTML, children }) => children ? ( diff --git a/components/Post/Subtitle/Subtitle.styles.js b/components/Post/Subtitle/Subtitle.styles.js index 7da207788..4055eb490 100644 --- a/components/Post/Subtitle/Subtitle.styles.js +++ b/components/Post/Subtitle/Subtitle.styles.js @@ -1,4 +1,5 @@ import { css } from '@emotion/react' + import calcRem from '../../../utils/style/calcRem' const base = ({ breakpoints: { desktop, tablet, mobile }}) => css` diff --git a/components/PostNewsletter/NewsPodcast/NewsPodcast.jsx b/components/PostNewsletter/NewsPodcast/NewsPodcast.jsx index f0ca0832f..8401b1724 100644 --- a/components/PostNewsletter/NewsPodcast/NewsPodcast.jsx +++ b/components/PostNewsletter/NewsPodcast/NewsPodcast.jsx @@ -1,8 +1,9 @@ -import React from 'react' +import { PictureSmart } from '@csssr/csssr.images/dist/react' import styled from '@emotion/styled' import cn from 'classnames' +import React from 'react' + import styles from './NewsPodcast.styles' -import { PictureSmart } from '@csssr/csssr.images/dist/react' const NewsPodcast = ({ className, HideNewsPodcastOnMobile }) => { const links = [ @@ -37,12 +38,12 @@ const NewsPodcast = ({ className, HideNewsPodcastOnMobile }) => { requireImages={require.context('../../../public/components/newsPodcast')} />