design

gustavoquinalha · Dec 13, 2017 · ad0f5c1 · ad0f5c1
1 parent 43f3c91
commit ad0f5c1
Show file tree

Hide file tree

Showing 279 changed files with 1,618 additions and 465 deletions.
diff --git a/_config.yml b/_config.yml
@@ -6,13 +6,15 @@
 # 'jekyll serve'. If you change this file, please restart the server process.
 
 # Site settings
-title: Help Center
+title: "Help Center"
 email: gusquinalha@gmail.com
 description: "Jekyll Help Center theme."
 baseurl: "/jekyll-help-center-theme"
-url: "http://quinalham.me/jekyll-help-center-theme"
-twitter_username: gustavoquinalha
-github_username:  gustavoquinalha
+url: "http://quinalha.me/jekyll-help-center-theme"
+twitter_username: "gustavoquinalha"
+github_username:  "gustavoquinalha"
+color_theme:  "#00d46a"
+color_text:  "#fff"
 
 # Build settings
 markdown: kramdown

diff --git a/_data/first.yml b/_data/first.yml
@@ -1,11 +1,15 @@
-- question: Question 1
-  answer: Answer 1
+- question: "Question 1"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
+  image: "1.gif"
 
-- question: Question 2
-  answer: Answer 2
+- question: "Question 2"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
+  image: "2.gif"
 
-- question: Question 3
-  answer: Answer 3
+- question: "Question 3"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
+  image: "3.gif"
 
-- question: Question 4
-  answer: Answer 4
+- question: "Question 4"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
+  image: "4.gif"
diff --git a/_data/second.yml b/_data/second.yml
@@ -1,11 +1,12 @@
-- question: Deployment question 1
-  answer: Answer 1
+- question: "Question 1"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
+  image: "4.gif"
 
-- question: Deployment question 2
-  answer: Answer 2
+- question: "Question 2"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
 
-- question: Deployment question 3
-  answer: Answer 3
+- question: "Question 3"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
 
-- question: Deployment question 4
-  answer: Answer 4
+- question: "Question 4"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
diff --git a/_data/third.yml b/_data/third.yml
@@ -1,11 +1,11 @@
-- question: Command line question 1
-  answer: Answer 1
+- question: "Question 1"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
 
-- question: Command line question 2
-  answer: Answer 2
+- question: "Question 2"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
 
-- question: Command line question 3
-  answer: Answer 3
+- question: "Question 3"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
 
-- question: Command line question 4
-  answer: Answer 4
+- question: "Question 4"
+  answer: "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
diff --git a/_includes/breadcrumbs.html b/_includes/breadcrumbs.html
@@ -0,0 +1,23 @@
+{% assign categories = include.path | split:"/" %}
+{% assign filename_without_extension = categories | last | split:"." | first %}
+{% if categories contains "_posts" or filename_without_extension == "index" %}
+{% comment %} posts are like /docs/python/_posts/2016-06-06-foobar.md {% endcomment %}
+{% comment %} OR pages are index.* i.e.: like /docs/python/index.md or index.html {% endcomment %}
+{% assign categories = categories | pop %}
+{% endif %}
+
+{% assign route="" %}
+
+<div class="container wrap breadcrumbs">
+  <a href="{{ '/' | absolute_url }}">Home</a>
+  {% for category in categories %}
+  <span class="prompt margin-left-10 margin-right-10">></span>
+  {% assign route = route | append: '/' | append: category %}
+  {% if forloop.last %}
+  {% if include.title %}{{include.title}}{% else %}{{ category }}{% endif %}
+  {% else %}
+  <a href="{{ route | absolute_url }}">{{ category }}</a>
+  {% endif %}
+  {% endfor %}
+
+</div>
diff --git a/_includes/footer.html b/_includes/footer.html
@@ -2,13 +2,12 @@
   <div class="footer container column align-items-center justify-content-center">
 
     <div class="footer--block text-align-center">
-
-      <div class="">
+      <div class="" data-aos="fade-up" data-aos-delay="" data-aos-offset="0">
         <a href="{{ site.baseurl }}/"><span>Jekyll |</span> {{ site.title }}</a>
       </div>
 
