diff --git a/src/assets/anims/logoLoading.gif b/src/assets/anims/logoLoading.gif new file mode 100644 index 0000000000000000000000000000000000000000..22ca03a34246002e5dc5a850aad11675cbd19d96 Binary files /dev/null and b/src/assets/anims/logoLoading.gif differ diff --git a/src/components/Splash/SplashScreen.tsx b/src/components/Splash/SplashScreen.tsx index 55b861fd7a44b610273c40e694c5f8662ccbd363..670e63b255a5289dc24ab4afaa59f4a4867c217b 100644 --- a/src/components/Splash/SplashScreen.tsx +++ b/src/components/Splash/SplashScreen.tsx @@ -1,20 +1,10 @@ -import React from 'react' -import Lottie from 'react-lottie' +import logoLoading from 'assets/anims/logoLoading.gif' import logos from 'assets/png/logos_partenaires.svg' - -import * as loadingData from 'assets/anims/splash.json' -import './splashScreen.scss' -import { InitSteps } from 'models/initialisationSteps.model' import { useI18n } from 'cozy-ui/transpiled/react/I18n' +import { InitSteps } from 'models/initialisationSteps.model' +import React from 'react' +import './splashScreen.scss' -const loadingOptions = { - loop: true, - autoplay: true, - animationData: loadingData, - rendererSettings: { - preserveAspectRatio: 'xMidYMid slice', - }, -} interface SplashScreenProps { initStep: InitSteps } @@ -32,7 +22,7 @@ const SplashScreen: React.FC<SplashScreenProps> = ({ <> <div className="splash-content"> <div className="splash-loader"> - <Lottie options={loadingOptions} height={200} width={200} /> + <img src={logoLoading} alt="Chargement" height={200} /> <div className="splash-progress"> <div className="splash-progress-bar-container"> <div diff --git a/src/components/Splash/splashScreen.scss b/src/components/Splash/splashScreen.scss index 65590c61b478b3c9bf1ee81c1703264240650a8a..a4b856969f05e03e31ab543cf3c7d33a138b67ab 100644 --- a/src/components/Splash/splashScreen.scss +++ b/src/components/Splash/splashScreen.scss @@ -8,6 +8,9 @@ .splash-loader { width: 100%; margin-top: 20vh; + display: flex; + flex-direction: column; + align-items: center; } .splash-logos-container { margin-top: auto; diff --git a/src/types/custom.d.ts b/src/types/custom.d.ts index 7112effa625990e5b6011188a0044ae5092e2bc6..8dbc0480a1c5a9a63f17a3107ad1a6acffec6805 100644 --- a/src/types/custom.d.ts +++ b/src/types/custom.d.ts @@ -7,4 +7,9 @@ declare module '*.svg' { export default content } +declare module '*.gif' { + const content: string + export default content +} + declare module '*.webapp'