From e0bc1e18300765566b4845dc83bbf71089540d18 Mon Sep 17 00:00:00 2001 From: ManuC Date: Thu, 9 Apr 2020 00:45:50 +0200 Subject: [PATCH 1/5] feat(ui): add burger to UI and remove lame use of package --- .../code-du-travail-frontend/next.config.js | 2 +- .../code-du-travail-frontend/package.json | 1 - .../src/layout/Header/BurgerNav.js | 145 ++++----------- .../src/layout/Header/BurgerStyles.js | 112 ------------ .../Header/__tests__/BurgerStyles.test.js | 11 -- .../__snapshots__/BurgerStyles.test.js.snap | 77 -------- .../react-fiche-service-public/package.json | 12 +- .../rollup.config.js | 18 +- packages/react-ui/package.json | 7 +- packages/react-ui/rollup.config.js | 16 +- packages/react-ui/src/BurgerNav/NavItems.js | 56 ++++++ packages/react-ui/src/BurgerNav/index.js | 132 +++++++++++++ packages/react-ui/src/BurgerNav/story.js | 37 ++++ packages/react-ui/src/BurgerNav/test.js | 19 ++ packages/react-ui/src/Modal/index.js | 1 + packages/react-ui/src/index.js | 6 + packages/react-ui/src/theme.js | 4 +- yarn.lock | 173 +++++------------- 18 files changed, 346 insertions(+), 483 deletions(-) delete mode 100644 packages/code-du-travail-frontend/src/layout/Header/BurgerStyles.js delete mode 100644 packages/code-du-travail-frontend/src/layout/Header/__tests__/BurgerStyles.test.js delete mode 100644 packages/code-du-travail-frontend/src/layout/Header/__tests__/__snapshots__/BurgerStyles.test.js.snap create mode 100644 packages/react-ui/src/BurgerNav/NavItems.js create mode 100644 packages/react-ui/src/BurgerNav/index.js create mode 100644 packages/react-ui/src/BurgerNav/story.js create mode 100644 packages/react-ui/src/BurgerNav/test.js diff --git a/packages/code-du-travail-frontend/next.config.js b/packages/code-du-travail-frontend/next.config.js index 286dc5061c..3462161dd9 100644 --- a/packages/code-du-travail-frontend/next.config.js +++ b/packages/code-du-travail-frontend/next.config.js @@ -15,7 +15,7 @@ const withTM = function (config) { if (process.env.NODE_ENV === "production") { return withTranspileModule(config); } - return config; + return withTranspileModule(config); }; const compose = (...fns) => (args) => diff --git a/packages/code-du-travail-frontend/package.json b/packages/code-du-travail-frontend/package.json index 1fbb57c9cf..4f8c1fa662 100644 --- a/packages/code-du-travail-frontend/package.json +++ b/packages/code-du-travail-frontend/package.json @@ -51,7 +51,6 @@ "next-transpile-modules": "^3.1.0", "react": "^16.13.1", "react-autosuggest": "9.4.3", - "react-burger-menu": "^2.6.13", "react-delay": "^0.1.0", "react-dom": "^16.13.1", "react-feather": "2.0.3", diff --git a/packages/code-du-travail-frontend/src/layout/Header/BurgerNav.js b/packages/code-du-travail-frontend/src/layout/Header/BurgerNav.js index 69feaf3431..ef63d6ceca 100644 --- a/packages/code-du-travail-frontend/src/layout/Header/BurgerNav.js +++ b/packages/code-du-travail-frontend/src/layout/Header/BurgerNav.js @@ -1,120 +1,41 @@ -import React, { useState, useEffect } from "react"; -import Link from "next/link"; +import React from "react"; import styled from "styled-components"; -import { slide as Menu } from "react-burger-menu"; -import { Button, icons, theme } from "@socialgouv/react-ui"; +import Link from "next/link"; +import { + BurgerNav as RootBurgerNav, + BurgerNavButton as NavButton, + BurgerNavLink as NavAnchor, + BurgerNavCurrent as NavCurrent, +} from "@socialgouv/react-ui"; import { AccessibilityModal } from "../../common/AccessibilityModal"; -import { BurgerStyles } from "./BurgerStyles"; -const { Burger: BurgerIcon, Close: CloseIcon } = icons; - -const TabIndexedLink = ({ href, children, ...props }) => ( - - {children} - -); - -export const BurgerNav = ({ currentPage }) => { - const [isDesktop, setIsDesktop] = useState(false); - useEffect(() => { - if (window.innerWidth > theme.breakpoints.intTablet) { - // make sure the nav is focusable - setIsDesktop(true); - } - }, []); - return ( - - - } - customCrossIcon={} - > - - {(openModal) => ( - - Accessibilité - - )} - - {currentPage !== "tools" ? ( - - Boîte à outils - - ) : ( - Boîte à outils - )} - {currentPage !== "themes" ? ( - - Thèmes - - ) : ( - Thèmes +export const BurgerNav = ({ currentPage }) => ( + + <> + + {(openModal) => ( + Accessibilité )} - - - ); -}; - -const { box, breakpoints, fonts, spacings } = theme; - -const BaseNavItem = styled(Button)` - position: relative; - display: flex !important; - align-items: center; - height: 100%; - padding: 0 ${spacings.base}; - font-weight: normal; - font-size: ${fonts.sizes.default}; - font-family: "Open Sans", sans-serif; - border: none; - @media (max-width: ${breakpoints.tablet}) { - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: ${fonts.sizes.headings.small}; - } -`; - -const LinkItem = styled(BaseNavItem).attrs(() => ({ as: "a" }))` - text-decoration: none; -`; - -const CurrentPageItem = styled(BaseNavItem).attrs(() => ({ as: "span" }))` - cursor: inherit; - &:after { - position: absolute; - bottom: 0; - left: 50%; - width: 90%; - height: 3px; - background-color: ${({ theme }) => theme.primary}; - border-radius: ${box.borderRadius}; - transform: translateX(-50%); - content: ""; - } - @media (max-width: ${breakpoints.tablet}) { - &:after { - bottom: auto; - left: 0; - width: 3px; - height: 100%; - transform: none; - } - } -`; + + {currentPage !== "tools" ? ( + + Boîte à outils + + ) : ( + Boîte à outils + )} + {currentPage !== "themes" ? ( + + Thèmes + + ) : ( + Thèmes + )} + + +); -const BurgerWrapper = styled.div` +const StyledBurgerNav = styled(RootBurgerNav)` order: 2; - height: 100%; - & > div { - height: 100%; - } - @media (max-width: ${breakpoints.tablet}) { - height: auto; - } `; diff --git a/packages/code-du-travail-frontend/src/layout/Header/BurgerStyles.js b/packages/code-du-travail-frontend/src/layout/Header/BurgerStyles.js deleted file mode 100644 index 6a73155aae..0000000000 --- a/packages/code-du-travail-frontend/src/layout/Header/BurgerStyles.js +++ /dev/null @@ -1,112 +0,0 @@ -import { createGlobalStyle } from "styled-components"; -import { theme } from "@socialgouv/react-ui"; - -const { box, breakpoints, spacings } = theme; - -const BURGER_BREAKPOINT = `${theme.breakpoints.intTablet + 1}px`; - -export const BurgerStyles = createGlobalStyle` -/* Position and sizing of burger button */ -.bm-burger-button { - @media (min-width: ${BURGER_BREAKPOINT}) { - display: none; - } - @media (max-width: ${breakpoints.mobile}) { - width: 3.2rem; - height: 3.2rem; - } - position: relative; - z-index: auto !important; - width: 5.4rem; - height: 5.4rem; - color: ${({ theme }) => theme.secondary}; - &:hover, &:focus-within { - opacity: 0.6; - } -} - -/* Position and sizing of clickable cross button */ -.bm-cross-button { - @media (min-width: ${BURGER_BREAKPOINT}) { - display: none; - } - @media (max-width: ${breakpoints.mobile}) { - top: ${spacings.base} !important; - right: ${spacings.base} !important; - } -} - -/* Color/shape of close button cross */ -.bm-cross { - width: 2.4rem; - height: 2.4rem; - color: ${({ theme }) => theme.secondary}; -} - -/* -Sidebar wrapper styles -Note: Beware of modifying this element as it can break the animations - you should not need to touch it in most cases -*/ -.bm-menu-wrap { - position: fixed; - top: 0; - left: 0; - z-index: 2 !important; - height: 100%; - opacity: 0.95; - @media (min-width: ${BURGER_BREAKPOINT}) { - position: relative !important; - width: auto !important; - height: 100% !important; - transform: none !important; - } - @media (max-width: ${breakpoints.tablet}) { - width: 30rem !important; - } - @media (max-width: ${breakpoints.mobile}) { - width: 100% !important; - height: auto !important; - padding: ${spacings.small}; - } -} - -/* General sidebar styles */ -.bm-menu { - @media (min-width: ${BURGER_BREAKPOINT}) { - height: 100%; - padding: 0; - background: none; - } - @media (max-width: ${breakpoints.mobile}) { - width: 100% !important; - height: auto !important; - border-radius: ${box.borderRadius}; - box-shadow: ${({ theme }) => box.shadow.default(theme.secondary)}; - } - padding: ${spacings.larger} 0 ${spacings.base} 0; - overflow: visible !important; - background: ${({ theme }) => theme.bgPrimary}; -} - -/* Wrapper for item list */ -.bm-item-list { - @media (min-width: ${BURGER_BREAKPOINT}) { - display: flex; - } - @media (max-width: ${breakpoints.mobile}) { - height: auto !important; - } -} - -/* Styling of overlay */ -.bm-overlay { - top: 0; - left: 0; - z-index: 2 !important; - display: block; - background: rgba(0, 0, 0, 0.3); - @media (min-width: ${BURGER_BREAKPOINT}) { - display: none; - } -} -`; diff --git a/packages/code-du-travail-frontend/src/layout/Header/__tests__/BurgerStyles.test.js b/packages/code-du-travail-frontend/src/layout/Header/__tests__/BurgerStyles.test.js deleted file mode 100644 index ad55e66d82..0000000000 --- a/packages/code-du-travail-frontend/src/layout/Header/__tests__/BurgerStyles.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import React from "react"; -import { render } from "@testing-library/react"; -import { BurgerStyles } from "../BurgerStyles"; -import "jest-styled-components"; -describe("BurgerStyles", () => { - it("generates styles", () => { - render(); - const burgerStyles = document.head.getElementsByTagName("style"); - expect(burgerStyles).toMatchSnapshot(); - }); -}); diff --git a/packages/code-du-travail-frontend/src/layout/Header/__tests__/__snapshots__/BurgerStyles.test.js.snap b/packages/code-du-travail-frontend/src/layout/Header/__tests__/__snapshots__/BurgerStyles.test.js.snap deleted file mode 100644 index d23e0c0ef1..0000000000 --- a/packages/code-du-travail-frontend/src/layout/Header/__tests__/__snapshots__/BurgerStyles.test.js.snap +++ /dev/null @@ -1,77 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`BurgerStyles generates styles 1`] = ` -HTMLCollection [ - @media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -, -] -`; diff --git a/packages/react-fiche-service-public/package.json b/packages/react-fiche-service-public/package.json index 046f4d2942..a14b865d81 100644 --- a/packages/react-fiche-service-public/package.json +++ b/packages/react-fiche-service-public/package.json @@ -21,16 +21,19 @@ "prop-types": "15.x", "react": "16.x", "react-dom": "16.x", - "react-uid": "^2.2.0" + "styled-components": "5.x" }, "dependencies": { - "@socialgouv/react-ui": "^4.16.0" + "@socialgouv/react-ui": "^4.16.0", + "react-uid": "^2.2.0" }, "devDependencies": { "@babel/core": "^7.9.0", "@babel/plugin-proposal-class-properties": "^7.8.3", "@babel/preset-env": "^7.9.0", "@babel/preset-react": "^7.9.4", + "@rollup/plugin-commonjs": "^11.0.2", + "@rollup/plugin-node-resolve": "^7.1.1", "@socialgouv/eslint-config-react": "^0.19.0", "@testing-library/react": "^10.0.1", "babel-jest": "^25.1.0", @@ -42,11 +45,8 @@ "prop-types": "^15.7.2", "react": "^16.13.1", "react-dom": "^16.13.1", - "rollup": "^2.2.0", + "rollup": "^2.3.3", "rollup-plugin-babel": "^4.4.0", - "rollup-plugin-commonjs": "^10.1.0", - "rollup-plugin-node-resolve": "^5.2.0", - "rollup-plugin-replace": "^2.2.0", "styled-components": "^5.0.1", "stylelint": "^13.2.1", "stylelint-config-rational-order": "^0.1.2", diff --git a/packages/react-fiche-service-public/rollup.config.js b/packages/react-fiche-service-public/rollup.config.js index f91cf9a777..31b163f0d0 100644 --- a/packages/react-fiche-service-public/rollup.config.js +++ b/packages/react-fiche-service-public/rollup.config.js @@ -1,6 +1,5 @@ -import commonjs from "rollup-plugin-commonjs"; -import resolve from "rollup-plugin-node-resolve"; -import replace from "rollup-plugin-replace"; +import commonjs from "@rollup/plugin-commonjs"; +import resolve from "@rollup/plugin-node-resolve"; import babel from "rollup-plugin-babel"; export default { @@ -15,17 +14,8 @@ export default { format: "esm", }, ], - external: ["react", "react-dom", "prop-types", "styled-components"], - plugins: [ - babel(), - resolve({ - mainFields: ["module", "jsnext", "jsnext:main", "main"], - }), - commonjs(), - replace({ - "process.env.NODE_ENV": JSON.stringify("production"), - }), - ], + external: ["prop-types", "react", "react-dom", "styled-components"], + plugins: [babel(), resolve(), commonjs()], watch: { include: "src/**", }, diff --git a/packages/react-ui/package.json b/packages/react-ui/package.json index a42a6432b8..aa5307e83c 100644 --- a/packages/react-ui/package.json +++ b/packages/react-ui/package.json @@ -38,6 +38,8 @@ "@babel/plugin-proposal-export-namespace-from": "^7.8.3", "@babel/preset-env": "^7.9.0", "@babel/preset-react": "7.9.4", + "@rollup/plugin-commonjs": "^11.0.2", + "@rollup/plugin-node-resolve": "^7.1.1", "@socialgouv/eslint-config-react": "^0.19.0", "@storybook/addon-a11y": "^5.3.17", "@storybook/addon-actions": "^5.3.17", @@ -59,11 +61,8 @@ "prop-types": "^15.7.2", "react": "^16.13.1", "react-dom": "^16.13.1", - "rollup": "^2.2.0", + "rollup": "^2.3.3", "rollup-plugin-babel": "^4.4.0", - "rollup-plugin-commonjs": "^10.1.0", - "rollup-plugin-node-resolve": "^5.2.0", - "rollup-plugin-replace": "^2.2.0", "styled-components": "^5.0.1", "stylelint": "^13.2.1", "stylelint-config-rational-order": "^0.1.2", diff --git a/packages/react-ui/rollup.config.js b/packages/react-ui/rollup.config.js index be1a18343f..31b163f0d0 100644 --- a/packages/react-ui/rollup.config.js +++ b/packages/react-ui/rollup.config.js @@ -1,6 +1,5 @@ -import commonjs from "rollup-plugin-commonjs"; -import resolve from "rollup-plugin-node-resolve"; -import replace from "rollup-plugin-replace"; +import commonjs from "@rollup/plugin-commonjs"; +import resolve from "@rollup/plugin-node-resolve"; import babel from "rollup-plugin-babel"; export default { @@ -16,16 +15,7 @@ export default { }, ], external: ["prop-types", "react", "react-dom", "styled-components"], - plugins: [ - babel(), - resolve({ - mainFields: ["module", "jsnext", "jsnext:main", "main"], - }), - commonjs(), - replace({ - "process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV), - }), - ], + plugins: [babel(), resolve(), commonjs()], watch: { include: "src/**", }, diff --git a/packages/react-ui/src/BurgerNav/NavItems.js b/packages/react-ui/src/BurgerNav/NavItems.js new file mode 100644 index 0000000000..c566ff7ffb --- /dev/null +++ b/packages/react-ui/src/BurgerNav/NavItems.js @@ -0,0 +1,56 @@ +import styled from "styled-components"; + +import { Button } from "../Button"; +import { box, breakpoints, fonts, spacings } from "../theme"; + +export const BurgerNavButton = styled(Button).attrs(() => ({ + variant: "navLink", +}))` + position: relative; + display: flex !important; + align-items: center; + height: 100%; + padding: 0 ${spacings.base}; + font-weight: normal; + font-size: ${fonts.sizes.default}; + font-family: "Open Sans", sans-serif; + border: none; + @media (max-width: ${breakpoints.tablet}) { + justify-content: center; + width: 100%; + height: 5.4rem; + padding: 0; + font-weight: 600; + font-size: ${fonts.sizes.headings.small}; + } +`; + +export const BurgerNavLink = styled(BurgerNavButton).attrs(() => ({ as: "a" }))` + text-decoration: none; +`; + +export const BurgerNavCurrent = styled(BurgerNavButton).attrs(() => ({ + as: "span", +}))` + cursor: inherit; + &:after { + position: absolute; + bottom: 0; + left: 50%; + width: 90%; + height: 3px; + background-color: ${({ theme }) => theme.primary}; + border-radius: ${box.borderRadius}; + transform: translateX(-50%); + content: ""; + } + @media (max-width: ${breakpoints.tablet}) { + &:after { + bottom: auto; + left: 0; + width: 3px; + height: 100%; + transform: none; + } + } +`; diff --git a/packages/react-ui/src/BurgerNav/index.js b/packages/react-ui/src/BurgerNav/index.js new file mode 100644 index 0000000000..8871e9acfd --- /dev/null +++ b/packages/react-ui/src/BurgerNav/index.js @@ -0,0 +1,132 @@ +import React, { useState, useEffect } from "react"; +import PropTypes from "prop-types"; +import styled from "styled-components"; +import { DialogContent, DialogOverlay } from "@reach/dialog"; +import { X } from "react-feather"; + +import { Button } from "../Button"; +import { Burger as BurgerIcon } from "../icons"; +import { ScreenReaderOnly } from "../ScreenReaderOnly"; +import { box, breakpoints, spacings } from "../theme"; + +const maxTabletWidth = parseInt(breakpoints.tablet.replace("px", ""), 10); + +export const BurgerNav = ({ children, ...props }) => { + const [isDesktop, setIsDesktop] = useState(false); + const [isOpen, setOpen] = useState(false); + + useEffect(() => { + function onResize() { + if ( + document && + document.documentElement && + document.documentElement.clientWidth > maxTabletWidth + ) { + if (!isDesktop) { + setIsDesktop(true); + } + } else if (isDesktop) { + setIsDesktop(false); + } + } + + onResize(); + window.addEventListener("resize", onResize); + return () => { + window.removeEventListener("resize", onResize); + }; + }); + + if (isDesktop) { + return ; + } + + return ( + <> + setOpen(true)} {...props}> + + + setOpen(false)}> + + {children} + setOpen(false)} + > + fermer la modale + + + + + + ); +}; + +BurgerNav.propTypes = { + children: PropTypes.node.isRequired, +}; + +const Nav = styled.nav` + display: flex; + height: 100%; +`; + +const OpenButton = styled(Button)` + height: auto; + padding: 0; +`; + +const StyledBurgerIcon = styled(BurgerIcon)` + width: 5.4rem; + height: 5.4rem; + color: ${({ theme }) => theme.secondary}; + @media (max-width: ${breakpoints.mobile}) { + width: 4.2rem; + height: 4.2rem; + } +`; + +const StyledDialogOverlay = styled(DialogOverlay)` + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 3; + background: rgba(0, 0, 0, 0.5); +`; + +const StyledDialogContent = styled(DialogContent)` + @media (max-width: ${breakpoints.tablet}) { + position: relative; + width: 40vw; + height: calc(100vh - 2 * ${spacings.base}); + margin: ${spacings.base}; + padding: 2rem; + overflow-y: auto; + background: ${({ theme }) => theme.white}; + border-radius: ${box.borderRadius}; + outline: none; + } + @media (max-width: ${breakpoints.mobile}) { + width: calc(100% - 2 * ${spacings.base}); + height: auto; + margin: ${spacings.base}; + } +`; + +const CloseButton = styled(Button)` + @media (max-width: ${breakpoints.tablet}) { + position: absolute; + top: 0; + right: 0; + } + @media (max-width: ${breakpoints.mobile}) { + position: absolute; + top: ${spacings.xsmall}; + right: ${spacings.xsmall}; + } +`; diff --git a/packages/react-ui/src/BurgerNav/story.js b/packages/react-ui/src/BurgerNav/story.js new file mode 100644 index 0000000000..f1ee339e37 --- /dev/null +++ b/packages/react-ui/src/BurgerNav/story.js @@ -0,0 +1,37 @@ +import React from "react"; + +import { Section } from "../layout/Section"; +import { Wrapper } from "../layout/Wrapper"; +import { BurgerNav } from "."; +import { BurgerNavButton, BurgerNavLink, BurgerNavCurrent } from "./NavItems"; + +export default { + component: BurgerNav, + title: "Components|BurgerNav", +}; + +export const base = () => ( + <> +
+

+ The burger nav is only a burger on tablet / mobile. Otherwise it’s + nothing else than a div taking all the height of its container. +

+

+ You should use the provided nav items, even if you could do without (but + that would be hard). +

+
+
+ + + NavButton + + NavLink + + NavCurrent + + +
+ +); diff --git a/packages/react-ui/src/BurgerNav/test.js b/packages/react-ui/src/BurgerNav/test.js new file mode 100644 index 0000000000..ee4b380f46 --- /dev/null +++ b/packages/react-ui/src/BurgerNav/test.js @@ -0,0 +1,19 @@ +import React from "react"; +import { render } from "@testing-library/react"; +import { BurgerNav } from "./index"; +import { BurgerNavButton, BurgerNavCurrent, BurgerNavLink } from "./NavItems"; +import "jest-styled-components"; +describe("BurgerStyles", () => { + it("renders", () => { + const { container } = render( + + ’Till it goes click + + ’Till it goes click + + You said it man + + ); + expect(container).toMatchSnapshot(); + }); +}); diff --git a/packages/react-ui/src/Modal/index.js b/packages/react-ui/src/Modal/index.js index cf9810e088..b824a9115d 100644 --- a/packages/react-ui/src/Modal/index.js +++ b/packages/react-ui/src/Modal/index.js @@ -3,6 +3,7 @@ import PropTypes from "prop-types"; import { DialogContent, DialogOverlay } from "@reach/dialog"; import styled from "styled-components"; import { X } from "react-feather"; + import { box, breakpoints, spacings } from "../theme"; import { Button } from "../Button"; import { ScreenReaderOnly } from "../ScreenReaderOnly"; diff --git a/packages/react-ui/src/index.js b/packages/react-ui/src/index.js index f822d39650..90a27fc4ae 100644 --- a/packages/react-ui/src/index.js +++ b/packages/react-ui/src/index.js @@ -14,6 +14,12 @@ import * as icons from "./icons"; export { Accordion } from "./Accordion"; export { ArrowLink } from "./ArrowLink"; export { Badge } from "./Badge"; +export { BurgerNav } from "./BurgerNav"; +export { + BurgerNavButton, + BurgerNavLink, + BurgerNavCurrent, +} from "./BurgerNav/NavItems"; export { Alert } from "./Alert"; export { Button } from "./Button"; export { GlobalStyles } from "./GlobalStyles"; diff --git a/packages/react-ui/src/theme.js b/packages/react-ui/src/theme.js index b938694cde..582f5a5d71 100644 --- a/packages/react-ui/src/theme.js +++ b/packages/react-ui/src/theme.js @@ -3,7 +3,7 @@ import { darken, getContrast, lighten, rgba } from "polished"; const WCAG_AA_MINIMAL_CONTRAST = 3; const BORDER_BLACK_CONTRAST = 12.62; -const maximiseContrast = color => { +const maximiseContrast = (color) => { const whiteContrast = getContrast(color, "#fff"); const blackContrast = getContrast(color, "#000"); if ( @@ -49,7 +49,7 @@ export const blackAndWhiteColors = Object.entries(colors).reduce( blackAndWhiteColors[colorName] = maximiseContrast(colorValue); return blackAndWhiteColors; }, - { noColors: true }, + { noColors: true } ); /* Rem with a 10px base */ diff --git a/yarn.lock b/yarn.lock index 88acf2adec..dbb3a2f1d2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2472,6 +2472,35 @@ dependencies: tslib "^1.10.0" +"@rollup/plugin-commonjs@^11.0.2": + version "11.0.2" + resolved "https://registry.yarnpkg.com/@rollup/plugin-commonjs/-/plugin-commonjs-11.0.2.tgz#837cc6950752327cb90177b608f0928a4e60b582" + integrity sha512-MPYGZr0qdbV5zZj8/2AuomVpnRVXRU5XKXb3HVniwRoRCreGlf5kOE081isNWeiLIi6IYkwTX9zE0/c7V8g81g== + dependencies: + "@rollup/pluginutils" "^3.0.0" + estree-walker "^1.0.1" + is-reference "^1.1.2" + magic-string "^0.25.2" + resolve "^1.11.0" + +"@rollup/plugin-node-resolve@^7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@rollup/plugin-node-resolve/-/plugin-node-resolve-7.1.1.tgz#8c6e59c4b28baf9d223028d0e450e06a485bb2b7" + integrity sha512-14ddhD7TnemeHE97a4rLOhobfYvUVcaYuqTnL8Ti7Jxi9V9Jr5LY7Gko4HZ5k4h4vqQM0gBQt6tsp9xXW94WPA== + dependencies: + "@rollup/pluginutils" "^3.0.6" + "@types/resolve" "0.0.8" + builtin-modules "^3.1.0" + is-module "^1.0.0" + resolve "^1.14.2" + +"@rollup/pluginutils@^3.0.0", "@rollup/pluginutils@^3.0.6": + version "3.0.8" + resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-3.0.8.tgz#4e94d128d94b90699e517ef045422960d18c8fde" + integrity sha512-rYGeAc4sxcZ+kPG/Tw4/fwJODC3IXHYDH4qusdN/b6aLw5LPUbzpecYbEJh4sVQGPFJxd2dBU4kc1H3oy9/bnw== + dependencies: + estree-walker "^1.0.1" + "@sentry/apm@5.15.0": version "5.15.0" resolved "https://registry.yarnpkg.com/@sentry/apm/-/apm-5.15.0.tgz#76972fce07793a28203704f3aaf6b7916d07d562" @@ -4064,11 +4093,6 @@ ajv@^6.1.0, ajv@^6.10.0, ajv@^6.10.2, ajv@^6.12.0, ajv@^6.5.5: json-schema-traverse "^0.4.1" uri-js "^4.2.2" -amdefine@>=0.0.4: - version "1.0.1" - resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5" - integrity sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU= - amphtml-validator@1.0.30: version "1.0.30" resolved "https://registry.yarnpkg.com/amphtml-validator/-/amphtml-validator-1.0.30.tgz#b722ea5e965d0cc028cbdc360fc76b97e669715e" @@ -4407,15 +4431,6 @@ assign-symbols@^1.0.0: resolved "https://registry.yarnpkg.com/assign-symbols/-/assign-symbols-1.0.0.tgz#59667f41fadd4f20ccbc2bb96b8d4f7f78ec0367" integrity sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c= -ast-transform@0.0.0: - version "0.0.0" - resolved "https://registry.yarnpkg.com/ast-transform/-/ast-transform-0.0.0.tgz#74944058887d8283e189d954600947bc98fe0062" - integrity sha1-dJRAWIh9goPhidlUYAlHvJj+AGI= - dependencies: - escodegen "~1.2.0" - esprima "~1.0.4" - through "~2.3.4" - ast-types-flow@0.0.7, ast-types-flow@^0.0.7: version "0.0.7" resolved "https://registry.yarnpkg.com/ast-types-flow/-/ast-types-flow-0.0.7.tgz#f70b735c6bca1a5c9c22d982c3e39e7feba3bdad" @@ -4431,11 +4446,6 @@ ast-types@0.13.2, ast-types@^0.13.2: resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.13.2.tgz#df39b677a911a83f3a049644fb74fdded23cea48" integrity sha512-uWMHxJxtfj/1oZClOxDEV1sQ1HCDkA4MG8Gr69KKeBjEVH0R84WlejZ0y2DcwyBlpAEMltmVYkVgqfLFb2oyiA== -ast-types@^0.7.0: - version "0.7.8" - resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.7.8.tgz#902d2e0d60d071bdcd46dc115e1809ed11c138a9" - integrity sha1-kC0uDWDQcb3NRtwRXhgJ7RHBOKk= - astral-regex@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-1.0.0.tgz#6c8c3fb827dd43ee3918f27b82782ab7658a6fd9" @@ -5196,7 +5206,7 @@ browser-process-hrtime@^1.0.0: resolved "https://registry.yarnpkg.com/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz#3c9b4b7d782c8121e56f10106d84c0d0ffc94626" integrity sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow== -browser-resolve@^1.11.3, browser-resolve@^1.8.1: +browser-resolve@^1.11.3: version "1.11.3" resolved "https://registry.yarnpkg.com/browser-resolve/-/browser-resolve-1.11.3.tgz#9b7cbb3d0f510e4cb86bdbd796124d28b5890af6" integrity sha512-exDi1BYWB/6raKHmDTCicQfTkqwN5fioMFV4j8BsfMU4R2DK/QfZfK7kOVkmWCNANf0snkBzqGqAJBao9gZMdQ== @@ -5234,15 +5244,6 @@ browserify-des@^1.0.0: inherits "^2.0.1" safe-buffer "^5.1.2" -browserify-optional@^1.0.0: - version "1.0.1" - resolved "https://registry.yarnpkg.com/browserify-optional/-/browserify-optional-1.0.1.tgz#1e13722cfde0d85f121676c2a72ced533a018869" - integrity sha1-HhNyLP3g2F8SFnbCpyztUzoBiGk= - dependencies: - ast-transform "0.0.0" - ast-types "^0.7.0" - browser-resolve "^1.8.1" - browserify-rsa@^4.0.0: version "4.0.1" resolved "https://registry.yarnpkg.com/browserify-rsa/-/browserify-rsa-4.0.1.tgz#21e0abfaf6f2029cf2fafb133567a701d4135524" @@ -5837,7 +5838,7 @@ class-utils@^0.3.5: isobject "^3.0.0" static-extend "^0.1.1" -classnames@^2.2.0, classnames@^2.2.5, classnames@^2.2.6: +classnames@^2.2.0, classnames@^2.2.5: version "2.2.6" resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.2.6.tgz#43935bffdd291f326dad0a205309b38d00f650ce" integrity sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q== @@ -7750,17 +7751,6 @@ escodegen@^1.11.1, escodegen@^1.14.1: optionalDependencies: source-map "~0.6.1" -escodegen@~1.2.0: - version "1.2.0" - resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.2.0.tgz#09de7967791cc958b7f89a2ddb6d23451af327e1" - integrity sha1-Cd55Z3kcyVi3+Jot220jRRrzJ+E= - dependencies: - esprima "~1.0.4" - estraverse "~1.5.0" - esutils "~1.0.0" - optionalDependencies: - source-map "~0.1.30" - eslint-config-prettier@~6.10.0: version "6.10.1" resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-6.10.1.tgz#129ef9ec575d5ddc0e269667bf09defcd898642a" @@ -7951,11 +7941,6 @@ esprima@^4.0.0, esprima@^4.0.1, esprima@~4.0.0: resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71" integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A== -esprima@~1.0.4: - version "1.0.4" - resolved "https://registry.yarnpkg.com/esprima/-/esprima-1.0.4.tgz#9f557e08fc3b4d26ece9dd34f8fbf476b62585ad" - integrity sha1-n1V+CPw7TSbs6d00+Pv0drYlha0= - esquery@^1.0.1: version "1.2.0" resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.2.0.tgz#a010a519c0288f2530b3404124bfb5f02e9797fe" @@ -7980,36 +7965,26 @@ estraverse@^5.0.0: resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.0.0.tgz#ac81750b482c11cca26e4b07e83ed8f75fbcdc22" integrity sha512-j3acdrMzqrxmJTNj5dbr1YbjacrYgAxVMeF0gK16E3j494mOe7xygM/ZLIguEQ0ETwAg2hlJCtHRGav+y0Ny5A== -estraverse@~1.5.0: - version "1.5.1" - resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-1.5.1.tgz#867a3e8e58a9f84618afb6c2ddbcd916b7cbaf71" - integrity sha1-hno+jlip+EYYr7bC3bzZFrfLr3E= - estree-walker@^0.6.1: version "0.6.1" resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-0.6.1.tgz#53049143f40c6eb918b23671d1fe3219f3a1b362" integrity sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w== +estree-walker@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-1.0.1.tgz#31bc5d612c96b704106b477e6dd5d8aa138cb700" + integrity sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg== + esutils@^2.0.2: version "2.0.3" resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64" integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g== -esutils@~1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/esutils/-/esutils-1.0.0.tgz#8151d358e20c8acc7fb745e7472c0025fe496570" - integrity sha1-gVHTWOIMisx/t0XnRywAJf5JZXA= - etag@1.8.1, etag@~1.8.1: version "1.8.1" resolved "https://registry.yarnpkg.com/etag/-/etag-1.8.1.tgz#41ae2eeb65efa62268aebfea83ac7d79299b0887" integrity sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc= -eve@~0.5.1: - version "0.5.4" - resolved "https://registry.yarnpkg.com/eve/-/eve-0.5.4.tgz#67d080b9725291d7e389e34c26860dd97f1debaa" - integrity sha1-Z9CAuXJSkdfjieNMJoYN2X8d66o= - event-emitter@^0.3.5: version "0.3.5" resolved "https://registry.yarnpkg.com/event-emitter/-/event-emitter-0.3.5.tgz#df8c69eef1647923c7157b9ce83840610b02cc39" @@ -15306,17 +15281,6 @@ react-autowhatever@^10.1.2: react-themeable "^1.1.0" section-iterator "^2.0.0" -react-burger-menu@^2.6.13: - version "2.6.13" - resolved "https://registry.yarnpkg.com/react-burger-menu/-/react-burger-menu-2.6.13.tgz#51b86eb35076c5fbe80027e2ce4c58bd6708f724" - integrity sha512-tloQs8F2+YHR/FYfQpu4z+OQzgGHzUZYZXBxGmb6/6eckjQ1GvzeNpHp4IZigpe0ovamg1HgDRK3qNlOPezjlA== - dependencies: - browserify-optional "^1.0.0" - classnames "^2.2.6" - eve "~0.5.1" - prop-types "^15.7.2" - snapsvg-cjs "0.0.6" - react-clientside-effect@^1.2.2: version "1.2.2" resolved "https://registry.yarnpkg.com/react-clientside-effect/-/react-clientside-effect-1.2.2.tgz#6212fb0e07b204e714581dd51992603d1accc837" @@ -16426,7 +16390,7 @@ resolve@1.1.7: resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b" integrity sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs= -resolve@^1.1.6, resolve@^1.10.0, resolve@^1.11.0, resolve@^1.11.1, resolve@^1.12.0, resolve@^1.13.1, resolve@^1.15.1, resolve@^1.3.2, resolve@^1.8.1: +resolve@^1.1.6, resolve@^1.10.0, resolve@^1.11.0, resolve@^1.12.0, resolve@^1.13.1, resolve@^1.14.2, resolve@^1.15.1, resolve@^1.3.2, resolve@^1.8.1: version "1.15.1" resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.15.1.tgz#27bdcdeffeaf2d6244b95bb0f9f4b4653451f3e8" integrity sha512-84oo6ZTtoTUpjgNEr5SJyzQhzL72gaRodsSfyxC/AXRvwu0Yse9H8eF9IpGo7b8YetZhlI6v7ZQ6bKBFV/6S7w== @@ -16519,47 +16483,17 @@ rollup-plugin-babel@^4.4.0: "@babel/helper-module-imports" "^7.0.0" rollup-pluginutils "^2.8.1" -rollup-plugin-commonjs@^10.1.0: - version "10.1.0" - resolved "https://registry.yarnpkg.com/rollup-plugin-commonjs/-/rollup-plugin-commonjs-10.1.0.tgz#417af3b54503878e084d127adf4d1caf8beb86fb" - integrity sha512-jlXbjZSQg8EIeAAvepNwhJj++qJWNJw1Cl0YnOqKtP5Djx+fFGkp3WRh+W0ASCaFG5w1jhmzDxgu3SJuVxPF4Q== - dependencies: - estree-walker "^0.6.1" - is-reference "^1.1.2" - magic-string "^0.25.2" - resolve "^1.11.0" - rollup-pluginutils "^2.8.1" - -rollup-plugin-node-resolve@^5.2.0: - version "5.2.0" - resolved "https://registry.yarnpkg.com/rollup-plugin-node-resolve/-/rollup-plugin-node-resolve-5.2.0.tgz#730f93d10ed202473b1fb54a5997a7db8c6d8523" - integrity sha512-jUlyaDXts7TW2CqQ4GaO5VJ4PwwaV8VUGA7+km3n6k6xtOEacf61u0VXwN80phY/evMcaS+9eIeJ9MOyDxt5Zw== - dependencies: - "@types/resolve" "0.0.8" - builtin-modules "^3.1.0" - is-module "^1.0.0" - resolve "^1.11.1" - rollup-pluginutils "^2.8.1" - -rollup-plugin-replace@^2.2.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/rollup-plugin-replace/-/rollup-plugin-replace-2.2.0.tgz#f41ae5372e11e7a217cde349c8b5d5fd115e70e3" - integrity sha512-/5bxtUPkDHyBJAKketb4NfaeZjL5yLZdeUihSfbF2PQMz+rSTEb8ARKoOl3UBT4m7/X+QOXJo3sLTcq+yMMYTA== - dependencies: - magic-string "^0.25.2" - rollup-pluginutils "^2.6.0" - -rollup-pluginutils@^2.6.0, rollup-pluginutils@^2.8.1: +rollup-pluginutils@^2.8.1: version "2.8.2" resolved "https://registry.yarnpkg.com/rollup-pluginutils/-/rollup-pluginutils-2.8.2.tgz#72f2af0748b592364dbd3389e600e5a9444a351e" integrity sha512-EEp9NhnUkwY8aif6bxgovPHMoMoNr2FulJziTndpt5H9RdwC47GSGuII9XxpSdzVGM0GWrNPHV6ie1LTNJPaLQ== dependencies: estree-walker "^0.6.1" -rollup@^2.2.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.2.0.tgz#d82cfd6eda6d9561593a7e8a2fc0b72811a89b49" - integrity sha512-iAu/j9/WJ0i+zT0sAMuQnsEbmOKzdQ4Yxu5rbPs9aUCyqveI1Kw3H4Fi9NWfCOpb8luEySD2lDyFWL9CrLE8iw== +rollup@^2.3.3: + version "2.3.3" + resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.3.3.tgz#5982df700d7aae8907075ba68122bb57d98e9cd0" + integrity sha512-uJ9VNWk80mb4wDCSfd1AyHoSc9TrWbkZtnO6wbsMTp9muSWkT26Dvc99MX1yGCOTvUN1Skw/KpFzKdUDuZKTXA== optionalDependencies: fsevents "~2.1.2" @@ -17049,20 +16983,6 @@ snapdragon@^0.8.1: source-map-resolve "^0.5.0" use "^3.1.0" -snapsvg-cjs@0.0.6: - version "0.0.6" - resolved "https://registry.yarnpkg.com/snapsvg-cjs/-/snapsvg-cjs-0.0.6.tgz#3b2f56af2573d3d364c3ed5bf8885745f4d2dde1" - integrity sha1-Oy9WryVz09Nkw+1b+IhXRfTS3eE= - dependencies: - snapsvg "0.5.1" - -snapsvg@0.5.1: - version "0.5.1" - resolved "https://registry.yarnpkg.com/snapsvg/-/snapsvg-0.5.1.tgz#0caf52c79189a290746fc446cc5e863f6bdddfe3" - integrity sha1-DK9Sx5GJopB0b8RGzF6GP2vd3+M= - dependencies: - eve "~0.5.1" - sntp@1.x.x: version "1.0.9" resolved "https://registry.yarnpkg.com/sntp/-/sntp-1.0.9.tgz#6541184cc90aeea6c6e7b35e2659082443c66198" @@ -17192,13 +17112,6 @@ source-map@^0.5.0, source-map@^0.5.6, source-map@^0.5.7: resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc" integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w= -source-map@~0.1.30: - version "0.1.43" - resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.1.43.tgz#c24bc146ca517c1471f5dacbe2571b2b7f9e3346" - integrity sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y= - dependencies: - amdefine ">=0.0.4" - sourcemap-codec@^1.4.4: version "1.4.8" resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4" @@ -18302,7 +18215,7 @@ through2@^3.0.0: dependencies: readable-stream "2 || 3" -through@2, "through@>=2.2.7 <3", through@^2.3.4, through@^2.3.6, through@~2.3.4: +through@2, "through@>=2.2.7 <3", through@^2.3.4, through@^2.3.6: version "2.3.8" resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5" integrity sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU= From 09036bee8de9912d90e97df1ab38456e0114fbc3 Mon Sep 17 00:00:00 2001 From: ManuC Date: Thu, 9 Apr 2020 00:46:06 +0200 Subject: [PATCH 2/5] text(front): udpate snapshots --- .../__snapshots__/a-propos.test.js.snap | 404 +++----- .../code-du-travail.test.js.snap | 438 +++----- .../__snapshots__/contribution.test.js.snap | 808 ++++++--------- .../convention-collective.test.js.snap | 34 +- .../droit-du-travail.test.js.snap | 414 +++----- .../fiche-ministere-travail.test.js.snap | 404 +++----- .../fiche-service-public.test.js.snap | 438 +++----- .../glossaire-[slug].test.js.snap | 404 +++----- .../__snapshots__/glossaire.test.js.snap | 406 +++----- .../__snapshots__/index.test.js.snap | 420 +++----- .../mentions-legales.test.js.snap | 404 +++----- .../modeles-de-courriers-[slug].test.js.snap | 404 +++----- .../modeles-de-courriers.test.js.snap | 406 +++----- .../__snapshots__/outils.test.js.snap | 960 +++++++----------- .../politique-confidentialite.test.js.snap | 404 +++----- .../__snapshots__/recherche.test.js.snap | 404 +++----- .../__snapshots__/stats.test.js.snap | 404 +++----- .../__snapshots__/themes.test.js.snap | 404 +++----- .../__snapshots__/Answer.test.js.snap | 2 +- .../__snapshots__/RelatedItems.test.js.snap | 2 +- .../__snapshots__/index.test.js.snap | 46 +- .../__snapshots__/Highlights.test.js.snap | 4 +- .../__snapshots__/Footer.test.js.snap | 6 +- .../__snapshots__/Header.test.js.snap | 307 ++---- .../__snapshots__/Layout.test.js.snap | 404 +++----- .../__snapshots__/SearchResults.test.js.snap | 10 +- .../FicheServicePublic.test.js.snap | 4 +- .../__snapshots__/ServiceEnLigne.test.js.snap | 2 +- .../src/BurgerNav/__snapshots__/test.js.snap | 115 +++ 29 files changed, 3291 insertions(+), 5571 deletions(-) create mode 100644 packages/react-ui/src/BurgerNav/__snapshots__/test.js.snap diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/a-propos.test.js.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/a-propos.test.js.snap index 6c8144fd27..13c525bf38 100644 --- a/packages/code-du-travail-frontend/__tests__/__snapshots__/a-propos.test.js.snap +++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/a-propos.test.js.snap @@ -51,7 +51,7 @@ exports[` should render 1`] = ` margin-bottom: 0; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -79,27 +79,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -228,6 +240,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c50 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c50:focus, +.c50:hover, +.c50:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c25 { position: absolute; background-color: #7994d4; @@ -409,52 +483,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -640,7 +671,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c50 { +.c51 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -659,7 +690,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c51 { +.c52 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -667,7 +698,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c52 { +.c53 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -748,11 +779,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -771,6 +808,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c50 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c31 { font-size: 1.6rem; @@ -850,40 +900,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1062,59 +1078,11 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c52 { + .c53 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
-
-
+ -
-
- -
-
-
- - - - -
-
-
-
-
- - - - -
-
-
-
+ + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -1702,7 +1588,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` color: #3e486e; } -.c24 { - margin-bottom: 1.6rem; - padding: 1rem 2rem; - color: #3e486e; - background-color: #f2f5fa; - border: 1px solid #f2f5fa; - border-radius: 0.6rem; -} - -.c24 > *:first-child { - margin-top: 0; -} - -.c24 > *:last-child { - margin-bottom: 0; -} - -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -58,27 +41,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -270,6 +265,85 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c53 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c53:focus, +.c53:hover, +.c53:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + +.c24 { + margin-bottom: 1.6rem; + padding: 1rem 2rem; + color: #3e486e; + background-color: #f2f5fa; + border: 1px solid #f2f5fa; + border-radius: 0.6rem; +} + +.c24 > *:first-child { + margin-top: 0; +} + +.c24 > *:last-child { + margin-bottom: 0; +} + .c30 { position: absolute; background-color: #f66663; @@ -504,52 +578,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -735,7 +766,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c53 { +.c54 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -754,7 +785,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c54 { +.c55 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -762,7 +793,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c55 { +.c56 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -817,11 +848,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -852,6 +889,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c53 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c28 { margin-left: -1rem; @@ -999,40 +1049,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1211,59 +1227,11 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c55 { + .c56 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -1718,7 +1604,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render with external content 1`] = ` height: 3rem; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -119,27 +119,39 @@ exports[` should render with external content 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -331,6 +343,68 @@ exports[` should render with external content 1`] = ` cursor: not-allowed; } +.c86 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c86:focus, +.c86:hover, +.c86:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c22 { position: relative; overflow: hidden; @@ -931,52 +1005,9 @@ exports[` should render with external content 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -1162,7 +1193,7 @@ exports[` should render with external content 1`] = ` cursor: pointer; } -.c86 { +.c87 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -1181,7 +1212,7 @@ exports[` should render with external content 1`] = ` background-color: #e4e8ef; } -.c87 { +.c88 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -1189,7 +1220,7 @@ exports[` should render with external content 1`] = ` margin: 0 1rem 1rem 1rem; } -.c88 { +.c89 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -1270,11 +1301,17 @@ exports[` should render with external content 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -1305,6 +1342,19 @@ exports[` should render with external content 1`] = ` } } +@media (max-width:600px) { + .c86 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c22 { overflow-x: hidden; @@ -1604,40 +1654,6 @@ exports[` should render with external content 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1816,59 +1832,11 @@ exports[` should render with external content 1`] = ` } @media (max-width:980px) { - .c88 { + .c89 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render with external content 1`] = `
-
- + + should render with external content 1`] = ` Code du travail numérique
  • should render with external content 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -2667,7 +2553,7 @@ exports[` should render with external content 1`] = ` En collaboration avec
      • should render with external content 1`] = `
should render with external content 1`] = ` should render with external content 1`] = ` should render with external content 1`] = ` should render with external content 1`] = ` should render with external content 1`] = ` should render without external content 1`] = ` height: 3rem; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -2918,27 +2804,39 @@ exports[` should render without external content 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; +} + +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -3130,6 +3028,68 @@ exports[` should render without external content 1`] = ` cursor: not-allowed; } +.c86 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c86:focus, +.c86:hover, +.c86:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c22 { position: relative; overflow: hidden; @@ -3730,52 +3690,9 @@ exports[` should render without external content 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -3961,7 +3878,7 @@ exports[` should render without external content 1`] = ` cursor: pointer; } -.c86 { +.c87 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -3980,7 +3897,7 @@ exports[` should render without external content 1`] = ` background-color: #e4e8ef; } -.c87 { +.c88 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -3988,7 +3905,7 @@ exports[` should render without external content 1`] = ` margin: 0 1rem 1rem 1rem; } -.c88 { +.c89 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -4069,11 +3986,17 @@ exports[` should render without external content 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -4104,6 +4027,19 @@ exports[` should render without external content 1`] = ` } } +@media (max-width:600px) { + .c86 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c22 { overflow-x: hidden; @@ -4403,40 +4339,6 @@ exports[` should render without external content 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -4615,59 +4517,11 @@ exports[` should render without external content 1`] = ` } @media (max-width:980px) { - .c88 { + .c89 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render without external content 1`] = `
-
- + + should render without external content 1`] = ` Code du travail numérique
  • should render without external content 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -5466,7 +5238,7 @@ exports[` should render without external content 1`] = ` En collaboration avec
      • should render without external content 1`] = `
should render without external content 1`] = ` should render without external content 1`] = ` should render without external content 1`] = ` should render without external content 1`] = ` should render without external content 1`] = ` should render 1`] = ` color: #3e486e; } -.c3 { - margin-bottom: 1.6rem; - padding: 1rem 2rem; - color: #3e486e; - background-color: #f2f5fa; - border: 1px solid #f2f5fa; - border-radius: 0.6rem; -} - -.c3 > *:first-child { - margin-top: 0; -} - -.c3 > *:last-child { - margin-bottom: 0; -} - .c11 { display: -webkit-inline-box; display: -webkit-inline-flex; @@ -93,6 +76,23 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c3 { + margin-bottom: 1.6rem; + padding: 1rem 2rem; + color: #3e486e; + background-color: #f2f5fa; + border: 1px solid #f2f5fa; + border-radius: 0.6rem; +} + +.c3 > *:first-child { + margin-top: 0; +} + +.c3 > *:last-child { + margin-bottom: 0; +} + .c9 { position: absolute; background-color: #f66663; diff --git a/packages/code-du-travail-frontend/__tests__/__snapshots__/droit-du-travail.test.js.snap b/packages/code-du-travail-frontend/__tests__/__snapshots__/droit-du-travail.test.js.snap index f7431f1128..6e0a6f8902 100644 --- a/packages/code-du-travail-frontend/__tests__/__snapshots__/droit-du-travail.test.js.snap +++ b/packages/code-du-travail-frontend/__tests__/__snapshots__/droit-du-travail.test.js.snap @@ -698,7 +698,7 @@ exports[` should render 1`] = ` margin-bottom: 0; } -.c11 { +.c10 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -726,27 +726,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c10:link, +.c10:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c11:focus, -.c11:hover, -.c11:active { - color: #f66663; +.c10:not([disabled]):hover, +.c10:not([disabled]):active, +.c10:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c10[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c19 { @@ -923,6 +935,57 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c105 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c105:focus, +.c105:hover, +.c105:active { + color: #f66663; +} + .c85 { width: 2.6rem; height: 1.4rem; @@ -932,12 +995,23 @@ exports[` should render 1`] = ` transition: transform 250ms linear; } -.c10:hover .c85 { +.c9:hover .c85 { -webkit-transform: translateX(4px); -ms-transform: translateX(4px); transform: translateX(4px); } +.c11 { + height: auto; + padding: 0; +} + +.c13 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c35 { display: -webkit-box; display: -webkit-flex; @@ -1186,52 +1260,9 @@ exports[` should render 1`] = ` } .c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c13 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -1417,7 +1448,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c105 { +.c106 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -1436,7 +1467,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c106 { +.c107 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -1444,7 +1475,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c107 { +.c108 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -1833,11 +1864,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c11 { + .c10 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c10 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c19 { font-size: 1.4rem; @@ -1862,6 +1899,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c105 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c13 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c36 { width: 3.4rem; @@ -1981,40 +2031,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c13 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -2193,7 +2209,7 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c107 { + .c108 { display: none; } } @@ -2225,54 +2241,6 @@ exports[` should render 1`] = ` } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` />
@@ -5156,7 +5042,7 @@ exports[` should render 1`] = ` En collaboration avec
  • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` margin-bottom: 0; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -157,27 +157,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -369,6 +381,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c80 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c80:focus, +.c80:hover, +.c80:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c22 { position: relative; overflow: hidden; @@ -772,52 +846,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -1003,7 +1034,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c80 { +.c81 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -1022,7 +1053,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c81 { +.c82 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -1030,7 +1061,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c82 { +.c83 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -1131,11 +1162,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -1166,6 +1203,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c80 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c22 { overflow-x: hidden; @@ -1406,40 +1456,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1618,59 +1634,11 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c82 { + .c83 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -2370,7 +2256,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` color: #3e486e; } -.c24 { - margin-bottom: 1.6rem; - padding: 1rem 2rem; - color: #3e486e; - background-color: #f2f5fa; - border: 1px solid #f2f5fa; - border-radius: 0.6rem; -} - -.c24 > *:first-child { - margin-top: 0; -} - -.c24 > *:last-child { - margin-bottom: 0; -} - -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -58,27 +41,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -270,6 +265,85 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c53 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c53:focus, +.c53:hover, +.c53:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + +.c24 { + margin-bottom: 1.6rem; + padding: 1rem 2rem; + color: #3e486e; + background-color: #f2f5fa; + border: 1px solid #f2f5fa; + border-radius: 0.6rem; +} + +.c24 > *:first-child { + margin-top: 0; +} + +.c24 > *:last-child { + margin-bottom: 0; +} + .c30 { position: absolute; background-color: #f66663; @@ -504,52 +578,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -735,7 +766,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c53 { +.c54 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -754,7 +785,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c54 { +.c55 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -762,7 +793,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c55 { +.c56 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -817,11 +848,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -852,6 +889,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c53 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c28 { margin-left: -1rem; @@ -999,40 +1049,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1211,59 +1227,11 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c55 { + .c56 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -1725,7 +1611,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` margin-bottom: 0; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -79,27 +79,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -228,6 +240,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c48 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c48:focus, +.c48:hover, +.c48:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c27 { position: relative; overflow: hidden; @@ -432,52 +506,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -663,7 +694,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c48 { +.c49 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -682,7 +713,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c49 { +.c50 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -690,7 +721,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c50 { +.c51 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -771,11 +802,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -794,6 +831,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c48 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c27 { overflow-x: hidden; @@ -861,40 +911,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1073,59 +1089,11 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c50 { + .c51 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -1593,7 +1479,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` margin-bottom: 0; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -79,27 +79,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -228,6 +240,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c51 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c51:focus, +.c51:hover, +.c51:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c25 { position: absolute; background-color: #7994d4; @@ -399,52 +473,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -630,7 +661,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c51 { +.c52 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -649,7 +680,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c52 { +.c53 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -657,7 +688,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c53 { +.c54 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -751,11 +782,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -774,6 +811,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c51 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c46 { font-size: 1.6rem; @@ -847,40 +897,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1059,7 +1075,7 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c53 { + .c54 { display: none; } } @@ -1070,54 +1086,6 @@ exports[` should render 1`] = ` } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` height: 3rem; } -.c11 { +.c10 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -72,27 +72,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c10:link, +.c10:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c11:focus, -.c11:hover, -.c11:active { - color: #f66663; +.c10:not([disabled]):hover, +.c10:not([disabled]):active, +.c10:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c10[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c29 { @@ -269,6 +281,57 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c75 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c75:focus, +.c75:hover, +.c75:active { + color: #f66663; +} + .c55 { width: 2.6rem; height: 1.4rem; @@ -278,12 +341,23 @@ exports[` should render 1`] = ` transition: transform 250ms linear; } -.c10:hover .c55 { +.c9:hover .c55 { -webkit-transform: translateX(4px); -ms-transform: translateX(4px); transform: translateX(4px); } +.c11 { + height: auto; + padding: 0; +} + +.c13 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c38 { position: relative; overflow: visible; @@ -595,52 +669,9 @@ exports[` should render 1`] = ` } .c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c13 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -805,7 +836,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c75 { +.c76 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -824,7 +855,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c76 { +.c77 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -832,7 +863,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c77 { +.c78 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -1018,11 +1049,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c11 { + .c10 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c10 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c29 { font-size: 1.4rem; @@ -1053,6 +1090,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c75 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c13 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c38 { overflow-x: hidden; @@ -1209,40 +1259,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c13 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1398,7 +1414,7 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c77 { + .c78 { display: none; } } @@ -1513,54 +1529,6 @@ exports[` should render 1`] = ` } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + +
@@ -1816,7 +1702,7 @@ exports[` should render 1`] = ` />
@@ -3158,7 +3044,7 @@ exports[` should render 1`] = ` En collaboration avec
  • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` margin-bottom: 0; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -79,27 +79,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -228,6 +240,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c51 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c51:focus, +.c51:hover, +.c51:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c25 { position: absolute; background-color: #7994d4; @@ -403,52 +477,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -634,7 +665,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c51 { +.c52 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -653,7 +684,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c52 { +.c53 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -661,7 +692,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c53 { +.c54 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -764,11 +795,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -787,6 +824,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c51 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c32 { font-size: 1.6rem; @@ -860,40 +910,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1072,7 +1088,7 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c53 { + .c54 { display: none; } } @@ -1090,54 +1106,6 @@ exports[` should render 1`] = ` } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -1707,7 +1593,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` height: 3rem; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -115,27 +115,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -453,6 +465,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c80 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c80:focus, +.c80:hover, +.c80:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c22 { position: relative; overflow: hidden; @@ -856,52 +930,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -1087,7 +1118,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c80 { +.c81 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -1106,7 +1137,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c81 { +.c82 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -1114,7 +1145,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c82 { +.c83 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -1244,11 +1275,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -1297,6 +1334,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c80 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c22 { overflow-x: hidden; @@ -1531,40 +1581,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1743,7 +1759,7 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c82 { + .c83 { display: none; } } @@ -1774,54 +1790,6 @@ exports[` should render 1`] = ` } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -2469,7 +2355,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` height: 3rem; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -79,27 +79,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -228,6 +240,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c60 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c60:focus, +.c60:hover, +.c60:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c25 { position: absolute; background-color: #7994d4; @@ -518,52 +592,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -749,7 +780,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c60 { +.c61 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -768,7 +799,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c61 { +.c62 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -776,7 +807,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c62 { +.c63 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -863,11 +894,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -886,6 +923,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c60 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c33 { font-size: 1.6rem; @@ -959,40 +1009,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1171,59 +1187,11 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c62 { + .c63 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = `

    should render 1`] = ` Code du travail numérique

    • should render 1`] = ` Aidez-nous à améliorer cet outil
      • @@ -1830,7 +1716,7 @@ exports[` should render 1`] = ` En collaboration avec
        • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` -.c24 { +.c23 { max-width: 124rem; margin: 0 auto; padding: 0 2rem; } -.c23 { +.c22 { padding: 3.2rem 0; background-color: transparent; color: #3e486e; } -.c34 { +.c33 { position: absolute; top: 0; right: 0; @@ -24,7 +24,7 @@ exports[` should render 1`] = ` border-radius: 0 0.6rem 0 0; } -.c34:before { +.c33:before { position: absolute; display: block; width: 0; @@ -35,7 +35,7 @@ exports[` should render 1`] = ` content: ""; } -.c35 { +.c34 { position: absolute; top: 0; right: 0; @@ -44,7 +44,7 @@ exports[` should render 1`] = ` height: 3rem; } -.c11 { +.c10 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -72,30 +72,42 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c10:link, +.c10:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c11:focus, -.c11:hover, -.c11:active { - color: #f66663; +.c10:not([disabled]):hover, +.c10:not([disabled]):active, +.c10:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; } -.c20 { +.c10[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; +} + +.c19 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -132,16 +144,16 @@ exports[` should render 1`] = ` opacity: 1; } -.c20:link, -.c20:visited { +.c19:link, +.c19:visited { -webkit-text-decoration: none; text-decoration: none; color: #3e486e; } -.c20:not([disabled]):hover, -.c20:not([disabled]):active, -.c20:not([disabled]):focus { +.c19:not([disabled]):hover, +.c19:not([disabled]):active, +.c19:not([disabled]):focus { opacity: 0.6; -webkit-transform: translateY(-2px); -ms-transform: translateY(-2px); @@ -150,7 +162,7 @@ exports[` should render 1`] = ` border-color: transparent; } -.c20[disabled] { +.c19[disabled] { background-color: #e4e8ef; border-color: #e4e8ef; color: #9298af; @@ -158,7 +170,7 @@ exports[` should render 1`] = ` cursor: not-allowed; } -.c44 { +.c43 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -199,14 +211,14 @@ exports[` should render 1`] = ` overflow: visible; } -.c44:focus, -.c44:hover, -.c44:active { +.c43:focus, +.c43:hover, +.c43:active { -webkit-text-decoration: underline; text-decoration: underline; } -.c52 { +.c51 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -243,16 +255,16 @@ exports[` should render 1`] = ` opacity: 1; } -.c52:link, -.c52:visited { +.c51:link, +.c51:visited { -webkit-text-decoration: none; text-decoration: none; color: #fff; } -.c52:not([disabled]):hover, -.c52:not([disabled]):active, -.c52:not([disabled]):focus { +.c51:not([disabled]):hover, +.c51:not([disabled]):active, +.c51:not([disabled]):focus { opacity: 1; -webkit-transform: translateY(-2px); -ms-transform: translateY(-2px); @@ -261,7 +273,7 @@ exports[` should render 1`] = ` border-color: #a0b3e0; } -.c52[disabled] { +.c51[disabled] { background-color: #e4e8ef; border-color: #e4e8ef; color: #9298af; @@ -269,7 +281,58 @@ exports[` should render 1`] = ` cursor: not-allowed; } -.c45 { +.c62 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c62:focus, +.c62:hover, +.c62:active { + color: #f66663; +} + +.c44 { width: 2.6rem; height: 1.4rem; margin: 0 0.4rem 0 1rem; @@ -278,19 +341,30 @@ exports[` should render 1`] = ` transition: transform 250ms linear; } -.c10:hover .c45 { +.c9:hover .c44 { -webkit-transform: translateX(4px); -ms-transform: translateX(4px); transform: translateX(4px); } -.c28 { +.c11 { + height: auto; + padding: 0; +} + +.c13 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + +.c27 { position: relative; overflow: visible; } -.c28:before, -.c28:after { +.c27:before, +.c27:after { position: absolute; top: 0; bottom: 0; @@ -305,19 +379,19 @@ exports[` should render 1`] = ` background: radial-gradient( ellipse at center, #fff 15%, rgba(255,255,255,0) 80% ); } -.c28:before { +.c27:before { left: -2rem; } -.c28:after { +.c27:after { right: -2rem; } -.c30 { +.c29 { overflow-x: visible; } -.c31 { +.c30 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -344,7 +418,7 @@ exports[` should render 1`] = ` list-style-type: none; } -.c32 { +.c31 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -361,7 +435,7 @@ exports[` should render 1`] = ` width: calc(100% / 4 - 2 * 1rem - 1px); } -.c27 { +.c26 { position: absolute; background-color: #7994d4; border-radius: 0.6rem; @@ -374,7 +448,7 @@ exports[` should render 1`] = ` transform: translateX(-50%); } -.c39 { +.c38 { position: relative; margin: 3.2rem 0 2rem 0; color: #2f3b6c; @@ -384,7 +458,7 @@ exports[` should render 1`] = ` line-height: 1.625; } -.c58 { +.c57 { position: relative; margin: 0 0 2rem 0; color: #2f3b6c; @@ -394,7 +468,7 @@ exports[` should render 1`] = ` line-height: 1.625; } -.c33 { +.c32 { position: relative; display: -webkit-inline-box; display: -webkit-inline-flex; @@ -435,9 +509,9 @@ exports[` should render 1`] = ` appearance: none; } -.c33:hover, -.c33:active, -.c33:focus { +.c32:hover, +.c32:active, +.c32:focus { color: #3e486e; box-shadow: 0 1rem 2rem rgba(121,148,212,0.4); -webkit-transform: translateY(-2px); @@ -445,7 +519,7 @@ exports[` should render 1`] = ` transform: translateY(-2px); } -.c37 { +.c36 { display: block; width: 7.2rem; height: 7.2rem; @@ -455,42 +529,42 @@ exports[` should render 1`] = ` border-radius: 50%; } -.c36 { +.c35 { -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; } -.c38 { +.c37 { padding-right: 1rem; } -.c40 { +.c39 { margin: 0; } -.c41 { +.c40 { -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; margin-top: 1rem; } -.c25 { +.c24 { margin-top: 0; margin-bottom: 4rem; margin-left: auto; text-align: center; } -.c49 { +.c48 { margin-top: 0; margin-bottom: 2rem; margin-left: auto; text-align: center; } -.c26 { +.c25 { position: relative; margin: 0; color: #2f3b6c; @@ -501,7 +575,7 @@ exports[` should render 1`] = ` padding-top: 1.6rem; } -.c50 { +.c49 { position: relative; margin: 0; color: #2f3b6c; @@ -513,15 +587,15 @@ exports[` should render 1`] = ` text-align: center; } -.c19 ul { +.c18 ul { z-index: 1; } -.c19 li[role="option"]:nth-child(2n + 1) { +.c18 li[role="option"]:nth-child(2n + 1) { background: #f2f5fa; } -.c17 { +.c16 { position: relative; display: -webkit-box; display: -webkit-flex; @@ -531,12 +605,12 @@ exports[` should render 1`] = ` padding: 0; } -.c22 { +.c21 { width: 3rem; height: 3rem; } -.c18 { +.c17 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -560,23 +634,23 @@ exports[` should render 1`] = ` appearance: none; } -.c18::-webkit-input-placeholder { +.c17::-webkit-input-placeholder { color: #9298af; } -.c18::-moz-placeholder { +.c17::-moz-placeholder { color: #9298af; } -.c18:-ms-input-placeholder { +.c17:-ms-input-placeholder { color: #9298af; } -.c18::placeholder { +.c17::placeholder { color: #9298af; } -.c21 { +.c20 { position: absolute; top: 0; right: 0; @@ -586,85 +660,9 @@ exports[` should render 1`] = ` } .c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c14 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c13 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - cursor: inherit; -} - -.c13:after { - position: absolute; - bottom: 0; - left: 50%; - width: 90%; - height: 3px; - background-color: #f66663; - border-radius: 0.6rem; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - content: ""; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -745,7 +743,7 @@ exports[` should render 1`] = ` justify-content: flex-end; } -.c15 { +.c14 { display: none; -webkit-order: 1; -ms-flex-order: 1; @@ -753,7 +751,7 @@ exports[` should render 1`] = ` color: #7994d4; } -.c16 { +.c15 { -webkit-order: 3; -ms-flex-order: 3; order: 3; @@ -761,12 +759,12 @@ exports[` should render 1`] = ` margin-left: 1.6rem; } -.c46 { +.c45 { width: 100%; overflow-x: hidden; } -.c47 { +.c46 { position: relative; z-index: 1; margin-top: 4rem; @@ -774,7 +772,7 @@ exports[` should render 1`] = ` background-color: #f2f5fa; } -.c47:before { +.c46:before { position: absolute; top: -27px; left: -50%; @@ -786,13 +784,13 @@ exports[` should render 1`] = ` content: ""; } -.c48 { +.c47 { position: relative; padding-bottom: 7rem; text-align: center; } -.c51 { +.c50 { max-width: 124rem; margin: 0 auto; padding: 0 2rem; @@ -801,17 +799,17 @@ exports[` should render 1`] = ` margin-bottom: 2rem; } -.c53 { +.c52 { width: 1.5em; margin-left: 1.6rem; } -.c54 { +.c53 { padding: 5rem 0; background-color: #e4e8ef; } -.c55 { +.c54 { max-width: 124rem; margin: 0 auto; padding: 0 2rem; @@ -825,25 +823,25 @@ exports[` should render 1`] = ` justify-content: space-between; } -.c57 + .c56 { +.c56 + .c55 { padding-left: 1.6rem; } -.c60 { +.c59 { margin: 0; padding: 0; list-style-type: none; } -.c59 { +.c58 { font-size: 1.6rem; } -.c61 { +.c60 { margin: 0.4rem 0; } -.c62 { +.c61 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -912,7 +910,7 @@ exports[` should render 1`] = ` content: ""; } -.c42 { +.c41 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -927,86 +925,105 @@ exports[` should render 1`] = ` height: 100%; } -.c43 { +.c42 { margin-top: 1.6rem; } @media (max-width:600px) { - .c24 { + .c23 { padding: 0 1rem; } } @media print { - .c24 { + .c23 { max-width: 100%; padding: 0; } } @media (max-width:600px) { - .c23 { + .c22 { padding: 2.4rem 0; } } @media (max-width:600px) { - .c11 { + .c10 { font-size: 1.4rem; } } @media (max-width:600px) { - .c20 { + .c10 { + padding: 0 3rem; + } +} + +@media (max-width:600px) { + .c19 { font-size: 1.4rem; } } @media (max-width:600px) { - .c44 { + .c43 { font-size: 1.4rem; } } @media (max-width:600px) { - .c52 { + .c51 { font-size: 1.4rem; } } @media (max-width:600px) { - .c52 { + .c51 { padding: 0 3rem; } } @media (max-width:600px) { - .c28 { + .c62 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c13 { + width: 4.2rem; + height: 4.2rem; + } +} + +@media (max-width:600px) { + .c27 { overflow-x: hidden; } } @media (max-width:600px) { - .c28:before, - .c28:after { + .c27:before, + .c27:after { display: block; } } @media (max-width:600px) { - .c30 { + .c29 { overflow-x: auto; } } @media (max-width:600px) { - .c29 { + .c28 { margin-bottom: 1.6rem; } } @media (max-width:600px) { - .c31 { + .c30 { -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; @@ -1017,18 +1034,18 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c32 { + .c31 { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; min-width: 23rem; } - .c32:first-of-type { + .c31:first-of-type { margin-left: 2rem; } - .c32:last-of-type:after { + .c31:last-of-type:after { display: block; width: 2rem; height: 100%; @@ -1038,70 +1055,70 @@ exports[` should render 1`] = ` } @media (max-width:1180px) { - .c32 { + .c31 { width: calc( 100% / 3 - 2 * 1rem - 1px ); } } @media (max-width:980px) { - .c32 { + .c31 { width: calc( 100% / 2 - 2 * 1rem - 1px ); } } @media (max-width:600px) { - .c32 { + .c31 { width: 60%; } } @media (max-width:600px) { - .c39 { + .c38 { font-size: 1.6rem; } } @media (max-width:600px) { - .c58 { + .c57 { font-size: 1.6rem; } } @media (max-width:600px) { - .c33 { + .c32 { padding: 2rem 1.6rem; font-size: 1.4rem; } } @media (max-width:600px) { - .c25 { + .c24 { margin-bottom: 3.2rem; margin-left: auto; } } @media (max-width:600px) { - .c49 { + .c48 { margin-bottom: 1rem; margin-left: auto; } } @media (max-width:600px) { - .c26 { + .c25 { font-size: 2.6rem; } } @media (max-width:600px) { - .c50 { + .c49 { font-size: 2.2rem; } } @media (max-width:600px) { - .c17 { + .c16 { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; @@ -1110,72 +1127,12 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c18 { + .c17 { height: 5.4rem; padding: 1rem 5.5rem 1rem 1.6rem; } } -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c14 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c13 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c13:after { - bottom: auto; - left: 0; - width: 3px; - height: 100%; - -webkit-transform: none; - -ms-transform: none; - transform: none; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1259,7 +1216,7 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c15 { + .c14 { display: block; width: 3.4rem; height: 3.4rem; @@ -1268,7 +1225,7 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c15 { + .c14 { width: 2.2rem; height: 2.2rem; margin-left: 1rem; @@ -1276,58 +1233,58 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c16 { + .c15 { display: none; } } @media print { - .c47 { + .c46 { display: none; } } @media (max-width:600px) { - .c48 { + .c47 { padding-top: 0; padding-bottom: 4rem; } } @media (max-width:600px) { - .c51 { + .c50 { padding: 0; } } @media print { - .c51 { + .c50 { max-width: 100%; padding: 0; } } @media (max-width:600px) { - .c54 { + .c53 { padding-bottom: 4rem; } } @media (max-width:600px) { - .c55 { + .c54 { padding: 0 1rem; } } @media print { - .c55 { + .c54 { max-width: 100%; padding: 0; } } @media (max-width:600px) { - .c55 { + .c54 { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; @@ -1335,19 +1292,19 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c57 + .c56 { + .c56 + .c55 { padding-left: 0; } } @media (max-width:600px) { - .c60 { + .c59 { text-align: center; } } @media (max-width:600px) { - .c59 { + .c58 { margin-top: 1rem; text-align: center; } @@ -1359,54 +1316,6 @@ exports[` should render 1`] = ` } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` color: #3e486e; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -48,27 +48,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c21 { @@ -260,6 +272,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c49 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c49:focus, +.c49:hover, +.c49:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c16 { position: absolute; background-color: #7994d4; @@ -416,52 +490,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -631,7 +662,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c49 { +.c50 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -650,7 +681,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c50 { +.c51 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -658,7 +689,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c51 { +.c52 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -762,11 +793,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c21 { font-size: 1.4rem; @@ -803,6 +840,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c49 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c27 { margin-left: -1rem; @@ -872,40 +922,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1061,7 +1077,7 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c51 { + .c52 { display: none; } } @@ -1085,54 +1101,6 @@ exports[` should render 1`] = ` } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + +
@@ -1468,7 +1354,7 @@ exports[` should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -1587,7 +1473,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` margin-bottom: 0; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -72,27 +72,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -221,6 +233,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c52 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c52:focus, +.c52:hover, +.c52:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c27 { position: relative; overflow: visible; @@ -441,52 +515,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -672,7 +703,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c52 { +.c53 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -691,7 +722,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c53 { +.c54 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -699,7 +730,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c54 { +.c55 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -803,11 +834,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -826,6 +863,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c52 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c27 { overflow-x: hidden; @@ -955,40 +1005,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -1167,7 +1183,7 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c54 { + .c55 { display: none; } } @@ -1185,54 +1201,6 @@ exports[` should render 1`] = ` } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -1775,7 +1661,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` color: #3e486e; } -.c10 { +.c9 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -41,27 +41,39 @@ exports[` should render 1`] = ` -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0; + height: 5.2rem; + padding: 0 4.4rem; color: #3e486e; - font-weight: normal; - font-size: 1.6rem; - line-height: 1.625; - vertical-align: baseline; + background: transparent; + border-color: transparent; + box-shadow: none; + opacity: 1; +} + +.c9:link, +.c9:visited { -webkit-text-decoration: none; text-decoration: none; - text-align: left; - background: none; - border: none; - border-radius: 0; - overflow: visible; - -webkit-transition: color 250ms linear, text-decoration 250ms linear; - transition: color 250ms linear, text-decoration 250ms linear; + color: #3e486e; } -.c10:focus, -.c10:hover, -.c10:active { - color: #f66663; +.c9:not([disabled]):hover, +.c9:not([disabled]):active, +.c9:not([disabled]):focus { + opacity: 0.6; + -webkit-transform: translateY(-2px); + -ms-transform: translateY(-2px); + transform: translateY(-2px); + background: transparent; + border-color: transparent; +} + +.c9[disabled] { + background-color: #e4e8ef; + border-color: #e4e8ef; + color: #9298af; + box-shadow: none; + cursor: not-allowed; } .c18 { @@ -190,6 +202,68 @@ exports[` should render 1`] = ` cursor: not-allowed; } +.c43 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + box-sizing: content-box; + font-weight: 500; + font-size: 1.6rem; + line-height: 1.125em; + text-align: center; + vertical-align: middle; + border: 1px solid; + border-radius: 0.6rem; + cursor: pointer; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,-webkit-transform 100ms linear; + -webkit-transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + transition: background-color 250ms linear, border-color 250ms linear,transform 100ms linear; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; + color: #3e486e; + font-weight: normal; + font-size: 1.6rem; + line-height: 1.625; + vertical-align: baseline; + -webkit-text-decoration: none; + text-decoration: none; + text-align: left; + background: none; + border: none; + border-radius: 0; + overflow: visible; + -webkit-transition: color 250ms linear, text-decoration 250ms linear; + transition: color 250ms linear, text-decoration 250ms linear; +} + +.c43:focus, +.c43:hover, +.c43:active { + color: #f66663; +} + +.c10 { + height: auto; + padding: 0; +} + +.c12 { + width: 5.4rem; + height: 5.4rem; + color: #7994d4; +} + .c25 { position: absolute; background-color: #7994d4; @@ -323,52 +397,9 @@ exports[` should render 1`] = ` } .c11 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; -} - -.c12 { - position: relative; - display: -webkit-box !important; - display: -webkit-flex !important; - display: -ms-flexbox !important; - display: flex !important; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 100%; - padding: 0 1.6rem; - font-weight: normal; - font-size: 1.6rem; - font-family: "Open Sans",sans-serif; - border: none; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c9 { -webkit-order: 2; -ms-flex-order: 2; order: 2; - height: 100%; -} - -.c9 > div { - height: 100%; } .c2 { @@ -554,7 +585,7 @@ exports[` should render 1`] = ` cursor: pointer; } -.c43 { +.c44 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -573,7 +604,7 @@ exports[` should render 1`] = ` background-color: #e4e8ef; } -.c44 { +.c45 { font-weight: normal; -webkit-text-decoration: none; text-decoration: none; @@ -581,7 +612,7 @@ exports[` should render 1`] = ` margin: 0 1rem 1rem 1rem; } -.c45 { +.c46 { margin-bottom: 1rem; -webkit-user-select: none; -moz-user-select: none; @@ -636,11 +667,17 @@ exports[` should render 1`] = ` } @media (max-width:600px) { - .c10 { + .c9 { font-size: 1.4rem; } } +@media (max-width:600px) { + .c9 { + padding: 0 3rem; + } +} + @media (max-width:600px) { .c18 { font-size: 1.4rem; @@ -659,6 +696,19 @@ exports[` should render 1`] = ` } } +@media (max-width:600px) { + .c43 { + font-size: 1.4rem; + } +} + +@media (max-width:600px) { + .c12 { + width: 4.2rem; + height: 4.2rem; + } +} + @media (max-width:600px) { .c38 { font-size: 1.6rem; @@ -707,40 +757,6 @@ exports[` should render 1`] = ` } } -@media (max-width:980px) { - .c11 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c12 { - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - width: 100%; - height: 5.4rem; - padding: 0; - font-weight: 600; - font-size: 1.8rem; - } -} - -@media (max-width:980px) { - .c9 { - height: auto; - } -} - @media (max-width:600px) { .c2 { height: 6rem; @@ -919,59 +935,11 @@ exports[` should render 1`] = ` } @media (max-width:980px) { - .c45 { + .c46 { display: none; } } -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:980px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} - -@media (max-width:600px) { - -} - -@media (min-width:981px) { - -} -
should render 1`] = `
-
- + + should render 1`] = ` Code du travail numérique
  • should render 1`] = ` Aidez-nous à améliorer cet outil
    • @@ -1401,7 +1287,7 @@ exports[` should render 1`] = ` En collaboration avec
      • should render 1`] = `
should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should render 1`] = ` should renders related content 1`] = ` class="c31" > Outils diff --git a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/RelatedItems.test.js.snap b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/RelatedItems.test.js.snap index 2b8006f38a..2ed2eccce9 100644 --- a/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/RelatedItems.test.js.snap +++ b/packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/RelatedItems.test.js.snap @@ -523,7 +523,7 @@ exports[` should render 1`] = ` class="c7" > Modèles de documents diff --git a/packages/code-du-travail-frontend/src/conventions/Convention/__tests__/__snapshots__/index.test.js.snap b/packages/code-du-travail-frontend/src/conventions/Convention/__tests__/__snapshots__/index.test.js.snap index ccd85bc5bb..3cef1d02ca 100644 --- a/packages/code-du-travail-frontend/src/conventions/Convention/__tests__/__snapshots__/index.test.js.snap +++ b/packages/code-du-travail-frontend/src/conventions/Convention/__tests__/__snapshots__/index.test.js.snap @@ -4742,7 +4742,7 @@ exports[` renders 1`] = ` class="c35" > Article 1-4 @@ -4771,7 +4771,7 @@ exports[` renders 1`] = ` class="c35" > Article 4-1 @@ -4800,7 +4800,7 @@ exports[` renders 1`] = ` class="c35" > Article 4-2 @@ -4829,7 +4829,7 @@ exports[` renders 1`] = ` class="c35" > Article 12-8 @@ -4937,7 +4937,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-13 @@ -4966,7 +4966,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-14 @@ -4995,7 +4995,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-15 @@ -5024,7 +5024,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-16 @@ -5053,7 +5053,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-17 @@ -5082,7 +5082,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-18 @@ -5111,7 +5111,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-21 @@ -5140,7 +5140,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-22 @@ -5169,7 +5169,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-24 @@ -5198,7 +5198,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-25 @@ -5227,7 +5227,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-28 @@ -5256,7 +5256,7 @@ exports[` renders 1`] = ` class="c35" > Article 3-29 @@ -5364,7 +5364,7 @@ exports[` renders 1`] = ` class="c35" > Article 12-1 @@ -5393,7 +5393,7 @@ exports[` renders 1`] = ` class="c35" > Article 12-2 @@ -5422,7 +5422,7 @@ exports[` renders 1`] = ` class="c35" > Article 12-3 @@ -5451,7 +5451,7 @@ exports[` renders 1`] = ` class="c35" > Article 12-4 @@ -5480,7 +5480,7 @@ exports[` renders 1`] = ` class="c35" > Article 12-5 @@ -5509,7 +5509,7 @@ exports[` renders 1`] = ` class="c35" > Article 12-6 @@ -5538,7 +5538,7 @@ exports[` renders 1`] = ` class="c35" > Article 12-7 diff --git a/packages/code-du-travail-frontend/src/home/__tests__/__snapshots__/Highlights.test.js.snap b/packages/code-du-travail-frontend/src/home/__tests__/__snapshots__/Highlights.test.js.snap index 161da226eb..a508ff37cb 100644 --- a/packages/code-du-travail-frontend/src/home/__tests__/__snapshots__/Highlights.test.js.snap +++ b/packages/code-du-travail-frontend/src/home/__tests__/__snapshots__/Highlights.test.js.snap @@ -383,7 +383,7 @@ exports[` should render 1`] = ` class="c12" > Santé, sécurité et conditions de travail @@ -415,7 +415,7 @@ exports[` should render 1`] = ` class="c12" > Santé, sécurité et conditions de travail diff --git a/packages/code-du-travail-frontend/src/layout/__tests__/__snapshots__/Footer.test.js.snap b/packages/code-du-travail-frontend/src/layout/__tests__/__snapshots__/Footer.test.js.snap index c31d27dac5..4fc450667b 100644 --- a/packages/code-du-travail-frontend/src/layout/__tests__/__snapshots__/Footer.test.js.snap +++ b/packages/code-du-travail-frontend/src/layout/__tests__/__snapshots__/Footer.test.js.snap @@ -490,7 +490,7 @@ exports[`