jekyll-theme-potato-hacker 1.0.2 → 1.0.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: dde925fd1cadd7e5809e8b498be72ad6ec71178706f83fbac2e2ca33e97b66b4
-  data.tar.gz: ad4efebb03986bb95f19c71fa890c7fe3200e54e73cf2df0012f183aee14f171
+  metadata.gz: 83ea7ce51c0a8007da8621efbeeb99e20e541175207758bd15cb9db0787a165f
+  data.tar.gz: 6500faa974142aaa19982b284cfd9b602608b70391821fc3f6c6f63fd010132a
 SHA512:
-  metadata.gz: d1349736907dedbb049109b58e90a46bc1449a1974062bca1c55c19a37df4ba8291347889c4bfb6919415306b7a47a0dace2fbf1cf19e34ef97c23ea4e030f6c
-  data.tar.gz: b1ee53bb27e5c307a7990b7656f6cfa826cd29ca2ad2cf487a169c7b028041ff87be64587bf063ecb002026746ba2dd15b46f9ebe3955e8576f57b3df7e13267
+  metadata.gz: 4716b05ad2af65df27cb8c9d933e96cedc33fc5d1c7c54640f549f0c5deb4b5ce3979a93ac7ce05f0116dbd35b19790f1c02d00bbf50fd7c30b4970bfefa77b4
+  data.tar.gz: d91504fd8cde4619fb9ab366015ef7157e8e0ae6720c58d377b43a9cad7f276cea7c5658c8399c98bbb6eb37f9c6a6d9bfec9710e28c435390c526e5b41c567a

data/README.md

@@ -1,10 +1,14 @@
 # jekyll-theme-potato-hacker
