fix: improve layout spacings

Author: martinjagodic

packages/decap-cms-core/src/components/App/App.js

@@ -36,6 +36,7 @@ const AppMainContainer = styled.div`
   min-width: 800px;
   max-width: 1440px;
   margin: 0 auto;
+  padding-bottom: 3rem;
 `;
 
 const ErrorContainer = styled.div`

packages/decap-cms-core/src/components/App/StatusBar.tsx

@@ -8,10 +8,12 @@ declare global {
 }
 
 const StatusBarContainer = styled.footer`
+  position: fixed;
+  z-index: 200;
+  bottom: 0;
   width: 100%;
-  margin-top: 2rem;
-  padding: 12px 18px;
-  font-size: 12px;
+  padding: 8px 18px;
+  font-size: 11px;
   display: flex;
   gap: 1rem;
   box-shadow: 0 4px 12px 0 rgba(68, 74, 87, 0.15), 0 1px 3px 0 rgba(68, 74, 87, 0.25);

packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js

@@ -25,7 +25,7 @@ import {
 const ControlPaneContainer = styled.div`
   max-width: 800px;
   margin: 0 auto;
-  padding-bottom: 16px;
+  padding-bottom: 2rem;
   font-size: 16px;
 `;
 

packages/decap-cms-core/src/components/Editor/EditorInterface.js

@@ -95,7 +95,7 @@ const NoPreviewContainer = styled.div`
 const EditorContainer = styled.div`
   width: 100%;
   min-width: 800px;
-  height: 100%;
+  height: calc(100% - 29px);
   position: absolute;
   top: 0;
   left: 0;