diff --git a/src/about.jsx b/src/about.jsx
new file mode 100644
index 00000000..196254a1
--- /dev/null
+++ b/src/about.jsx
@@ -0,0 +1,41 @@
+import React from 'react'
+import theme from './theme.js'
+
+import Heading from 'rebass/dist/Heading'
+import Container from 'rebass/dist/Container'
+import Input from 'rebass/dist/Input'
+import Toolbar from 'rebass/dist/Toolbar'
+import NavItem from 'rebass/dist/NavItem'
+import Space from 'rebass/dist/Space'
+
+import Immutable from 'immutable'
+import PureRenderMixin from 'react-addons-pure-render-mixin';
+
+/** About page with basic infos and links to github repo */
+export class About extends React.Component {
+ static propTypes = {}
+
+ constructor(props) {
+ super(props);
+ this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
+ }
+
+ render() {
+ return
+
+
+ About
+
+
+
+
Mapital – Visual Map Editor for Mapbox GL
+
+ A free and open visual editor for the Mapbox GL styles targeted at developers and map designers. Creating your own custom map is easy with Mapital.
+
+
+ The source code is openly licensed and available on github.
+
+
+
+ }
+}
diff --git a/src/app.jsx b/src/app.jsx
index 446b9707..a19042a4 100644
--- a/src/app.jsx
+++ b/src/app.jsx
@@ -67,6 +67,10 @@ export default class App extends React.Component {
this.setState({ workContext: "settings" })
}
+ onOpenAbout() {
+ this.setState({ workContext: "about" })
+ }
+
onOpenLayers() {
this.setState({ workContext: "layers", })
}
@@ -88,6 +92,7 @@ export default class App extends React.Component {
onStyleUpload={this.onStyleUpload.bind(this)}
onStyleDownload={this.onStyleDownload.bind(this)}
onOpenSettings={this.onOpenSettings.bind(this)}
+ onOpenAbout={this.onOpenAbout.bind(this)}
onOpenLayers={this.onOpenLayers.bind(this)}
onOpenSources={this.onOpenSources.bind(this)}
/>
diff --git a/src/toolbar.jsx b/src/toolbar.jsx
index 098cdfa6..6885f891 100644
--- a/src/toolbar.jsx
+++ b/src/toolbar.jsx
@@ -13,6 +13,7 @@ import Fixed from 'rebass/dist/Fixed'
import MdFileDownload from 'react-icons/lib/md/file-download'
import MdFileUpload from 'react-icons/lib/md/file-upload'
import MdSettings from 'react-icons/lib/md/settings'
+import MdInfo from 'react-icons/lib/md/info'
import MdLayers from 'react-icons/lib/md/layers'
import MdSave from 'react-icons/lib/md/save'
import MdMap from 'react-icons/lib/md/map'
@@ -31,6 +32,8 @@ export class Toolbar extends React.Component {
onStyleSave: React.PropTypes.func,
// Open settings drawer
onOpenSettings: React.PropTypes.func,
+ // Open about page
+ onOpenAbout: React.PropTypes.func,
// Open sources drawer
onOpenSources: React.PropTypes.func,
// Open layers drawer
@@ -116,6 +119,13 @@ export class Toolbar extends React.Component {
+
+
+
}
}
diff --git a/src/workspace.jsx b/src/workspace.jsx
index 44390f64..7f9ff5be 100644
--- a/src/workspace.jsx
+++ b/src/workspace.jsx
@@ -2,6 +2,7 @@ import React from 'react'
import { LayerList } from './layers/list.jsx'
import { SourceList } from './sources/list.jsx'
import { SettingsEditor } from './settings.jsx'
+import { About } from './about.jsx'
import { colors, fullHeight } from './theme.js'
/** The workspace drawer contains the editor components depending on the edit
@@ -45,6 +46,10 @@ export class WorkspaceDrawer extends React.Component {
/>
}
+ if(this.props.workContext === "about") {
+ workspaceContent =
+ }
+
return