✔️ Added init tutorial

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: _config.yml new file: _includes/wallet/add.md new file: _includes/wallet/init.md new file: _includes/wallet/list.md modified: _layouts/default.html new file: _layouts/wallet.html modified: assets/css/style.scss new file: assets/js/wallet.js modified: usage.md
ChacaS0 · Mar 20, 2018 · a329a1d · a329a1d
1 parent 54a911b
commit a329a1d
Show file tree

Hide file tree

Showing 9 changed files with 134 additions and 9 deletions.
diff --git a/_config.yml b/_config.yml
@@ -18,4 +18,4 @@ site.pages:
 plugins:
   - jemoji
 
-url: https://chacas0.github.io/tempest
+url: https://chacas0.github.io/tempest
diff --git a/_includes/wallet/add.md b/_includes/wallet/add.md
@@ -0,0 +1,4 @@
+
+In this section, we'll see how to add a ``target`` to **TEMPest**, shall we begin? :smile_cat:
+
+<script src="https://asciinema.org/a/170840.js" id="asciicast-170840" async></script>
diff --git a/_includes/wallet/init.md b/_includes/wallet/init.md
@@ -0,0 +1,9 @@
+
+<script src="https://asciinema.org/a/170840.js" id="asciicast-170840" async></script>
+
+### [](#head-init-1)What we do:
+- ``tempest init``: initialize **TEMPest**
+- ``cat ~/.tempestcf``: check if it was created
+- ``cat ~/.tempest.yaml``: check if the config file was created with default values
+
+:point_right: Now that you have that, we can enjoy **TEMPest** !
diff --git a/_includes/wallet/list.md b/_includes/wallet/list.md
@@ -0,0 +1 @@
+**Listing stuff with TEMPest**
diff --git a/_layouts/default.html b/_layouts/default.html
@@ -15,7 +15,8 @@
     <!-- Latest compiled JavaScript -->
     <!-- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> -->
     <!-- Latest jQuery slim minified -->
-    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E=" crossorigin="anonymous"></script>
+    <!-- <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E=" crossorigin="anonymous"></script> -->
+    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
     <!-- FAVICO -->
     <link rel="shortcut icon" type="image/x-icon" href="https://image.ibb.co/c829L7/logo_v5_small.gif" >
     <!-- My JS -->
