Get rid of Bootstrap

app/renderer/components/Button.scss

@@ -1,7 +1,7 @@
 @import '../styles/variables';
 
 .Button {
-	--line-height: 34px;
+	--line-height: 35px;
 	display: inline-block;
 	min-width: 86px;
 	padding: 0 20px;

app/renderer/components/Input.js

@@ -52,7 +52,7 @@ const Input = ({
 					readOnly={readOnly}
 					onChange={event => {
 						if (onChange) {
-							onChange(event.target.value);
+							onChange(event.target.value, event);
 						}
 					}}
 				/>

app/renderer/styles/index.scss

@@ -1,4 +1,5 @@
-@import 'toolkit-inverse';
+@import '~modern-normalize/modern-normalize.css';
+@import './modern-base.css';
 @import '~sass-extras/index';
 @import './fonts';
 @import './variables';
@@ -13,6 +14,7 @@ body {
 	background-color: $background-color;
 	font-family: 'Source Sans Pro', sans-serif;
 	font-weight: normal;
+	color: #fff;
 }
 
 .dark-mode body {
@@ -41,6 +43,8 @@ p {
 	color: #7f8fa4;
 	font-size: 1rem;
 	line-height: 1.5rem;
+	margin-top: 0;
+	margin-bottom: 1rem;
 }
 
 p.secondary {
@@ -65,6 +69,7 @@ h4,
 h5,
 h6 {
 	margin-top: 0;
+	margin-bottom: 0.5rem;
 }
 
 h1,
@@ -89,7 +94,50 @@ button:focus {
 	outline: 0;
 }
 
+input,
+button,
+select,
+optgroup,
+textarea {
+	margin: 0;
+	font-family: inherit;
+	font-size: inherit;
+	line-height: inherit;
+}
+
 /* Bootstrap overrides */
 .form-group {
 	margin-bottom: 10px;
 }
+
+
+// Table
+table {
+	border-spacing: 0;
+	width: 100%;
+	border-collapse: collapse;
+}
+
+td,
+th {
+	padding: 1.2rem 1.5rem;
+	text-align: left;
+}
+
+thead tr {
+	border-bottom: 0.1rem solid white(30%);
+}
+
+tbody tr {
+	border-bottom: 0.1rem solid white(10%);
+}
+
+td:first-child,
+th:first-child {
+	padding-left: 0;
+}
+
+td:last-child,
+th:last-child {
+	padding-right: 0;
+}

app/renderer/styles/modern-base.css

@@ -0,0 +1,146 @@
+
+/*! modern-base | MIT License | https://github.com/sindresorhus/modern-normalize */
+
+
+/**
+ * Improve font rendering on HiDPI devices.
+ */
+
+@media
+	screen and (-webkit-min-device-pixel-ratio: 2),
+	screen and (min-resolution: 2dppx) {
+	body {
+		-moz-osx-font-smoothing: grayscale;
+		-webkit-font-smoothing: antialiased;
+	}
+}
+
+/**
+ * Break up words and URLs so they don't break your layout.
+ */
+
+html {
+	word-break: break-all;
+}
+
+/**
+ * Remove default spacing.
+ */
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+figure,
+blockquote,
+dd,
+dl,
+pre {
+	margin: 0;
+}
+
+/**
+ * Show link underline only on hover.
+ */
+
+a {
+	text-decoration: none;
+}
+
+a:hover {
+	text-decoration: underline;
+}
+
+/**
+ * Remove outline on active/hovered focused links.
+ */
+
+a:active,
+a:hover {
+	outline-width: 0;
+}
+
+/**
+ * Correct the text style of placeholders in Chrome and Safari.
+ * See discussion: https://github.com/necolas/normalize.css/issues/550
+ */
+
+::-webkit-input-placeholder {
+	color: inherit;
+	opacity: 0.54;
+}
+
+/**
+ * Remove text shadow from selections.
+ */
+
+::selection {
+	background: #b3d7fd;
+	text-shadow: none;
+}
+
+/**
+ * Remove outline from `:focus` pseudo element.
+ * Note: Don't forget to apply some styling for the focus state of elements that support it.
+ */
+
+:focus {
+	outline-width: 0;
+}
+
+/**
+ * Remove the list style on navigation lists.
+ */
+
+nav ol,
+nav ul {
+	list-style: none;
+}
+
+/**
+ * Better looking default horizontal rule
+ */
+
+hr {
+	display: block;
+	margin: 1em 0;
+	padding: 0;
+	border: 0;
+	border-top: 1px solid #ccc;
+}
+
+/**
+ * Remove default fieldset styles.
+ */
+
+fieldset {
+	margin: 0;
+	padding: 0;
+	border: 0;
+}
+
+/**
+ * Allow only vertical resizing of textareas.
+ */
+
+textarea {
+	resize: vertical;
+}
+
+
+/**
+ * Remove the gap between these elements and the bottom of their containers.
+ * See: https://github.com/h5bp/html5-boilerplate/issues/440
+ */
+
+svg,
+img,
+canvas,
+video,
+audio,
+iframe {
+	vertical-align: middle;
+}

app/renderer/views/History.js

@@ -19,8 +19,8 @@ const History = () => {
 
 	return (
 		<TabView title="History">
-			<div style={{overflow: 'auto', maxHeight: 400}}>
-				<table className="table">
+			<div>
+				<table style={{maxHeight: 400}}>
 					<thead>
 						<tr>
 							<th>

app/renderer/views/Preferences.js

@@ -1,21 +1,22 @@
 import electron from 'electron';
 import React from 'react';
 import _ from 'lodash';
+import Input from '../components/Input';
 import TabView from './TabView';
 
 const config = electron.remote.require('./config');
 
 class Form extends React.Component {
 	state = {
-		marketmakerUrl: config.get('marketmakerUrl'),
+		marketmakerUrl: config.get('marketmakerUrl') || '',
 	};
 
 	persistState = _.debounce((name, value) => {
 		config.set(name, value);
 	}, 500);
 
-	handleChange = event => {
-		const {name, value} = event.target;
+	handleChange = (value, event) => {
+		const {name} = event.target;
 		this.setState({[name]: value});
 		this.persistState(name, value);
 	};
@@ -27,8 +28,7 @@ class Form extends React.Component {
 					<label htmlFor="marketmakerUrl">
 						Custom Marketmaker URL: <small>(Requires app restart)</small>
 					</label>
-					<input
-						className="form-control"
+					<Input
 						name="marketmakerUrl"
 						value={this.state.marketmakerUrl}
 						onChange={this.handleChange}

app/renderer/views/TabView.js

@@ -7,9 +7,9 @@ import './TabView.scss';
 const TabView = props => (
 	<div className="TabView">
 		<header className="toolbar">
-			<h6 className="portfolio-name">
+			<h4 className="portfolio-name">
 				HyperDEX
-			</h6>
+			</h4>
 			<div className="portfolio-dropdown">
 				<div className="avatar-wrapper">
 					<img src={avatar(appContainer.state.portfolio.name)}/>

app/renderer/views/TabView.scss

@@ -31,7 +31,7 @@ h6 {
 		.portfolio-name {
 			flex: auto;
 			align-items: start;
-			font-weight: 500; // TODO: Remove this when bootstrap is gone
+			font-weight: 500;
 		}
 
 		.portfolio-dropdown {

package.json

@@ -14,9 +14,8 @@
 	"dependencies": {
 		"bip39": "^2.5.0",
 		"crypto-hash": "^0.1.0",
-		"delay": "^2.0.0",
-		"jquery": "^3.2.1",
 		"lodash": "^4.17.4",
+		"modern-normalize": "^0.4.0",
 		"p-queue": "^2.3.1",
 		"randoma": "^1.2.0",
 		"react": "^16.2.0",