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

Line error highlight styling

This commit is contained in:
Zach Rispoli 2017-07-17 16:13:59 -04:00 committed by Cassie Tarakajian
parent e111d3c020
commit 1bb0efdac8
2 changed files with 27 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/modules/IDE/components/Editor.jsx
View File

@ -118,6 +118,8 @@ class Editor extends React.Component {
this._cm.getWrapperElement().style['font-size'] = `${this.props.fontSize}px`;
this._cm.setOption('indentWithTabs', this.props.isTabIndent);
this._cm.setOption('tabSize', this.props.indentationAmount);
this._cm.addLineClass(1, null, 'line-runtime-error');
}
componentWillUpdate(nextProps) {

25
client/styles/components/_editor.scss
View File

@ -27,6 +27,31 @@
padding-left: #{5 / $base-font-size}rem;
}
.CodeMirror-activeline-background {
background-color: rgba(0,0,0,0.025) !important;
}
.CodeMirror-linebackground {
}
.line-runtime-error {
background-color: #ffaaaa !important;
border-radius: 5px;
}
.CodeMirror-guttermarker-subtle {
}
.CodeMirror-foldgutter-folded {
}
.CodeMirror-foldgutter-open {
}
.CodeMirror-gutter-wrapper {
right: 100%;
top: 0;