Use Material UI; improve Preferences Page

New principles for our UI:

- Components should use inline styles whenever possible
- Let's shrink the size of main.css to < 100 lines over time so it just
contains typography and basic styles
- Always require just the individual component that is needed from
Material UI so that the whole library doesn't get loaded (important for
startup perf)
This commit is contained in:
Feross Aboukhadijeh
2016-08-22 17:53:29 -07:00
parent b4976d27f2
commit 1a01d7ed92
14 changed files with 234 additions and 383 deletions

View File

@@ -3,22 +3,11 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>WebTorrent Desktop</title>
<link rel="stylesheet" href="css/components/Button.css">
<link rel="stylesheet" href="css/components/PathSelector.css">
<link rel="stylesheet" href="css/components/TextInput.css">
<link rel="stylesheet" href="css/pages/PreferencesPage.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="main.css">
</head>
<body>
<!-- React prints a warning if you render to <body> directly -->
<div id='body'></div>
<!-- We can't just say src='...main.js', that breaks require()s -->
<script>
require('../build/renderer/main.js')
</script>
<script>require('../build/renderer/main.js')</script>
</body>
</html>