Preferences page rehaul: use React components, UI improvements

static/css/components/Button.css

@@ -0,0 +1,76 @@
+.Button {
+  -webkit-app-region: no-drag;
+  background: transparent;
+  border-radius: 3px;
+  border: none;
+  color: #aaa;
+  cursor: default;
+  font-size: 14px;
+  font-weight: bold;
+  margin-left: 10px;
+  outline: none;
+  padding: 0;
+  padding: 7px 18px;
+  text-transform: uppercase;
+}
+
+/**
+ * Default button
+ */
+
+.Button.default {
+  color: #222;
+  background-color: rgba(153, 153, 153, 0.1);
+}
+
+.Button.default.dark {
+  color: #eee;
+}
+
+.Button.default:hover,
+.Button.default:focus { /* Material design: focused */
+  background-color: rgba(153, 153, 153, 0.2);
+}
+
+.Button.default:active { /* Material design: pressed */
+  background-color: rgba(153, 153, 153, 0.4);
+}
+
+/**
+ * Flat button
+ */
+
+.Button.flat {
+  color: #222;
+}
+
+.Button.flat.dark {
+  color: #eee;
+}
+
+.Button.flat:hover,
+.Button.flat:focus {
+  background-color: rgba(153, 153, 153, 0.2);
+}
+
+.Button.flat:active {
+  background-color: rgba(153, 153, 153, 0.4);
+}
+
+/**
+ * Raised button
+ */
+
+.Button.raised {
+  background-color: #2196f3;
+  color: #eee;
+}
+
+.Button.raised:hover,
+.Button.raised:focus {
+  background-color: #38a0f5;
+}
+
+.Button.raised:active {
+  background-color: #51abf6;
+}

static/css/components/PathSelector.css

@@ -0,0 +1,17 @@
+.PathSelector {
+  align-items: center;
+  display: flex;
+  width: 100%;
+}
+
+.PathSelector .label {
+  margin-right: 10px;
+  flex: 1 1 auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.PathSelector .input {
+  flex: 5 5 200px;
+}

static/css/components/TextInput.css

@@ -0,0 +1,18 @@
+.TextInput {
+  background: rgba(255, 255, 255, 0.8);
+  border-radius: 3px;
+  font-size: 14px;
+  outline: none;
+  padding: 3px 6px;
+  width: 200px;
+  -webkit-app-region: no-drag;
+  cursor: default;
+}
+
+.TextInput.light {
+  border: 1px solid rgba(0, 0, 0, 0.4);
+}
+
+.TextInput.dark {
+  border: 1px solid rgba(0, 0, 0, 0.8);
+}