From 327406ea31dd9f9099da9e287ef425e1011e322d Mon Sep 17 00:00:00 2001
From: ghalestrilo <ghalestrilo@gmail.com>
Date: Tue, 9 Jun 2020 17:35:06 -0300
Subject: [PATCH] =?UTF-8?q?=E2=9B=8F=20=20create=20mobile=20screen=20stub?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/modules/IDE/pages/IDEViewMobile.jsx | 22 ++++++++++++++++------
 client/theme.js                            |  3 +++
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/client/modules/IDE/pages/IDEViewMobile.jsx b/client/modules/IDE/pages/IDEViewMobile.jsx
index edc7c4bb..fcb39f99 100644
--- a/client/modules/IDE/pages/IDEViewMobile.jsx
+++ b/client/modules/IDE/pages/IDEViewMobile.jsx
@@ -1,19 +1,25 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
+import { prop, remSize } from '../../../theme';
+
+const background = prop('Button.default.background');
+const textColor = prop('primaryTextColor');
 
 const Header = styled.div`
   width: 100%;
-  color: orange;
-  background: red;
+  background-color: ${background} !important;
+  color: ${textColor};
+  padding-left: ${remSize(32)};
 `;
 
 const Footer = styled.div`
   width: 100%;
-  color: orange;
-  background: blue;
   position: absolute;
   bottom: 0;
+  background: ${background};
+  color: ${textColor};
+  padding-left: ${remSize(32)};
 `;
 
 const Screen = ({ children }) => (
@@ -27,7 +33,11 @@ Screen.propTypes = {
 
 export default () => (
   <Screen>
-    <Header><h1>Test</h1></Header>
-    <Footer><h1>Actionbar</h1></Footer>
+    <Header><h1>Mobile View</h1></Header>
+    <h3>
+      <br />This page is under construction.
+      <br /><a href="/?ignoremobile" >Click here</a> to return to the regular editor
+    </h3>
+    <Footer><h1>Bottom Bar</h1></Footer>
   </Screen>
 );
diff --git a/client/theme.js b/client/theme.js
index 5215dd99..4b61d77c 100644
--- a/client/theme.js
+++ b/client/theme.js
@@ -111,8 +111,11 @@ export default {
         foreground: grays.light,
         background: grays.dark,
         border: grays.middleDark,
+
       },
     },
+
+
   },
   [Theme.contrast]: {
     colors,