starts adding keyboard logo

src/Main/Sidebar/Logo/index.jsx

@@ -1,19 +1,16 @@
-import React, { Component } from 'react';
+import React from 'react';
 import CSSModules from 'react-css-modules';
 import styles from './styles.scss';
 
 
 import logo from "./images/logo.svg";
 
-class Logo extends Component {
-	render() {
-
-		return (
-			<div styleName='Logo'>
-				<div dangerouslySetInnerHTML={{__html: logo}} />
-			</div>
-		);
-	}
+function Logo() {
+	return (
+		<div styleName='Logo'>
+			<div dangerouslySetInnerHTML={{__html: logo}} />
+		</div>
+	);
 }
 
 

src/Main/Toolbox/Keyboard/Keys/Key/index.jsx

@@ -5,7 +5,6 @@ import keybind from './utils/keybind';
 import _ from 'lodash';
 
 
-
 class Key extends Component {
 	static propTypes = {
     synth: React.PropTypes.object.isRequired,

src/Main/Toolbox/Keyboard/Keys/Key/utils/keybind.js

@@ -25,8 +25,8 @@ const keys = {};
 function keybind(note, trigger, release) {
   const code = KEYMAP[note];
 
-  document.addEventListener('keydown', () => onKeyDown(code, trigger));
-  document.addEventListener('keyup', () => onKeyUp(code, release));
+  document.addEventListener('keydown', e => onKeyDown(code, trigger, e));
+  document.addEventListener('keyup', e => onKeyUp(code, release, e));
 }
 
 function onKeyDown(code, cb, e) {

src/Main/Toolbox/Keyboard/Logo/index.jsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import CSSModules from 'react-css-modules';
+import styles from './styles.scss';
+
+
+import logo from "./images/logo.svg";
+
+function Logo() {
+	return (
+		<div styleName='Logo'>
+			<div dangerouslySetInnerHTML={{__html: logo}} />
+		</div>
+	);
+}
+
+
+export default CSSModules(Logo, styles);

src/Main/Toolbox/Keyboard/Logo/styles.scss

@@ -0,0 +1,5 @@
+@import "./src/styles/base";
+
+:local(.Logo) {
+  background-color: #fff;
+}