fix: Adapt Footer placement to match Flagship application constraint

cozy · Oct 5, 2023 · ee4e8fb · ee4e8fb
1 parent 8f1da9f
commit ee4e8fb
Showing 1 changed file with 18 additions and 8 deletions.
diff --git a/src/components/MainView.jsx b/src/components/MainView.jsx
@@ -1,10 +1,20 @@
 import React from 'react'
 
-export const MainView = ({ children }) => (
-  <main
-    className="main-view u-flex u-flex-column u-flex-content-start u-flex-content-stretch u-w-100 u-pos-relative"
-    style={{ minHeight: '100vh' }}
-  >
-    {children}
-  </main>
-)
+import { getFlagshipMetadata } from 'cozy-device-helper'
+
+export const MainView = ({ children }) => {
+  const isImmersive = getFlagshipMetadata().immersive
+
+  return (
+    <main
+      className="main-view u-flex u-flex-column u-flex-content-start u-flex-content-stretch u-w-100 u-pos-relative"
+      style={{
+        minHeight: isImmersive
+          ? 'calc(100vh - var(--flagship-bottom-height) - var(--flagship-top-height))'
+          : '100vh'
+      }}
+    >
+      {children}
+    </main>
+  )
+}