diff --git a/client/components/mobile/Footer.jsx b/client/components/mobile/Footer.jsx index 45a3d87d..5d82d3c7 100644 --- a/client/components/mobile/Footer.jsx +++ b/client/components/mobile/Footer.jsx @@ -2,7 +2,7 @@ import React from 'react'; import styled from 'styled-components'; import { prop, remSize } from '../../theme'; -const background = prop('Panel.default.background'); +const background = prop('MobilePanel.default.background'); const textColor = prop('primaryTextColor'); const Footer = styled.div` diff --git a/client/components/mobile/Header.jsx b/client/components/mobile/Header.jsx index 559f2efa..eca2c98e 100644 --- a/client/components/mobile/Header.jsx +++ b/client/components/mobile/Header.jsx @@ -2,7 +2,7 @@ import React from 'react'; import styled from 'styled-components'; import { prop, remSize } from '../../theme'; -const background = prop('Panel.default.background'); +const background = prop('MobilePanel.default.background'); const textColor = prop('primaryTextColor'); const Header = styled.div` diff --git a/client/components/mobile/IconButton.jsx b/client/components/mobile/IconButton.jsx index 0aeed2b7..5c0b16a9 100644 --- a/client/components/mobile/IconButton.jsx +++ b/client/components/mobile/IconButton.jsx @@ -12,13 +12,13 @@ width: 3rem; `; const IconButton = props => (); IconButton.propTypes = { - children: PropTypes.element.isRequired + element: PropTypes.element.isRequired }; export default IconButton; diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index b1867622..9f429546 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -200,12 +200,6 @@ class PreviewFrame extends React.Component { this.addLoopProtect(sketchDoc); sketchDoc.head.insertBefore(consoleErrorsScript, sketchDoc.head.firstElement); - if (this.props.forceFullWidth) { - const resizeScript = sketchDoc.createElement('style'); - resizeScript.innerHTML = '.p5Canvas { width: 100% !important; height: auto !important }'; - sketchDoc.head.appendChild(resizeScript); - } - return `\n${sketchDoc.documentElement.outerHTML}`; } @@ -390,12 +384,10 @@ PreviewFrame.propTypes = { cmController: PropTypes.shape({ getContent: PropTypes.func }), - forceFullWidth: PropTypes.bool }; PreviewFrame.defaultProps = { fullView: false, - forceFullWidth: false, cmController: {} }; diff --git a/client/modules/IDE/pages/IDEViewMobile.jsx b/client/modules/IDE/pages/IDEViewMobile.jsx index 58845f1d..4008b817 100644 --- a/client/modules/IDE/pages/IDEViewMobile.jsx +++ b/client/modules/IDE/pages/IDEViewMobile.jsx @@ -29,16 +29,13 @@ import Header from '../../../components/mobile/Header'; import Screen from '../../../components/mobile/MobileScreen'; import Footer from '../../../components/mobile/Footer'; import IDEWrapper from '../../../components/mobile/IDEWrapper'; +import { remSize } from '../../../theme'; const IconContainer = styled.div` - marginLeft: 2rem; + margin-left: ${remSize(32)}; display: flex; `; -const TitleContainer = styled.div` - -`; - const isUserOwner = ({ project, user }) => (project.owner && project.owner.id === user.id); const IDEViewMobile = (props) => { @@ -65,12 +62,8 @@ const IDEViewMobile = (props) => { - setOverlay('preferences')}> - - { startSketch(); }}> - + setOverlay('preferences')} element={ diff --git a/client/modules/Mobile/MobileSketchView.jsx b/client/modules/Mobile/MobileSketchView.jsx index fb50ffe2..cf956ec5 100644 --- a/client/modules/Mobile/MobileSketchView.jsx +++ b/client/modules/Mobile/MobileSketchView.jsx @@ -50,9 +50,7 @@ const MobileSketchView = (props) => { return (
- - - + } width={12} height={12} aria-label="Return to original editor" />

{projectName}


@@ -67,7 +65,6 @@ const MobileSketchView = (props) => { content={selectedFile.content} isPlaying - forceFullWidth isAccessibleOutputPlaying={ide.isAccessibleOutputPlaying} previewIsRefreshing={ide.previewIsRefreshing}