-      <div class="by">
-        Created with jekyll by <a href="https://github.com/gustavoquinalha/jekyll-help-center-theme" target="_blank">@gustavoquinalha</a>
+      <div class="by" data-aos="fade-up" data-aos-delay="200" data-aos-offset="0">
+        <a href="https://github.com/gustavoquinalha/jekyll-help-center-theme" target="_blank">Created with jekyll</a>
       </div>
     </div>
 

diff --git a/_includes/head.html b/_includes/head.html
@@ -4,7 +4,37 @@
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>{% if page.title %}{{ page.title }}{% else %}{{ site.name }}{% endif %}</title>
+
   <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,600">
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/the-grid-flexbox@2.0.1/css/the-grid.min.css">
+  <link href="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css" rel="stylesheet">
+  <script src="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.js"></script>
+
   <link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">
+
+  <link rel="canonical" href="{{ site.url }}">
+  <link rel="base" href="{{ site.url }}"/>
+  <meta name="author" content="{{ site.github }}">
+  <meta name="robots" content="index/follow"/>
+  <meta name="googlebot" content="index/follow"/>
+  <meta name="theme-color" content="{{ site.colortheme }}"/>
+  <meta name="msapplication-navbutton-color" content="{{ site.colortheme }}"/>
+  <meta name="apple-mobile-web-app-status-bar-style" content="{{ site.colortheme }}"/>
+  <!-- Open Graph data -->
+  <meta property="og:title" content="{{ site.title }}" />
+  <meta property="og:type" content="website" />
+  <meta property="og:url" content="{{ site.url }}" />
+  <meta property="og:description" content="{{ site.description }}" />
+  <meta property="og:site_name" content="{{ site.title }}" />
+  <!-- <meta property="og:image" content="{{ site.url }}{{ site.baseurl }}/images{{ page.image }}" /> -->
+  <!-- Twitter Card data -->
+  <meta name="twitter:card" content="summary">
+  <meta name="twitter:title" content="{{ site.title }}">
+  <meta name="twitter:description" content="{{ site.description }}">
+  <meta name="twitter:creator" content="{{site.twitter_username}}">
+  <!-- <meta name="twitter:image" content="{{page.image}}"> -->
+  <!-- Schema.org markup for Google+ -->
+  <meta itemprop="name" content="{{ site.title }}">
+  <meta itemprop="description" content="{{ site.description }}">
+  <!-- <meta itemprop="image" content="{{page.image}}"> -->
 </head>
diff --git a/_includes/header.html b/_includes/header.html
@@ -2,13 +2,14 @@
 
 <div class="header container align-items-center justify-content-center">
   <div class="header--block size margin container column">
-    <div class="header--block--text">
-      Advice and answers from the WeDeploy Team
+    <div class="header--block--text" data-aos="fade-up" data-aos-delay="" data-aos-offset="0">
+      Advice and answers from the {{ site.title }} Team
     </div>
 
-    <div class="header--block--input">
+    <div class="header--block--input" data-aos="fade-up" data-aos-delay="" data-aos-offset="0">
       <div class="header--block--input--icon">
-        <img src="{{ site.baseurl }}/assets/img/icons/search-input.svg" width="30" alt="">
+        <!-- <img src="{{ site.baseurl }}/assets/img/icons/search-input.svg" width="30" alt=""> -->
+        <span class="feather-icon icon-search"></span>
       </div>
       <input class="input-search" type="text" name="" value="" placeholder="Search for answers...">
     </div>

diff --git a/_includes/menu.html b/_includes/menu.html
@@ -1,19 +1,29 @@
 <div class="menu">
   <div class="size margin menu--content container align-items-center justify-content-between">
-<div class="">
-  <a href="{{ site.baseurl }}/"><span>Jekyll |</span> {{ site.title }}</a>
 
-</div>
-    <nav class="masthead-nav">
-      {% for page in site.pages %}
+    <div class="" data-aos="fade-right" data-aos-delay="" data-aos-offset="0">
+      <a href="{{ site.baseurl }}/"><span>Jekyll |</span> {{ site.title }}</a>
+    </div>
+
+    <a href="https://github.com/gustavoquinalha/jekyll-help-center-theme"  data-aos="fade-left" data-aos-delay="" data-aos-offset="0">
+      <div class="container align-items-baseline back-to-site">
+        <div class="">
+          <span class="feather-icon icon-external-link"></span>
+        </div>
+        <div class="back-to-site-text">
+          Back to website
+        </div>
+      </div>
+    </a>
 
