r/p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull requests Releases 1 Wiki Activity

fixes #945 (#1102)

Browse source
This commit is contained in:
Cassie Tarakajian 2019-06-12 17:11:35 -04:00 committed by GitHub
parent 68f3d145d0
commit 0b24938dce
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
client/modules/IDE/components/Editor.jsx
View file

@ -290,6 +290,11 @@ class Editor extends React.Component {
'editor--options': this.props.editorOptionsVisible 'editor--options': this.props.editorOptionsVisible
}); });
const editorHolderClass = classNames({
'editor-holder': true,
'editor-holder--hidden': this.props.file.fileType === 'folder' || this.props.file.url
});
return ( return (
<section <section
title="code editor" title="code editor"
@ -322,7 +327,7 @@ class Editor extends React.Component {
/> />
</div> </div>
</header> </header>
<div ref={(element) => { this.codemirrorContainer = element; }} className="editor-holder" > <div ref={(element) => { this.codemirrorContainer = element; }} className={editorHolderClass} >
</div> </div>
<EditorAccessibility <EditorAccessibility
lintMessages={this.props.lintMessages} lintMessages={this.props.lintMessages}
@ -352,7 +357,9 @@ Editor.propTypes = {
file: PropTypes.shape({ file: PropTypes.shape({
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,
content: PropTypes.string.isRequired, content: PropTypes.string.isRequired,
id: PropTypes.string.isRequired id: PropTypes.string.isRequired,
fileType: PropTypes.string.isRequired,
url: PropTypes.string.isRequired
}).isRequired, }).isRequired,
editorOptionsVisible: PropTypes.bool.isRequired, editorOptionsVisible: PropTypes.bool.isRequired,
showEditorOptions: PropTypes.func.isRequired, showEditorOptions: PropTypes.func.isRequired,

3
client/styles/components/_editor.scss
View file

@ -328,6 +328,9 @@ pre.CodeMirror-line {
height: calc(100% - #{29 / $base-font-size}rem); height: calc(100% - #{29 / $base-font-size}rem);
width: 100%; width: 100%;
position: absolute; position: absolute;
&.editor-holder--hidden {
display: none;
}
} }
.editor__header { .editor__header {