+[![Gem Version](https://badge.fury.io/rb/jekyll-theme-potato-hacker.svg)](https://badge.fury.io/rb/jekyll-theme-potato-hacker)
+[![License: GPL v3](https://img.shields.io/badge/License-GPLv3-blue.svg)](https://www.gnu.org/licenses/gpl-3.0)
+
 
 Welcome to your new Jekyll theme! In this directory, you'll find the files you need to be able to package up your theme into a gem. Put your layouts in `_layouts`, your includes in `_includes` and your sass in `_sass`. To experiment with this code, add some sample content and run `bundle exec jekyll serve` – this directory is setup just like a Jekyll site!
 
-![screenshot](screenshot.png "screenshot")
+![screenshot](https://raw.githubusercontent.com/luxedo/jekyll-theme-potato-hacker/master/screenshot.png "screenshot")
 
 Check out the [demo](https://luxedo.github.io/jekyll-theme-potato-hacker/)
+Check out the [gem](https://rubygems.org/gems/jekyll-theme-potato-hacker)
 
 ## Installation
 
@@ -28,8 +32,15 @@ Or install it yourself as:
 
     $ gem install jekyll-theme-potato-hacker
 
+Or even use the remote theme tag in `_config.yml` if you're using github pages:
+```yaml
+remote_theme: luxedo/jekyll-theme-potato-hacker
+```
+
 ## Usage
 
+### Pages
+
 This is a simple theme I made to my portfolio/blog https://luxedo.github.io/
 There are four different categories of pages for this template:
 * Main page `index.md` in the root.
@@ -37,16 +48,19 @@ There are four different categories of pages for this template:
 * Blog posts `_posts` folder.
 * Dropdown pages `_dropdown` folder.
 
-The dropdown menus are generated based on the [front matter](https://jekyllrb.com/docs/front-matter/) data in the files. Use the `dropdown` attribute to chose where the page will be placed.
+### Dropdown
+The dropdown menus are generated based on the [front matter](https://jekyllrb.com/docs/front-matter/) data in the files. Use the `dropdown` attribute to chose where the page will be placed. The items with the highest `priority` will be placed first.
 ```yaml
 ---
 layout: page
 title: dropdown1 item1
 description: Test page
 dropdown: dropdown1
+priority: 1
 ---
 ```
 
+### Blog
 If you want to use the blog, you need to set `blog: on` inside `_config.yml` and add a `blog.md` file in your root directory:
 ```yaml
 ---
@@ -56,6 +70,44 @@ description: Test page
 ---
 ```
 
+### \_config.yml
+Some settings are defined in `_config.yml`. Download the file in this repo
+for a complete example.
+```yaml
+# Useful links
+github_username: "<github_username>"
+facebook_username: "<facebook_username>"
+twitter_username: "<twitter_username>"
+linkedin_id: "<linkedin_id>"
+
+# Theme
+# theme: jekyll-theme-potato-hacker                 # Uncomment this
+# remote_theme: luxedo/jekyll-theme-potato-hacker   # Or this
+theme_repository: "https://github.com/luxedo/jekyll-theme-potato-hacker"
+theme_base: "dark"       # Theme palette (light | dark)
+theme_switch: on         # Show color switch (on | off)
+
+# Extra settings
+blog: on                 # Show blog tag and post list (on | off)
+avatar: on               # Show avatar (on | off)
+avatar_image: "assets/img/avatar.jpg"
+avatar_description: "My name is Popotato and I'm a HACKER."
+highlighter_theme: monokai  # Theme of the syntax_highlighter [base16 |
+                            # colorful | github | gruvbox | molokai |
+                            # monokai | pastie | thankful_eyes | tulip ]
+toolbar_priority:        # Order of the items in the toolbar (except for blog and home)
+  - dropdown2
+  - About
+  - dropdown1
+
+# Collections
+collections:
+  dropdown:
+    output: true
+  items:
+    output: true
+```
+
 ## Contributing
 
 Bug reports and pull requests are welcome on GitHub at https://github.com/luxedo/jekyll-theme-potato-hacker/issues. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.

data/_includes/footer.html

@@ -11,31 +11,7 @@
     {% endif %}
     <div class="row">
       <div class="col-sm-8 col-sm-offset-2">
-        {% if site.github_username != null %}
-        <a href="https://github.com/{{site.github_username}}" target="_blank">
-          <i class="fa fa-github fa-3x"></i>
-        </a>
-        {% endif %}
-        {% if site.email != null %}
-        <a href="mailto:{{site.email}}">
-          <i class="fa fa-envelope fa-3x"></i>
-        </a>
-        {% endif %}
-        {% if site.facebook_username != null %}
-        <a href="https://www.facebook.com/{{site.facebook_username}}" target="_blank">
-          <i class="fa fa-facebook fa-3x"></i>
-        </a>
-        {% endif %}
-        {% if site.twitter_username != null %}
-        <a href="https://twitter.com/{{site.twitter_username}}" target="_blank">
-          <i class="fa fa-twitter fa-3x"></i>
-        </a>
-        {% endif %}
-        {% if site.linkedin_id != null %}
-        <a href="https://www.linkedin.com/in/{{site.linkedin_id}}" target="_blank">
-          <i class="fa fa-linkedin fa-3x"></i>
-        </a>
-        {% endif %}
+        {% include links.html %}
       </div>
     </div>
     {% if site.email != null and site.author != null %}

data/_includes/head.html

@@ -37,11 +37,11 @@
   <link rel="shortcut icon" href="{{'/assets/img/icons/favicon.ico' | prepend: site.baseurl }}" type="image/x-icon" />
 
   <!-- Android Lolipop Theme Color -->
-  <meta name="theme-color" content="rgba(42, 77, 20, 1)">
+  <meta name="theme-color" content="#2a4d14">
 
   <!-- Styles -->
   <link rel="stylesheet" id="css-theme" href="{{ '/assets/css/main-' | append: site.theme_base | append: '.css' | prepend: site.baseurl }}">
-  <link rel="stylesheet" href="{{ '/assets/css/syntax.css' | prepend: site.baseurl }}">
+  <link rel="stylesheet" href="{{ '/assets/css/highlight/' | append: site.highlighter_theme | append: '.css' | prepend: site.baseurl }}">
   <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
   <link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">

data/_includes/header.html

@@ -19,6 +19,7 @@
               {% if site.blog == true %}
                 <li><a href="{{ '/blog' | prepend: site.baseurl }}">Blog</a></li>
               {% endif %}
+
               {% for page in site.dropdown %}
                 <li class="dropdown dropdown-{{ page.dropdown }}">
                   <a href="#" class="dropdown-toggle" data-toggle="dropdown"
@@ -26,28 +27,45 @@
                     <span class="caret"></span>
                   </a>
                   <ul class="dropdown-menu dropdown-menu-{{ page.title }}">
-                    <li><a href="{% if page.redirect_to %}{{page.redirect_to}}{% else %}{{ page.url | prepend: site.baseurl }}{% endif %}">{{ page.title }}</a></li>
+                    <li priority="{{ page.priority }}"><a href="{% if page.redirect_to %}{{page.redirect_to}}{% else %}{{ page.url | prepend: site.baseurl }}{% endif %}">{{ page.title }}</a></li>
                   </ul>
                 </li>
               {% endfor %}
+              {% for page in site.items %}
+                <li class="nav-item"><a href="{% if page.redirect_to %}{{page.redirect_to}}{% else %}{{ page.url | prepend: site.baseurl }}{% endif %}">{{ page.title }}</a></li>
+              {% endfor %}
+
               <script>
                 // clean repeated dropdowns and add <li> to their positions
-                $(".dropdown").each((index0, value0) => {
-                  let dropdownClass = "."+$(value0)[0].classList[1];
-                  let dropdownMain = $(dropdownClass)[0].querySelector("ul");
-                  if ($(dropdownClass).length > 1) {
-                    $(dropdownClass).each((index1, value1) => {
-                      if (index1 != 0) {
-                        dropdownMain.append(value1.querySelector("ul li"))
-                        $(dropdownClass)[1].remove();
+                let done = [];
+                let elements = [];
+                $(".dropdown")
+                  //
+                  .each((index0 , value0) => {
+                    let dropdownClass = "."+$(value0)[0].classList[1];
+                    if (done.indexOf(dropdownClass) !== -1) return
+                    done.push(dropdownClass)
+                    let dropdownMain = $(dropdownClass)[0]
+                    let itemsList = $(dropdownClass+">ul>li").sort((a, b) => parseInt(b.getAttribute("priority") || -9999999) - parseInt(a.getAttribute("priority") || -9999999))
+                    $(dropdownClass+">ul>li").remove();
+                    $(dropdownClass+">ul").append(itemsList)
+                    $(dropdownClass).remove();
+                    elements.push(dropdownMain)
+                });
+                let priority = [{% for item in site.toolbar_priority %} "{{item}}", {% endfor %}];
+                elements = elements.concat(...$(".nav-item").remove())
+                priority.map(text => {
+                  elements = elements.filter(node => {
+                      let nodeText = node.querySelector("a").textContent.trim()
+                      if (text == nodeText) {
+                          $(".nav").append(node)
+                          return false;
                       }
-                    });
-                  }
+                      return true;
+                  })
                 });
+                $(".nav").append(elements)
               </script>
-              {% for page in site.items %}
-                <li><a href="{% if page.redirect_to %}{{page.redirect_to}}{% else %}{{ page.url | prepend: site.baseurl }}{% endif %}">{{ page.title }}</a></li>
-              {% endfor %}
             </ul>
           </div>
         </div>

data/_includes/links.html

@@ -0,0 +1,25 @@
+{% if site.github_username != null %}
+<a href="https://github.com/{{site.github_username}}" target="_blank">
+  <i class="fa fa-github fa-3x"></i>
+</a>
+{% endif %}
+{% if site.email != null %}
+<a href="mailto:{{site.email}}">
+  <i class="fa fa-envelope fa-3x"></i>
+</a>
+{% endif %}
+{% if site.facebook_username != null %}
+<a href="https://www.facebook.com/{{site.facebook_username}}" target="_blank">
+  <i class="fa fa-facebook fa-3x"></i>
+</a>
+{% endif %}
+{% if site.twitter_username != null %}
+<a href="https://twitter.com/{{site.twitter_username}}" target="_blank">
+  <i class="fa fa-twitter fa-3x"></i>
+</a>
+{% endif %}
+{% if site.linkedin_id != null %}
+<a href="https://www.linkedin.com/in/{{site.linkedin_id}}" target="_blank">
+  <i class="fa fa-linkedin fa-3x"></i>
+</a>
+{% endif %}

data/_layouts/blog-index.html

@@ -4,7 +4,7 @@ layout: page
 {% for post in site.posts %}
     <a href="{{ post.url | prepend: site.baseurl }}">
       <h1 class="post-title"> {{ post.title }}</h1>
-      <h4 class="post-title"> {{ post.date }} </h4>
+      <h5 class="post-title"> {{ post.date }} </h5>
     </a>
     {{post.excerpt}}
     {% if post.content contains site.excerpt_separator %}

data/_layouts/default.html

@@ -30,35 +30,49 @@
           <div class="left-pane">
           </div>
         </div> -->
-        <div class="col-sm-8 col-sm-offset-2 content-div">
-          <div class="page-separator hidden-xs"><h1 class="h1-strip" style="padding-bottom:8em; margin-bottom: 0;"></h1></div>
-          <div class="page-separator visible-xs"><h1 class="h1-strip" style="padding-bottom:2em; margin-bottom: 0;"></h1></div>
+        <div class="col-md-8 col-md-offset-1 content-div">
+          <div class="page-separator hidden-md">
+            <h1 class="h1-strip" style="padding-bottom:8em; margin-bottom: 0;"></h1>
+          </div>
+          <div class="page-separator visible-md">
+            <h1 class="h1-strip" style="padding-bottom:2em; margin-bottom: 0;"></h1>
+          </div>
           <h1 class="post-title page-title" id="title"><a href="#title">{{ page.title }}</a></h1>
           {{ content }}
         </div>
-        <div class="col-sm-2">
-          <div class="pane-separator hidden-xs" style="margin-bottom:30em;"></div>
-          <div class="pane-separator visible-xs" style="margin-bottom:5em;"></div>
-          <div class="right-pane" style="margin-left: 1em;">
-            {% if page.url contains '/blog/' or page.url == '/' or page.url == '/blog.html' %}
+        <div class="col-md-2">
+          <div class="pane-separator hidden-md" style="margin-bottom:30em;"></div>
+          <div class="pane-separator visible-md" style="margin-bottom:5em;"></div>
+          <div class="right-pane">
+            {% if site.avatar == true %}
+            <div class="avatar">
               <center>
                 {% if site.avatar_image != null %}
-                  <img src="{{ site.avatar_image | prepend: '/' | prepend: site.baseurl }}" alt="me" class="avatar-image">
+                <img src="{{ site.avatar_image | prepend: '/' | prepend: site.baseurl }}" alt="me" class="avatar-image">
+                {% endif %}
+                {% if site.avatar_description != null %}
+                <p style="margin-top: 0.5em;" class="avatar-description">{{site.avatar_description}}</p>
                 {% endif %}
-                <p class="avatar-description">{{site.avatar_description}}</p>
+                <div class="right-links">
+                  {% include links.html %}
+                </div>
               </center>
+            </div>
             {% endif %}
-            {% if page.url contains "/blog/" %}
+            {% if site.blog == true %}
+            <div class="posts-list">
               <a href="{{ '/blog' | prepend: site.baseurl }}">
-                <h4>Posts:</h4>
+                <h4>Recent Posts:</h4>
               </a>
-            <ul>
-              {% for post in site.posts %}
-              <li>
-                <a href="{{ post.url | prepend: site.baseurl  }}">{{ post.title }}</a>
-              </li>
-              {% endfor %}
-            </ul>
+              <ul>
+                {% for i in (1..site.recent_posts) %}
+                {% assign post = site.posts[i] %}
+                <li>
+                  <a href="{{ post.url | prepend: site.baseurl  }}">{{ post.title }}</a>
+                </li>
+                {% endfor %}
+              </ul>
+            </div>
             {% endif %}
           </div>
         </div>

data/_layouts/post.html

@@ -1,5 +1,6 @@
 ---
 layout: default
+blog: true
 ---
 <h4 class="post-title"> {{ page.date }} </h4>
 <article class="blog-post">

data/_sass/_base.scss

@@ -114,12 +114,7 @@ nav:hover {
   margin-bottom: 5em;
 }
 
-.highlight,
-.highlight .w {
-  opacity: 0.9;
-}
 $avatar-size: 10em;
-
 .avatar-image {
   height: auto;
   width: auto;
@@ -146,3 +141,10 @@ $avatar-size: 10em;
   z-index: -1;
   padding: 1em;
 }
+
+.right-links {
+  a i {
+    font-size: 1.5em;
+    color: $gray !important;
+  }
+}

data/_sass/_variables-dark.scss

@@ -834,7 +834,7 @@ $close-text-shadow:           0 1px 0 #fff;
 //##
 
 $code-color:                  lighten($brand-danger, 25%);
-$code-bg:                     rgba($text-color, 0.1);
+$code-bg:                     rgba($text-color, 0.01);
 
 $kbd-color:                   #fff;
 $kbd-bg:                      #333;

data/assets/css/{syntax.css → highlight/base16.css}

@@ -1,8 +1,7 @@
 .highlight table td { padding: 5px; }
 .highlight table pre { margin: 0; }
 .highlight, .highlight .w {
-  color: #d0d0d0;
-  background-color: #151515;
+  color: #303030;
 }
 .highlight .err {
   color: #151515;

data/assets/css/highlight/colorful.css

@@ -0,0 +1,170 @@
+.highlight table td { padding: 5px; }
+.highlight table pre { margin: 0; }
+.highlight, .highlight .w {
+  color: #bbbbbb;
+  background-color: #000;
+}
+.highlight .c, .highlight .cd, .highlight .cm, .highlight .c1 {
+  color: #888;
+}
+.highlight .cp {
+  color: #579;
+}
+.highlight .cs {
+  color: #cc0000;
+  font-weight: bold;
+}
+.highlight .k, .highlight .kc, .highlight .kd, .highlight .kn, .highlight .kr, .highlight .kv {
+  color: #080;
+  font-weight: bold;
+}
+.highlight .kp {
+  color: #038;
+}
+.highlight .kt {
+  color: #339;
+}
+.highlight .o {
+  color: #333;
+}
+.highlight .ow {
+  color: #000;
+  font-weight: bold;
+}
+.highlight .nb, .highlight .bp {
+  color: #007020;
+}
+.highlight .nf {
+  color: #06B;
+  font-weight: bold;
+}
+.highlight .nc {
+  color: #B06;
+  font-weight: bold;
+}
+.highlight .nn {
+  color: #0e84b5;
+  font-weight: bold;
+}
+.highlight .ne {
+  color: #F00;
+  font-weight: bold;
+}
+.highlight .nv {
+  color: #963;
+}
+.highlight .vi {
+  color: #33B;
+}
+.highlight .vc {
+  color: #369;
+}
+.highlight .vg {
+  color: #d70;
+  font-weight: bold;
+}
+.highlight .no {
+  color: #036;
+  font-weight: bold;
+}
+.highlight .nl {
+  color: #970;
+  font-weight: bold;
+}
+.highlight .ni {
+  color: #800;
+  font-weight: bold;
+}
+.highlight .na {
+  color: #00C;
+}
+.highlight .nt {
+  color: #070;
+}
+.highlight .nd {
+  color: #555;
+  font-weight: bold;
+}
+.highlight .s, .highlight .sb, .highlight .s2, .highlight .sh, .highlight .s1 {
+  background-color: #fff0f0;
+}
+.highlight .sc {
+  color: #04D;
+}
+.highlight .sd {
+  color: #D42;
+}
+.highlight .si {
+  background-color: #eee;
+}
+.highlight .se {
+  color: #666;
+  font-weight: bold;
+}
+.highlight .sr {
+  color: #000;
+  background-color: #fff0ff;
+}
+.highlight .ss {
+  color: #A60;
+}
+.highlight .sx {
+  color: #D20;
+}
+.highlight .m, .highlight .mb, .highlight .mx {
+  color: #60E;
+  font-weight: bold;
+}
+.highlight .mi, .highlight .il {
+  color: #00D;
+  font-weight: bold;
+}
+.highlight .mf {
+  color: #60E;
+  font-weight: bold;
+}
+.highlight .mh {
+  color: #058;
+  font-weight: bold;
+}
+.highlight .mo {
+  color: #40E;
+  font-weight: bold;
+}
+.highlight .gh {
+  color: #000080;
+  font-weight: bold;
+}
+.highlight .gu {
+  color: #800080;
+  font-weight: bold;
+}
+.highlight .gd {
+  color: #A00000;
+}
+.highlight .gi {
+  color: #00A000;
+}
+.highlight .gr {
+  color: #FF0000;
+}
+.highlight .ge {
+  font-style: italic;
+}
+.highlight .gs {
+  font-weight: bold;
+}
+.highlight .gp {
+  color: #c65d09;
+  font-weight: bold;
+}
+.highlight .go {
+  color: #888;
+}
+.highlight .gt {
+  color: #04D;
+}
+.highlight .err {
+  color: #F00;
+  background-color: #FAA;
+}