diff --git a/package.json b/package.json index 2824f2428..1d1c34065 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,6 @@ "@babel/preset-typescript": "^7.9.0", "@jest/globals": "^27.0.6", "@types/cheerio": "^0.22.18", - "@types/classnames": "^2.2.9", "@types/color-convert": "^1.9.0", "@types/iframe-resizer": "^3.5.7", "@types/js-yaml": "^3.12.2", diff --git a/site/package.json b/site/package.json index 9e921b6d7..6bd21b5df 100644 --- a/site/package.json +++ b/site/package.json @@ -86,7 +86,6 @@ "@sentry/tracing": "^6.3.5", "@types/react-instantsearch-dom": "^6.10.1", "algoliasearch": "^4.10.2", - "classnames": "^2.2.5", "color-convert": "^1.9.2", "core-js": "^3.2.1", "focus-trap-react": "^3.1.2", diff --git a/site/source/components/SchemeComparaison.tsx b/site/source/components/SchemeComparaison.tsx index 91e05a0db..5db777b25 100644 --- a/site/source/components/SchemeComparaison.tsx +++ b/site/source/components/SchemeComparaison.tsx @@ -3,7 +3,6 @@ import { isAutoentrepreneur, useDispatchAndGoToNextQuestion, } from 'Actions/companyStatusActions' -import classnames from 'classnames' import Value from 'Components/EngineValue' import Simulation from 'Components/Simulation' import InfoBulle from 'Components/ui/InfoBulle' @@ -16,7 +15,7 @@ import { useCallback, useMemo, useState } from 'react' import { Trans } from 'react-i18next' import { useSelector } from 'react-redux' import { situationSelector } from 'Selectors/simulationSelectors' -import styled from 'styled-components' +import styled, { css } from 'styled-components' import dirigeantComparaison from '../pages/Simulateurs/configs/rémunération-dirigeant.yaml' import SeeAnswersButton from './conversation/SeeAnswersButton' import PeriodSwitch from './PeriodSwitch' @@ -83,10 +82,8 @@ export default function SchemeComparaison({ return ( <>

Assimilé salarié @@ -606,26 +603,31 @@ export default function SchemeComparaison({ ) } +type StyledGridProps = { + hideAssimiléSalarié?: boolean + hideAutoEntrepreneur?: boolean +} + const StyledGrid = styled.div` display: grid; font-family: ${({ theme }) => theme.fonts.main}; justify-items: stretch; justify-content: center; - grid-template-columns: - [row-legend] minmax(auto, 100%) [assimilé-salarié] minmax(20%, 20rem) - [indépendant] minmax(20%, 20rem) [auto-entrepreneur] minmax(20%, 20rem) [end]; -&.hideAutoEntrepreneur { - grid-template-columns: - [row-legend] minmax(auto, 100%) [assimilé-salarié] minmax(20%, 20rem) - [indépendant] minmax(20%, 20rem) [auto-entrepreneur] 0 [end]; -} + ${(props: StyledGridProps) => + css` + grid-template-columns: + [row-legend] minmax(auto, 100%) + [assimilé-salarié] ${props.hideAssimiléSalarié + ? '0' + : 'minmax(20%, 20rem)'} + [indépendant] minmax(20%, 20rem) + [auto-entrepreneur] ${props.hideAssimiléSalarié + ? '0' + : 'minmax( 20%, 20rem)'} + [end]; + `} -&.hideAssimiléSalarié { - grid-template-columns: - [row-legend] minmax(auto, 100%) [assimilé-salarié] 0 - [indépendant] minmax(20%, 20rem) [auto-entrepreneur] minmax(20%, 20rem) [end]; -} & > * { width: 100%; border-bottom: 1px solid ${({ theme }) => theme.colors.bases.primary[100]}; diff --git a/yarn.lock b/yarn.lock index ee3dd55df..496974588 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2453,13 +2453,6 @@ dependencies: "@types/node" "*" -"@types/classnames@^2.2.9": - version "2.3.1" - resolved "https://registry.npmjs.org/@types/classnames/-/classnames-2.3.1.tgz" - integrity sha512-zeOWb0JGBoVmlQoznvqXbE0tEC/HONsnoUNH19Hc96NFsTAwTXbTqb8FMYkru1F/iqp7a18Ws3nWJvtA1sHD1A== - dependencies: - classnames "*" - "@types/color-convert@^1.9.0": version "1.9.0" resolved "https://registry.npmjs.org/@types/color-convert/-/color-convert-1.9.0.tgz" @@ -4883,7 +4876,7 @@ class-utils@^0.3.5: isobject "^3.0.0" static-extend "^0.1.1" -classnames@*, classnames@^2.2.5: +classnames@^2.2.5: version "2.3.1" resolved "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz" integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA== @@ -11764,16 +11757,21 @@ railroad-diagrams@^1.0.0: resolved "https://registry.npmjs.org/railroad-diagrams/-/railroad-diagrams-1.0.0.tgz" integrity sha1-635iZ1SN3t+4mcG5Dlc3RVnN234= -ramda@*, ramda@^0.27.0, ramda@^0.27.1, ramda@~0.27.1: - version "0.27.1" - resolved "https://registry.npmjs.org/ramda/-/ramda-0.27.1.tgz" - integrity sha512-PgIdVpn5y5Yns8vqb8FzBUEYn98V3xcPgawAkkgj0YJ0qDsnHCiNmZYfOGMgOvoB0eWFLpYbhxUR3mxfDIMvpw== +ramda@^0.25.0: + version "0.25.0" + resolved "https://registry.yarnpkg.com/ramda/-/ramda-0.25.0.tgz#8fdf68231cffa90bc2f9460390a0cb74a29b29a9" + integrity sha512-GXpfrYVPwx3K7RQ6aYT8KPS8XViSXUVJT1ONhoKPE9VAleW42YE+U+8VEyGWt41EnEQW7gwecYJriTI0pKoecQ== ramda@^0.26.1: version "0.26.1" resolved "https://registry.npmjs.org/ramda/-/ramda-0.26.1.tgz" integrity sha512-hLWjpy7EnsDBb0p+Z3B7rPi3GDeRG5ZtiI33kJhTt+ORCd38AbAIjB/9zRIUoeTbE/AVX5ZkU7m6bznsvrf8eQ== +ramda@^0.27.0, ramda@^0.27.1, ramda@~0.27.1: + version "0.27.1" + resolved "https://registry.npmjs.org/ramda/-/ramda-0.27.1.tgz" + integrity sha512-PgIdVpn5y5Yns8vqb8FzBUEYn98V3xcPgawAkkgj0YJ0qDsnHCiNmZYfOGMgOvoB0eWFLpYbhxUR3mxfDIMvpw== + randexp@0.4.6: version "0.4.6" resolved "https://registry.npmjs.org/randexp/-/randexp-0.4.6.tgz"