Merge pull request QasimWani#29 from QasimWani/dev

Linting files

.eslintrc

@@ -0,0 +1,14 @@
+{
+  "env": {
+    "browser": true,
+    "commonjs": true,
+    "es6": true,
+    "jquery": true,
+    "webextensions": true
+  },
+  "extends": ["airbnb", "prettier"],
+  "plugins": ["prettier"],
+  "rules": {
+    "prettier/prettier": ["error"]
+  }
+}

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "semi": true,
+  "trailingComma": "all",
+  "singleQuote": true,
+  "printWidth": 70,
+}

README.md

@@ -72,15 +72,25 @@ And that's what LeetHub is supposed to do: indirectly improving your coding skil
 ![leetcode view](assets/extension/leetcode.png)
 
 
-# How to get LeetHub to work locally?
+# How to set up LeetHub for local development?
 
 <ol>
-  <li>Fork this repo</li>
+  <li>Fork this repo and clone to your local machine</li>
   <li>Go to <a href="chrome://extensions">chrome://extensions</a> </li>
   <li>Enable <a href="https://www.mstoic.com/enable-developer-mode-in-chrome/">Developer mode</a> by toggling the switch on top right corner</li>
   <li>Click 'Load unpacked'</li>
   <li>Select the entire LeetHub folder</li>
+  <li>Run "npm run setup" to install the developer dependencies</li>
 </ol>
 
+Other npm commands available:
+
+```
+npm run               Show list of commands available
+npm run format        Auto-format JavaScript, HTML/CSS
+npm run format-test   Test all code is formatted properly
+npm run lint          Lint JavaScript
+npm run lint-test     Test all code is linted proprely
+```
 
 #### And that should be it! Get Hacking...

css/popup.css

@@ -1,33 +1,34 @@
 body {
-    width: 350px;
-    background-color: #dfd9d99d !important;
-    padding: 10px;
-    text-align:center;
-    transition: background-color .75s ease;
-    font-size:13px;
-
-    font-family: "Helvetica Neue", "Lucida Grande", sans-serif;
-  }
+  width: 350px;
+  background-color: #dfd9d99d !important;
+  padding: 10px;
+  text-align: center;
+  transition: background-color 0.75s ease;
+  font-size: 13px;
 
-  #title {
-    font-family: "Norwester", "Helvetica Neue", "Lucida Grande", sans-serif;
-    font-size: 30px;
-    font-weight: bold;
-    margin-bottom: 0px;
-    margin-top: 10px;
-  }
-
-  #caption {
-    font-family: "Norwester", "Helvetica Neue", "Lucida Grande", sans-serif;
-    font-size: 14px;
-    font-weight: normal;
-    margin-bottom: 0px;
-  }
+  font-family: 'Helvetica Neue', 'Lucida Grande', sans-serif;
+}
 
-  .onboarding
-  {
-    font-family: sans-serif;
-    border-top: solid black 1px;
-    font-weight: 500;
-    font-size: medium;
-  }
+#title {
+  font-family: 'Norwester', 'Helvetica Neue', 'Lucida Grande',
+    sans-serif;
+  font-size: 30px;
+  font-weight: bold;
+  margin-bottom: 0px;
+  margin-top: 10px;
+}
+
+#caption {
+  font-family: 'Norwester', 'Helvetica Neue', 'Lucida Grande',
+    sans-serif;
+  font-size: 14px;
+  font-weight: normal;
+  margin-bottom: 0px;
+}
+
+.onboarding {
+  font-family: sans-serif;
+  border-top: solid black 1px;
+  font-weight: 500;
+  font-size: medium;
+}

css/welcome.css

@@ -1,66 +1,65 @@
 body {
-    background-color: #000000 !important;
-    padding: 10px;
-    text-align:center;
-    transition: background-color .75s ease;
-    font-family: "Helvetica Neue", "Lucida Grande", sans-serif;
-  }
+  background-color: #000000 !important;
+  padding: 10px;
+  text-align: center;
+  transition: background-color 0.75s ease;
+  font-family: 'Helvetica Neue', 'Lucida Grande', sans-serif;
+}
 
-  #title {
-    font-family: "Norwester", "Helvetica Neue", "Lucida Grande", sans-serif;
-    font-size: 5em;
-    font-weight: bold;
-    margin-bottom: 0px;
-    margin-top: 10px;
-  }
-
-  .caption {
-    font-family: "Norwester", "Helvetica Neue", "Lucida Grande", sans-serif;
-    font-size: 1.5em;
-    font-weight: normal !important;
-    margin-top: 3px !important;
-    margin-bottom: 0px;
-  }
-  #error
-  {
-    font-family: "Norwester", "Helvetica Neue", "Lucida Grande", sans-serif;
-    font-weight: normal !important;
-    color: red !important;
-    margin-bottom: 0px;
-  }
-
-  #success
-  {
-    font-family: "Norwester", "Helvetica Neue", "Lucida Grande", sans-serif;
-    font-size: 1.1em;
-    font-weight: normal !important;
-    color: green !important;
-    margin-bottom: 0px;
-  }
+#title {
+  font-family: 'Norwester', 'Helvetica Neue', 'Lucida Grande',
+    sans-serif;
+  font-size: 5em;
+  font-weight: bold;
+  margin-bottom: 0px;
+  margin-top: 10px;
+}
 
-  #unlink
-  {
-    font-family: "Norwester", "Helvetica Neue", "Lucida Grande", sans-serif;
-    font-size: 1.1em;
-    font-weight: normal !important;
-    color: green !important;
-    margin-bottom: 0px;
-  }
+.caption {
+  font-family: 'Norwester', 'Helvetica Neue', 'Lucida Grande',
+    sans-serif;
+  font-size: 1.5em;
+  font-weight: normal !important;
+  margin-top: 3px !important;
+  margin-bottom: 0px;
+}
+#error {
+  font-family: 'Norwester', 'Helvetica Neue', 'Lucida Grande',
+    sans-serif;
+  font-weight: normal !important;
+  color: red !important;
+  margin-bottom: 0px;
+}
 
-  p
-  {
-    color: white !important;
-  }
-  .onboarding
-  {
-    font-family: sans-serif;
-    border-top: solid white 1px;
-    font-weight: 500;
-    font-size: medium;
-  }
+#success {
+  font-family: 'Norwester', 'Helvetica Neue', 'Lucida Grande',
+    sans-serif;
+  font-size: 1.1em;
+  font-weight: normal !important;
+  color: green !important;
+  margin-bottom: 0px;
+}
 
-  a
-  {
-    color:  white !important;
-    cursor: pointer;
-  }
+#unlink {
+  font-family: 'Norwester', 'Helvetica Neue', 'Lucida Grande',
+    sans-serif;
+  font-size: 1.1em;
+  font-weight: normal !important;
+  color: green !important;
+  margin-bottom: 0px;
+}
+
+p {
+  color: white !important;
+}
+.onboarding {
+  font-family: sans-serif;
+  border-top: solid white 1px;
+  font-weight: 500;
+  font-size: medium;
+}
+
+a {
+  color: white !important;
+  cursor: pointer;
+}