diff --git a/src/components/Layout.jsx b/src/components/Layout.jsx
index dc425afd..bf5f61c9 100644
--- a/src/components/Layout.jsx
+++ b/src/components/Layout.jsx
@@ -18,7 +18,7 @@ export default class Layout extends React.Component {
getChildContext() {
return {
- reactIconBase: { size: 20 }
+ reactIconBase: { size: 14 }
}
}
diff --git a/src/components/Toolbar.jsx b/src/components/Toolbar.jsx
index 74e02074..f2645ed0 100644
--- a/src/components/Toolbar.jsx
+++ b/src/components/Toolbar.jsx
@@ -19,14 +19,21 @@ import SettingsModal from './modals/SettingsModal'
import TilesetsModal from './modals/TilesetsModal'
import style from '../libs/style'
-import colors from '../config/colors';
+import colors from '../config/colors'
+import { margins, fontSizes } from '../config/scales'
-const InlineBlock = props =>
+const IconText = props =>
{props.children}
-
+
const ToolbarAction = props =>
+ style={{
+ display: "inline-block",
+ padding: margins[1],
+ fontSize: fontSizes[4],
+ cursor: "pointer",
+ ...props.style,
+ }}>
{props.children}
@@ -64,23 +71,19 @@ export default class Toolbar extends React.Component {
saveButton() {
if(this.props.mapStyle.layers.length > 0) {
- return
-
-
- Save
-
-
+ return
+
+ Save
+
}
return null
}
downloadButton() {
- return
-
-
- Download
-
-
+ return
+
+ Download
+
}
toggleSettings() {
@@ -113,50 +116,38 @@ export default class Toolbar extends React.Component {
open={this.state.openTilesetsModal}
toggle={() => this.toggleSettings.bind(this)}
/>
-
-
-
- Maputnik
-
-
-
+
+
+ Maputnik
+
+
-
-
- Open
-
+
+ Open
-
+
{this.downloadButton()}
{this.saveButton()}
-
-
-
- Tilesets
-
-
-
-
-
- Style Settings
-
-
-
-
-
- Inspect
-
-
-
-
-
- Help
-
-
+
+
+ Tilesets
+
+
+
+ Style Settings
+
+
+
+ Inspect
+
+
+
+ Help
+
}
}