+    <!-- <nav class="masthead-nav">
+      {% for page in site.pages %}
       {% if page.title %}
       <a href="{{ page.url | prepend: site.baseurl }}">
         {{ page.title }}
       </a>
       {% endif %}
-
       {% endfor %}
-    </nav>
+    </nav> -->
   </div>
 </div>
diff --git a/_includes/posts.html b/_includes/posts.html
@@ -1,43 +1,30 @@
 <div class="">
   {% if site.posts.size == 0 %}
-    <h2>No post found</h2>
-  {% else %}
+  <h2>No post found</h2> {% else %} {% for post in site.posts %}
 
-    {% for post in site.posts %}
+  <a href="{{ site.baseurl }}{{ post.url }}" class="list-item container" data-aos="fade-up" data-aos-offset="0" data-aos-delay="100">
 
-      <div class="list-item container ">
+    <div class="list-item-icon container align-items-center justify-content-center" >
+      <span class="feather-icon icon-{{post.icon}}" data-aos="fade-right" data-aos-offset="0" data-aos-delay="500"></span>
+    </div>
 
-        <div class="list-item-img container align-items-center justify-content-center">
-          <img src="{{ site.baseurl }}/assets/img/icons/{{post.icon}}.svg" width="40" alt="">
-        </div>
-
-      <div class="flex-grow-1">
-        <div class="">
-          <h2 class="list-post-title">
-            <a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a>
-          </h2>
-        </div>
-
-        <div class="">
-          <span class="list-post-description">
-          {{ post.description }}
-          </span>
-        </div>
-
-        <div class="list-post-written">
-          <small>
-            Written by <span>{{ post.by }}</span>
-             -
-          </small>
+    <div class="flex-grow-1">
+      <div class="" data-aos="fade-up" data-aos-delay="600" data-aos-offset="0">
+        <h2 class="list-post-title">
+        {{ post.title }}
+        </h2>
+      </div>
 
-          <small>
-            <time>{{ post.date | date_to_string }}</time>
-          </small>
-        </div>
+      <div class="" data-aos="fade-up" data-aos-delay="700" data-aos-offset="0">
+        <span class="list-post-description">{{ post.description }}</span>
       </div>
 
+      <div class="list-post-written" data-aos="fade-left" data-aos-delay="800" data-aos-offset="0">
+        <small>Written by <span>{{ post.by }}</span>-</small>
+        <small><time>{{ post.date | date_to_string }}</time></small>
       </div>
+    </div>
 
-    {% endfor %}
-  {% endif %}
+  </a>
+  {% endfor %} {% endif %}
 </div>
diff --git a/_layouts/default.html b/_layouts/default.html
@@ -5,9 +5,12 @@
     {% include menu.html %}
 
     {{ content }}
-    
+
     {% include footer.html %}
   </div>
+  <script>
+    AOS.init();
+  </script>
 </body>
 
 </html>
diff --git a/_layouts/post.html b/_layouts/post.html
@@ -3,17 +3,17 @@
 ---
 {% include minutes-to-read.html %}
 
+<div class="size margin" data-aos="fade-right" data-aos-delay="100" data-aos-offset="0">
+  {% include breadcrumbs.html path=page.path title=page.title %}
+</div>
+
 <div class="size margin min-height">
-
   <article>
-    <h1 class="post-title">{{ page.title }}</h1>
-    <div class="post-date">
+    <h1 class="post-title" data-aos="fade-up" data-aos-delay="200" data-aos-offset="0">{{ page.title }}</h1>
+    <div class="post-date" data-aos="fade-left" data-aos-delay="300" data-aos-offset="0">
       <time>{{ page.date | date_to_string }}</time>
       <span class="reading-time" title="Estimated read time"> - {{ minutesText }}</span>
     </div>
-
     {{ content }}
-
   </article>
-
 </div>
diff --git a/_posts/2017-11-12-command-line.md b/_posts/2017-11-12-command-line.md
diff --git a/_posts/2017-11-12-deployment.md b/_posts/2017-11-12-deployment.md