Adjust Live Monitoring view to fit screen view

- Related to #6219
hotosm · Jan 25, 2024 · c1a294f · c1a294f
1 parent 66ed8a6
commit c1a294f
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/frontend/src/views/projectLiveMonitoring.css b/frontend/src/views/projectLiveMonitoring.css
@@ -1,7 +1,7 @@
-@import "@hotosm/underpass-ui/dist/index.css";
+@import '@hotosm/underpass-ui/dist/index.css';
 
 .maplibregl-map {
-  height: 100vh;
+  height: calc(100vh - 6.05rem);
 }
 
 .top {

diff --git a/frontend/src/views/projectLiveMonitoring.js b/frontend/src/views/projectLiveMonitoring.js
@@ -226,7 +226,7 @@ export function ProjectLiveMonitoring() {
       ready={!error && !loading}
       className="pr3"
     >
-      <div>
+      <div className="cf w-100" style={{ height: 'calc(100vh - 5.5rem)' }}>
         <div className="flex p-2">
           <div style={{ flex: 2 }}>
             <div className="top">
@@ -365,7 +365,7 @@ export function ProjectLiveMonitoring() {
               style={{
                 display: 'flex',
                 flexFlow: 'column',
-                height: '100px',
+                maxHeight: 'calc(100vh - 26rem)',
                 flex: '1 1 auto',
               }}
               tags={tags}