✔️🎨 Added tutorial for add command, and ui improvements

 Issues related:
 	-> #19 Documentation
 	-> #22 Tutorial

 On branch gh-pages
 Your branch is up to date with 'origin/gh-pages'.

 Changes to be committed:
	modified:   _includes/js/wallet.js
	modified:   _includes/wallet/add.md
	modified:   _includes/wallet/init.md
	modified:   _layouts/wallet.html

_includes/js/wallet.js

@@ -9,7 +9,20 @@ $(document).ready(function(){
 
 		// show the right one
 		$("#"+event.target.id).next().toggle("slow");
-
+
+		// scroll to it
+		$.wait(1200).then(
+			$('html, body').animate({
+				scrollTop: $("#"+event.target.id).offset().top
+			}, 1000)
+		);
 	});
 
-});
+});
+
+// create the wait function...ish
+$.wait = function(ms) {
+	var defer = $.Deferred();
+	setTimeout(function() { defer.resolve(); }, ms);
+	return defer;
+};

_includes/wallet/add.md

@@ -1,3 +1,12 @@
 
 In this section, we'll see how to add a ``target`` to **TEMPest**, shall we begin? :smile_cat:
 
+<script src="https://asciinema.org/a/171117.js" id="asciicast-171117" async></script>
+
+### [](#head-add-1)The \*\*\*\*\* we doing:
+- ``tempest list``: Listing available targets (checking if there are any already set).
+- ``tempest add /tmp``: Add ``/tmp`` as a target for **TEMPest**.
+- ``tempest add ~/Documents/temp/ ~/Downloads/temp``: Add those two as targets, so we can add as many as we want in one command, ending by a ``/`` or not.
+- ``tempest add``: Add the current directory as a target for **TEMPest**.
+
+> **\#Note:** You cannot add multiple times the same target, or a target that doesnt exist.

_includes/wallet/init.md

@@ -1,7 +1,7 @@
 
 <script src="https://asciinema.org/a/170840.js" id="asciicast-170840" async></script>
 
-### [](#head-init-1)What we do:
+### [](#head-init-1)The \*\*\*\*\* we doing:
 - ``tempest init``: initialize **TEMPest**
 - ``cat ~/.tempestcf``: check if it was created
 - ``cat ~/.tempest.yaml``: check if the config file was created with default values

_layouts/wallet.html

@@ -52,18 +52,18 @@ <h2 id="wall-init" class="wall-head">Initialization</h2>
 				{% capture wallet-init %}{% include wallet/init.md %}{% endcapture %}
 				{{ wallet-init | markdownify }}
       </div>
+      <!-- LIST -->
+      <h2 id="wall-list" class="wall-head">List targets </h2>
+      <div id="wall-ctnt3" class="wall-ctnt">
+        {% capture wallet-list %}{% include wallet/list.md %}{% endcapture %}
+        {{ wallet-list | markdownify }}
+      </div>
       <!-- ADD -->
 			<h2 id="wall-add" class="wall-head">Add targets </h2>
 			<div id="wall-ctnt2" class="wall-ctnt">
 				{% capture wallet-add %}{% include wallet/add.md %}{% endcapture %}
 				{{ wallet-add | markdownify }}
       </div>
-      <!-- LIST -->
-			<h2 id="wall-list" class="wall-head">List targets </h2>
-			<div id="wall-ctnt3" class="wall-ctnt">
-				{% capture wallet-list %}{% include wallet/list.md %}{% endcapture %}
-				{{ wallet-list | markdownify }}
-			</div>
 			<!-- //WALLET -->
 		</div>