schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2024-11-10 07:57:45 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Remove collapse and add tabs

Browse source
This commit is contained in:
Lukas Martinelli 2016-12-19 15:40:11 +01:00
parent 4028c660fc
commit a52a548e51
3 changed files with 44 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
package.json
View file

@ -30,14 +30,13 @@
"randomcolor": "^0.4.4",
"react": "^15.4.0",
"react-addons-pure-render-mixin": "^15.4.0",
"react-collapse": "^2.3.3",
"react-color": "^2.10.0",
"react-dom": "^15.4.0",
"react-file-reader-input": "^1.1.0",
"react-height": "^2.1.1",
"react-icon-base": "^2.0.4",
"react-icons": "^2.2.1",
"react-motion": "^0.4.4",
"react-simpletabs": "^0.7.0",
"react-sortable-hoc": "^0.4.5",
"rebass": "^0.3.1",
"request": "^2.79.0"

20
src/index.css
View file

@ -18,3 +18,23 @@
color: rgb(142, 142, 142) !important;
box-shadow: none !important;
}
ul.tabs-menu {
list-style-type: none;
margin: 0;
padding: 0;
}
li.tabs-menu-item {
display: inline-block;
color: rgb(142, 142, 142);
font-size: 10px;
background-color: rgb(28, 31, 36);
padding: 5px;
margin-right: 3px;
}
li.tabs-menu-item:hover {
background-color: rgb(28, 31, 32);
cursor: pointer;
}

38
src/layers/editor.jsx
View file

@ -4,8 +4,8 @@ import Immutable from 'immutable'
import Toolbar from 'rebass/dist/Toolbar'
import NavItem from 'rebass/dist/NavItem'
import Space from 'rebass/dist/Space'
import Tabs from 'react-simpletabs'
import Collapse from 'react-collapse'
import theme from '../theme.js'
import FillLayer from './fill.jsx'
import LineLayer from './line.jsx'
@ -14,6 +14,8 @@ import BackgroundLayer from './background.jsx'
import SourceEditor from './source.jsx'
import FilterEditor from '../filter/editor.jsx'
import MdVisibility from 'react-icons/lib/md/visibility'
import MdVisibilityOff from 'react-icons/lib/md/visibility-off'
import MdDelete from 'react-icons/lib/md/delete'
@ -153,20 +155,26 @@ export class LayerEditor extends React.Component {
<MdDelete />
</NavItem>
</Toolbar>
<FilterEditor
filter={this.props.layer.get('filter', Immutable.List()).toJSON()}
onChange={f => this.onFilterChanged(Immutable.fromJS(f))}
/>
{this.props.layer.get('type') !== 'background' && <SourceEditor
source={this.props.layer.get('source')}
sourceLayer={this.props.layer.get('source-layer')}
sources={this.props.sources}
onSourceChange={console.log}
onSourceLayerChange={console.log}
/>}
<div style={{padding: theme.scale[2], paddingRight: 0, backgroundColor: theme.colors.black}}>
{this.layerFromType(this.props.layer.get('type'))}
</div>
<Tabs>
<Tabs.Panel title='Paint'>
<div style={{padding: theme.scale[2], paddingRight: 0, backgroundColor: theme.colors.black}}>
{this.layerFromType(this.props.layer.get('type'))}
</div>
</Tabs.Panel>
<Tabs.Panel title='Data'>
<FilterEditor
filter={this.props.layer.get('filter', Immutable.List()).toJSON()}
onChange={f => this.onFilterChanged(Immutable.fromJS(f))}
/>
{this.props.layer.get('type') !== 'background' && <SourceEditor
source={this.props.layer.get('source')}
sourceLayer={this.props.layer.get('source-layer')}
sources={this.props.sources}
onSourceChange={console.log}
onSourceLayerChange={console.log}
/>}
</Tabs.Panel>
</Tabs>
</div>
}
}