improve menu item styles

Author: ShMcK

lib/components/AppMenu/MenuLink/index.js

@@ -17,14 +17,18 @@ var React = require('react');
 var react_redux_1 = require('react-redux');
 var MenuItem_1 = require('material-ui/MenuItem');
 var actions_1 = require('../../../actions');
+var styles = {
+    textAlign: 'center',
+    padding: '10px 5px',
+};
 var MenuLink = (function (_super) {
     __extends(MenuLink, _super);
     function MenuLink() {
         _super.apply(this, arguments);
     }
     MenuLink.prototype.render = function () {
         var _a = this.props, route = _a.route, title = _a.title, routeTo = _a.routeTo;
-        return (React.createElement(MenuItem_1.default, {primaryText: title ? title : route, onTouchTap: routeTo.bind(this, route), key: route}));
+        return (React.createElement(MenuItem_1.default, {style: styles, primaryText: title ? title : route, onTouchTap: routeTo.bind(this, route), key: route}));
     };
     MenuLink = __decorate([
         react_redux_1.connect(null, function (dispatch) {

lib/components/AppMenu/Quit/index.js

@@ -18,13 +18,17 @@ var react_redux_1 = require('react-redux');
 var mount_1 = require('../../mount');
 var subscriptions_1 = require('../../../atom/subscriptions');
 var MenuItem_1 = require('material-ui/MenuItem');
+var styles = {
+    textAlign: 'center',
+    padding: '10px 5px',
+};
 var Quit = (function (_super) {
     __extends(Quit, _super);
     function Quit() {
         _super.apply(this, arguments);
     }
     Quit.prototype.render = function () {
-        return (React.createElement(MenuItem_1.default, {key: 'quit', onClick: this.props.quit}, "quit"));
+        return (React.createElement(MenuItem_1.default, {style: styles, key: 'quit', onClick: this.props.quit}, "quit"));
     };
     Quit = __decorate([
         react_redux_1.connect(null, function (dispatch) {

src/components/AppMenu/MenuLink/index.tsx

@@ -3,6 +3,11 @@ import {connect} from 'react-redux';
 import MenuItem from 'material-ui/MenuItem';
 import {pageSet, routeSet} from '../../../actions';
 
+const styles = {
+  textAlign: 'center',
+  padding: '10px 5px',
+};
+
 @connect(null, (dispatch) => {
   return {
     routeTo: (route: string) => dispatch(routeSet(route)),
@@ -15,6 +20,7 @@ export class MenuLink extends React.Component<{
     const {route, title, routeTo} = this.props;
     return (
       <MenuItem
+        style={styles}
         primaryText={title ? title : route}
         onTouchTap={routeTo.bind(this, route)}
         key={route}

src/components/AppMenu/Quit/index.tsx

@@ -4,6 +4,11 @@ import {togglePanel} from '../../mount';
 import {onDeactivate} from '../../../atom/subscriptions';
 import MenuItem from 'material-ui/MenuItem';
 
+const styles = {
+  textAlign: 'center',
+  padding: '10px 5px',
+};
+
 @connect(null, (dispatch) => {
   return {
     quit: () => {
@@ -18,6 +23,7 @@ export class Quit extends React.Component<{
   render() {
     return (
       <MenuItem
+        style={styles}
         key='quit'
         onClick={this.props.quit}
         >