diff --git a/index.html b/index.html index 1e0881f2d..14b5d51de 100644 --- a/index.html +++ b/index.html @@ -98,8 +98,6 @@ /* Prevent FOUC effect */ #js { opacity: 0; - transform: translateY(20px); - transition: all 0.4s; } /* CSS Loader */ diff --git a/source/Provider.js b/source/Provider.js index abdc5906b..1cab5bc32 100644 --- a/source/Provider.js +++ b/source/Provider.js @@ -66,8 +66,8 @@ export default class Provider extends PureComponent { css.type = 'text/css' css.innerHTML = ` #js { - opacity: 1 !important; - transform: translateY(0px) !important; + animation: appear 0.5s; + opacity: 1; } #loading { display: none !important; diff --git a/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.css b/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.css index 8f1dbfa2c..fb6d892dd 100644 --- a/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.css +++ b/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.css @@ -3,17 +3,17 @@ position: absolute; left: 0; top: 0; + transform: translate(-100%); /* let the browser know we plan to animate each view in and out */ will-change: transform; transition: transform 0.3s cubic-bezier(0.465, 0.183, 0.153, 0.946); - transform: translate(-100%); z-index: 1; } - .sidebar__container.opened { - transform: translateX(0); + transform: translate(0%); } + .sidebar__container + * { will-change: transform; transition: transform 0.3s cubic-bezier(0.465, 0.183, 0.153, 0.946); diff --git a/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.js b/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.js index 9bbb7f1af..2cf0377fe 100644 --- a/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.js +++ b/source/sites/mon-entreprise.fr/layout/Navigation/SideBar.js @@ -8,7 +8,7 @@ import { withRouter } from 'react-router' import backSvg from './back.svg' import mobileMenuSvg from './mobile-menu.svg' import './SideBar.css' -import type { Tracker } from 'Components/utils/withTracker' +import type Tracker from '../../../../Tracker' import type { Location } from 'react-router-dom' type OwnProps = {| @@ -79,10 +79,10 @@ class SideBar extends React.Component { render() { return (
(this.ref = ref)}>
{this.props.children}