Use Prettier and EditorConfig for formatting

.editorconfig

@@ -0,0 +1,10 @@
+# editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 4
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true

package.json

@@ -1,15 +1,23 @@
 {
-  "name": "make-a-readme",
-  "description": "Website for explaining what a README is",
-  "version": "0.1.0",
-  "scripts": {
-    "start": "yarn install && live-server --no-browser public"
-  },
-  "repository": "https://github.com/dguo/make-a-readme",
-  "author": "Danny Guo",
-  "license": "MIT",
-  "private": true,
-  "devDependencies": {
-    "live-server": "1.2.1"
-  }
+    "name": "make-a-readme",
+    "description": "Website for explaining what a README is",
+    "version": "0.1.0",
+    "scripts": {
+        "format": "prettier --write package.json public/*",
+        "format:check": "prettier --list-different package.json public/*",
+        "start": "yarn install && live-server --no-browser public"
+    },
+    "repository": "https://github.com/dguo/make-a-readme",
+    "author": "Danny Guo",
+    "license": "MIT",
+    "private": true,
+    "devDependencies": {
+        "live-server": "1.2.1",
+        "prettier": "1.15.3"
+    },
+    "prettier": {
+        "bracketSpacing": false,
+        "singleQuote": true,
+        "tabWidth": 4
+    }
 }

public/index.css

@@ -2,12 +2,16 @@ html {
     font-family: 'Open Sans', sans-serif;
 }
 
-a, #yet, .message a:not(.button):not(.tag) {
+a,
+#yet,
+.message a:not(.button):not(.tag) {
     color: hsl(348, 100%, 61%);
     text-decoration: none;
 }
 
-a:hover, #yet:hover, .message a:not(.button):hover {
+a:hover,
+#yet:hover,
+.message a:not(.button):hover {
     color: hsl(348, 60%, 61%);
     text-decoration: none;
 }
@@ -16,7 +20,8 @@ h1 {
     margin-top: 0.5em;
 }
 
-h3, p {
+h3,
+p {
     margin-top: 1em;
 }
 
@@ -42,11 +47,13 @@ h3, p {
     max-width: 800px;
 }
 
-#template, #faq {
+#template,
+#faq {
     background-color: hsl(0, 0%, 21%);
 }
 
-textarea, #rendered {
+textarea,
+#rendered {
     margin: auto;
     display: block;
     width: 95%;
@@ -70,7 +77,8 @@ textarea {
     list-style: unset;
 }
 
-#rendered code, .message-body code {
+#rendered code,
+.message-body code {
     color: #24292e;
 }
 
@@ -79,7 +87,7 @@ textarea {
 }
 
 .message-body code {
-    background-color: rgba(27, 31, 35, .05);
+    background-color: rgba(27, 31, 35, 0.05);
 }
 
 article {