@@ -46,7 +47,7 @@ <h2 class="project-tagline">{{ site.description | default: site.github.project_t
 
       <footer class="site-footer">
         {% if site.github.is_project_page %}
-          <span class="site-footer-owner"><a href="{{ site.github.repository_url }}">{{ site.github.repository_name }}</a> is maintained by <a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a>.</span>
+          <span class="site-footer-owner"><a href="{{ site.github.repository_url }}">TEMPest</a> is maintained by <a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a>.</span>
         {% endif %}
         <span class="site-footer-credits">This page was generated by <a href="https://pages.github.com">GitHub Pages</a>.</span>
       </footer>

diff --git a/_layouts/wallet.html b/_layouts/wallet.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html lang="{{ site.lang | default: "en-US" }}">
+  <head>
+    <meta charset="UTF-8">
+
+{% seo %}
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="theme-color" content="#157878">
+    <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
+    <link rel="stylesheet" href="{{ '/assets/css/style.css?v=' | append: site.github.build_revision | relative_url }}">
+    <!-- Latest compiled and minified CSS -->
+    <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> -->
+    <!-- jQuery library -->
+    <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> -->
+    <!-- Latest compiled JavaScript -->
+    <!-- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> -->
+    <!-- Latest jQuery slim minified -->
+    <!-- <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E=" crossorigin="anonymous"></script> -->
+    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
+    <!-- FAVICO -->
+    <link rel="shortcut icon" type="image/x-icon" href="https://image.ibb.co/c829L7/logo_v5_small.gif" >
+    <!-- My JS -->
+    <script src="/assets/js/wallet.js"></script>
+  </head>
+  <body>
+    <section class="page-header">
+      <a class="main-title" href="{{site.url}}"><h1 class="project-name">{{ site.title | default: site.github.repository_name }}</h1></a>
+      <h2 class="project-tagline">{{ site.description | default: site.github.project_tagline }}</h2>
+      <!-- <hr> -->
+      {% if site.github.is_project_page %}
+      <!-- MENU -->
+        <a href="{{ site.github.repository_url }}" class="btn" target="_blank">View on GitHub</a>
+        <a href="{{site.url}}/install" class="btn">Installation</a>
+        <a href="{{site.url}}/usage" class="btn">Usage</a>
+        <a href="{{site.url}}/about" class="btn">About</a>
+        <a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=TQYU8BPPV5YWA" target="_blank" title="Redirects to Paypal" class="btn">Donate</a>
+      {% endif %}
+      <!-- //MENU -->
+    </section>
+
+    <section class="main-content">
+		{{ content }}
+		<div id="wallet1" class="wallet">
+      <!-- WALLET -->
+      <!-- INIT -->
+			<h2 id="wall-init" class="wall-head">Initialization</h2>
+			<div id="wall-ctnt1" class="wall-ctnt">
+				{% capture wallet-init %}{% include wallet/init.md %}{% endcapture %}
+				{{ wallet-init | 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>
+
+      <footer class="site-footer">
+        {% if site.github.is_project_page %}
+          <span class="site-footer-owner"><a href="{{ site.github.repository_url }}">TEMPest</a> is maintained by <a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a>.</span>
+        {% endif %}
+        <span class="site-footer-credits">This page was generated by <a href="https://pages.github.com">GitHub Pages</a>.</span>
+      </footer>
+    </section>
+
+    {% if site.google_analytics %}
+      <script type="text/javascript">
+        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+        })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+        ga('create', '{{ site.google_analytics }}', 'auto');
+        ga('send', 'pageview');
+      </script>
+    {% endif %}
+  </body>
+</html>
diff --git a/assets/css/style.scss b/assets/css/style.scss
@@ -25,6 +25,14 @@
 	color: inherit; /* blue colors for links too */
 	text-decoration: inherit; /* no underline */
 }
-// .working-img{
-// 	margin-left: 15%;
-// }
+.wall-head{
+	border-bottom: solid 1px;
+	// border: solid 1px;
+	border-color: rgba(15.7%, 46.3%, 47.5%, 0.71);
+	padding: 1%;
+	// border-radius: 8px;
+}
+.wall-head:hover{
+	// background-color: rgba(15.7%, 46.3%, 47.5%, 0.214);
+	cursor: pointer;
+}
diff --git a/assets/js/wallet.js b/assets/js/wallet.js
@@ -0,0 +1,15 @@
+$(document).ready(function(){
+
+	// Wallet presets
+	$(".wall-ctnt").hide();
+	// Wallet Title, showing / hiding content
+	$(".wall-head").click(function(event){
+		// hide others
+		$(".wall-ctnt:visible").toggle("slow");
+
+		// show the right one
+		$("#"+event.target.id).next().toggle("slow");
+
+	});
+
+});
diff --git a/usage.md b/usage.md
@@ -1,10 +1,11 @@
 ---
-layout: default
+layout: wallet
 ---
 
 # [](#header-3)How to use TEMPest
 
-## Coming Soon !
-<img class="working-img" src="https://upload.wikimedia.org/wikipedia/commons/6/68/Man_Lifting_Dumbbells_GIF_Animation_Loop.gif" width="auto" height="auto">
+<!-- ## Coming Soon ! -->
+<!-- <img class="working-img" src="https://upload.wikimedia.org/wikipedia/commons/6/68/Man_Lifting_Dumbbells_GIF_Animation_Loop.gif" width="auto" height="auto"> -->
 <!-- <img class="working-img" src="https://upload.wikimedia.org/wikipedia/commons/4/4b/Man_Thinking_GIF_Animation_Loop.gif" width="auto" height="auto"> -->
 <!-- <img class="working-img" src="https://upload.wikimedia.org/wikipedia/commons/7/71/Corporate_Woman_Working_at_her_Desk_GIF_Animation_Loop.gif" width="auto" height="auto"> -->
+