mirror of https://github.com/embarklabs/embark.git
Color tabs for text editor
This commit is contained in:
parent
eb8759083c
commit
f1e1c4a143
|
@ -44,7 +44,7 @@ class SearchBar extends React.Component {
|
|||
|
||||
render() {
|
||||
return (
|
||||
<Form inline className={classNames('search-bar', 'mr-2', {hidden: this.props.hidden})}>
|
||||
<Form inline className={classNames('search-bar', 'mr-2')}>
|
||||
{!this.props.loading &&
|
||||
<React.Fragment>
|
||||
<div className={classNames({'d-sm-down-none': !this.state.showForm})}>
|
||||
|
|
|
@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
|
|||
import FontAwesomeIcon from 'react-fontawesome';
|
||||
import classNames from 'classnames';
|
||||
|
||||
import {DARK_THEME} from '../constants';
|
||||
import {DARK_THEME, LIGHT_THEME} from '../constants';
|
||||
import './TextEditor.css';
|
||||
|
||||
const SUPPORTED_LANGUAGES = ['css', 'sol', 'html', 'json'];
|
||||
|
@ -137,18 +137,20 @@ class TextEditor extends React.Component {
|
|||
|
||||
renderTabs() {
|
||||
return (
|
||||
<ul className="list-inline m-0 p-2">
|
||||
<ul className="list-inline m-0 p-0">
|
||||
{this.props.editorTabs.map(file => (
|
||||
<li key={file.name} className={classNames("m-1", "list-inline-item", "border-right")}>
|
||||
<li key={file.name} className={classNames("p-2", "list-inline-item", "mr-0", "border-right", {
|
||||
'bg-white': file.active && LIGHT_THEME === this.props.theme,
|
||||
'bg-black': file.active && DARK_THEME === this.props.theme
|
||||
})}>
|
||||
<a
|
||||
href="#switch-tab"
|
||||
onClick={() => this.props.addEditorTabs(file)}
|
||||
className={classNames('p-2', {'text-muted': !file.active},
|
||||
{'text-primary': file.active})
|
||||
}>
|
||||
className="p-2 text-muted"
|
||||
>
|
||||
{file.name}
|
||||
</a>
|
||||
<FontAwesomeIcon style={{cursor: 'pointer'}} onClick={() => this.props.removeEditorTabs(file)} className="mx-1" name="close"/>
|
||||
<FontAwesomeIcon style={{cursor: 'pointer'}} onClick={() => this.props.removeEditorTabs(file)} className="px-1" name="close"/>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
|
|
|
@ -21,9 +21,6 @@
|
|||
.relative {
|
||||
position: relative;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.react-json-view {
|
||||
border-radius: .25rem;
|
||||
|
@ -77,3 +74,6 @@
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
.bg-black {
|
||||
background-color: #1C1C1C;
|
||||
}
|
Loading…
Reference in New Issue