diff --git a/package.json b/package.json
index 9b60b41a..ee212366 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "stromae",
- "version": "2.0.8",
+ "version": "2.0.9",
"private": true,
"dependencies": {
"@axa-fr/react-oidc-context": "^3.1.6",
diff --git a/src/components/designSystem/AppVersion.js b/src/components/designSystem/AppVersion.js
new file mode 100644
index 00000000..ac6a3884
--- /dev/null
+++ b/src/components/designSystem/AppVersion.js
@@ -0,0 +1,21 @@
+import { makeStyles, Typography } from '@material-ui/core';
+import React from 'react';
+import { version, dependencies } from '../../../package.json';
+
+const useStyles = makeStyles({
+ root: {
+ textAlign: 'center',
+ padding: '2px 0 2px 0',
+ },
+});
+
+const lunaticVersion = dependencies['@inseefr/lunatic'].replace('^', '');
+
+export const AppVersion = ({ className }) => {
+ const classes = useStyles();
+ return (
+
+ {`Stromae : ${version} | Lunatic : ${lunaticVersion}`}
+
+ );
+};
diff --git a/src/components/navigation/burgerMenu/burgerMenu.css b/src/components/navigation/burgerMenu/burgerMenu.css
index 01976f81..bc2674a7 100644
--- a/src/components/navigation/burgerMenu/burgerMenu.css
+++ b/src/components/navigation/burgerMenu/burgerMenu.css
@@ -4,32 +4,32 @@
color: white;
position: absolute;
width: 280px;
- height:200%;
- display:grid;
- transition: transform .4s cubic-bezier(.25, .1, .25, 1);
+ height: 200%;
+ display: grid;
+ transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
pointer-events: none;
}
-#burgerMenuSlideBar, #burgerMenuToggleTab {
+#burgerMenuSlideBar,
+#burgerMenuToggleTab {
background: #2a5885;
pointer-events: auto;
}
-#burgerMenuSlideBar{
- position:absolute;
- height: 100%;
- width:225px;
+#burgerMenuSlideBar {
+ position: absolute;
+ height: 100vh;
+ width: 225px;
padding: 10px;
padding-top: 20px;
display: inline-block;
-
}
-#burgerMenuToggleTab{
- position:absolute;
+#burgerMenuToggleTab {
+ position: absolute;
left: 225px;
height: 138px;
- width:55px;
+ width: 55px;
border-left: 1px solid #5181b8;
display: inline-block;
}
@@ -42,26 +42,30 @@
transform: translate3d(0, 0, 0);
}
-#toggleSlidebarButton{
+#toggleSlidebarButton {
position: absolute;
top: 45px;
- left:15px
+ left: 15px;
}
-.slideBarButtonText{
+.slideBarButtonText {
text-align: left;
font-size: 15px;
}
-
-.burgerMenuButton:hover{
+.burgerMenuButton:hover {
border-radius: 8px;
}
-.burgerMenuButton{
- width: 100%
+.burgerMenuButton {
+ width: 100%;
}
-.burgerMenuButton > .MuiIconButton-label{
+.burgerMenuButton > .MuiIconButton-label {
justify-content: unset;
-}
\ No newline at end of file
+}
+
+.appVersion {
+ position: absolute;
+ bottom: 0;
+}
diff --git a/src/components/navigation/burgerMenu/burgerMenu.js b/src/components/navigation/burgerMenu/burgerMenu.js
index 0968b48b..96afd320 100644
--- a/src/components/navigation/burgerMenu/burgerMenu.js
+++ b/src/components/navigation/burgerMenu/burgerMenu.js
@@ -8,6 +8,7 @@ import { HOUSEHOLD } from 'utils/constants';
import { OrchestratorContext } from 'components/orchestrator/collector';
import { SIMPLE_CLICK_EVENT, paradataHandler } from 'utils/events';
import './burgerMenu.css';
+import { AppVersion } from 'components/designSystem/AppVersion';
const utilInfo = (type, page) => {
return { ...SIMPLE_CLICK_EVENT, id: `${type}-button`, page };
@@ -64,6 +65,7 @@ const BurgerMenu = ({ title }) => {
Déconnexion
)}
+