jekyll-dash 1.3.0 → 2.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4be59164c0e38ade84359bc8fa1d8344db6dffb153ed143afefdef515a83443c
-  data.tar.gz: '0043099644efd633246f7d850baddf63b46060ddb8d43e780b49b5af0647d343'
+  metadata.gz: f29e755db2527c979641ecb23c33b2f262c0f211584ec242afc77484d1c654f7
+  data.tar.gz: 805c3a368c4a96784046d9f787cf066b2d156eacdcf4e58609c7ae927e3bad2a
 SHA512:
-  metadata.gz: 3ef0a6042fa71660c330d00602d226cd7d38ad68d32149fd7292ddf0028fd74e102f408afd5d71fecac64807791b7235b191ebfe4a822959ef97cad1cbd55d03
-  data.tar.gz: 0d0e3f59d5c27fd3bd400f5ec9de5032cf7f740182bc5ecfb94af257a17c7a7a7b5f1780cc2bdfcc579004d7f3dea25b1a41b8b1a1a03d17c7ddc0c5e65dc89e
+  metadata.gz: 9d1bf17a0e6c40756660b888e7ba6c7f6262afd9999a9e2d29fbe7a054b3e77a2e4de7f442dbdf98a273a4e5aee28cc8c08a4f658897203fe11320aacbc93c27
+  data.tar.gz: e14db70d0eb5c5c3ecf4b0d9cb0bfb28ac73ecd3210fd3a86778656f23fcee48ab21eb7e9867c52dd29343ec232bc90915ca37f2c2e60282c6238a1cb13f7a12

data/README.md

@@ -1,21 +1,29 @@
 ![logo](logo.png)
 --
 
-A dark theme for Jekyll, inspired by Dash UI for Atom. 🌒
+A dark and light theme for Jekyll, inspired by Dash UI for Atom. 🌒☀
 
 [![Build Status](https://img.shields.io/travis/bitbrain/braingdx/master.svg?logo=travis&style=flat-square)](https://travis-ci.org/bitbrain/jekyll-dash)
 [![license](https://img.shields.io/github/license/bitbrain/jekyll-dash.svg?style=flat-square)](LICENSE.MD)
 ---
 This theme for [Jekyll](https://jekyllrb.com/) has been inspired by [dash-ui](https://atom.io/themes/dash-ui), a dark theme for [Atom](https://atom.io).
 
-[![design](screenshot.png)](http://bitbrain.github.io)
+[![design](theme.gif)](http://bitbrain.github.io)
 
 ## Installation
 
 Add this line to your Jekyll site's `Gemfile`:
 
+For **Jekyll 3**:
 ```ruby
-gem "jekyll-dash"
+gem 'jekyll-dash', '~> 1.0.0'
+```
+
+> Keep in mind: Github pages generation only supports Jekyll 3.8 right now.
+
+For **Jekyll 4**:
+```ruby
+gem 'jekyll-dash', '~> 2.0.0'
 ```
 
 And add this line to your Jekyll site's `_config.yml`:
@@ -30,7 +38,7 @@ And then execute:
 
 Or install it yourself as:
 
-    $ gem install jekyll-dash
+    $ gem install jekyll-dash -v version
 
 ## Configuration
 
@@ -53,7 +61,7 @@ dash:
   date_format: "%b %-d, %Y"
 
   disqus:
-    shortname: <your-discuss-shortname>
+    shortname: <your-disqus-shortname>
 
   # generate social links in footer
   # supported colors: green, red, orange, blue, cyan, pink, teal, yellow, indigo, purple
@@ -67,6 +75,12 @@ dash:
     - url: https://github.com/bitbrain
       icon: github-square
       color: purple
+      
+  show_author: true
+
+# Replaces the default avatar provider (gravatar)
+#avatar_source: github
+#github_username: bitbrain
 ```
 ## Using this theme directly on Github Pages
 

data/_includes/author.html

@@ -1,6 +1,15 @@
 <div class="author-box">
-{% if site.plugins contains "liquid-md5" %}
-<img src="https://gravatar.com/avatar/{{ site.email | downcase | md5 }}?s=256" class="author-avatar" />
-{% endif %}
+    {% if site.avatar_source == "github" and site.github_username %}
+        {% capture avatar_image %}
+            https://github.com/{{ site.github_username }}.png
+        {% endcapture %}
+    {% elsif site.plugins contains "liquid-md5" %}
+        {% capture avatar_image %}
+            https://gravatar.com/avatar/{{ site.email | downcase | md5 }}?s=256
+        {% endcapture %}
+    {% endif %}
+    {% if avatar_image %}
+        <img src="{{ avatar_image }}" class="author-avatar" alt="Avatar" />
+    {% endif %}
 {{ site.description }}
 </div>

data/_includes/head.html

@@ -9,5 +9,4 @@
   {%- if jekyll.environment == 'production' and site.google_analytics -%}
     {%- include google-analytics.html -%}
   {%- endif -%}
-  <script defer src="https://use.fontawesome.com/releases/v5.8.1/js/all.js" integrity="sha384-g5uSoOSBd7KkhAMlnQILrecXvzst9TdC09/VM+pjDTCM+1il8RHz5fKANTFFb+gQ" crossorigin="anonymous"></script>
 </head>

data/_includes/theme-toggle.html

@@ -16,53 +16,48 @@
 </div>
 <script type="text/javascript">
 const theme = localStorage.getItem('theme');
-if (theme === "dark") {
-	document.documentElement.setAttribute('data-theme', 'dark');
+
+if (theme === "light") {
+    document.documentElement.setAttribute('data-theme', 'light');
+} else {
+    document.documentElement.setAttribute('data-theme', 'dark');
 }
 const userPrefers = getComputedStyle(document.documentElement).getPropertyValue('content');
 
-if (theme === "dark") {
+function activateDarkTheme() {
     document.getElementById('theme-toggle').checked = true;
     document.documentElement.setAttribute('data-theme', 'dark');
     document.documentElement.classList.add('theme--dark');
     document.documentElement.classList.remove('theme--light');
 	document.getElementById("theme-toggle").className = 'light';
-} else if (theme === "light") {
+	window.localStorage.setItem('theme', 'dark');
+}
+
+function activateLightTheme() {
     document.getElementById('theme-toggle').checked = false;
     document.documentElement.setAttribute('data-theme', 'light');
     document.documentElement.classList.add('theme--light');
     document.documentElement.classList.remove('theme--dark');
 	document.getElementById("theme-toggle").className = 'dark';
-} else if  (userPrefers === "dark") {
-    document.getElementById('theme-toggle').checked = false;
-    document.documentElement.setAttribute('data-theme', 'dark');
-	document.documentElement.classList.add('theme--dark');
-    document.documentElement.classList.remove('theme--light');
-	window.localStorage.setItem('theme', 'dark');
-	document.getElementById("theme-toggle").className = 'light';
-} else {
-    document.getElementById('theme-toggle').checked = true;
-    document.documentElement.setAttribute('data-theme', 'light');
-	document.documentElement.classList.add('theme--light');
-    document.documentElement.classList.remove('theme--dark');
 	window.localStorage.setItem('theme', 'light');
-	document.getElementById("theme-toggle").className = 'dark';
+}
+
+if (theme === "dark") {
+    activateDarkTheme();
+} else if (theme === "light") {
+    activateLightTheme();
+} else if  (userPrefers === "light") {
+    activateDarkTheme();
+} else {
+    activateDarkTheme();
 }
 
 function modeSwitcher() {
 	let currentMode = document.documentElement.getAttribute('data-theme');
 	if (currentMode === "dark") {
-	    document.documentElement.setAttribute('data-theme', 'light');
-		document.documentElement.classList.add('theme--light');
-        document.documentElement.classList.remove('theme--dark');
-		window.localStorage.setItem('theme', 'light');
-	    document.getElementById("theme-toggle").className = 'dark';
+	    activateLightTheme();
 	} else {
-	    document.documentElement.setAttribute('data-theme', 'dark');
-		document.documentElement.classList.add('theme--dark');
-        document.documentElement.classList.remove('theme--light');
-		window.localStorage.setItem('theme', 'dark');
-	    document.getElementById("theme-toggle").className = 'light';
+	    activateDarkTheme();
 	}
 }
 </script>

data/_layouts/home.html

@@ -1,7 +1,9 @@
 ---
 layout: default
 ---
-{% include author.html %}
+{% unless site.dash.show_author == false %}
+  {% include author.html %}
+{% endunless %}
 {% assign posts_count = paginator.posts | size %}
 {% if posts_count > 0 %}
 <h1>recent articles</h1>
@@ -23,6 +25,11 @@ layout: default
             {% else %}
               {{ post.date | date: "%b %-d, %Y" }}
             {% endif %}
+            {% if site.show_excerpts == true %}
+              <div class="post-excerpt">
+                {{ post.content | strip_html | truncatewords: 50 }}
+              </div>
+            {% endif %}
           </div>
         </div>
       {% endfor %}

data/_layouts/post.html

@@ -1,7 +1,9 @@
 ---
 layout: default
 ---
-{% include author.html %}
+{% unless site.dash.show_author == false %}
+  {% include author.html %}
+{% endunless %}
 <div class="post">
   <h1 class="post-title">{{ page.title }}</h1>
   {% if site.plugins contains "jekyll/tagging" %}

data/_layouts/tag_page.html

@@ -1,7 +1,9 @@
 ---
 layout: default
 ---
-{% include author.html %}
+{% unless site.dash.show_author == false %}
+  {% include author.html %}
+{% endunless %}
 <h1 class="post-title">articles tagged with <a class="tag" href="/tag/{{ page.tag }}/">{{ page.tag }}</a></h1>
   <div class="post-links">
   {% for post in site.posts %}

data/_sass/dash.scss

@@ -34,6 +34,10 @@ $spacing-unit: 30px !default;
 
 // Import partials.
 @import
+  "fa/fontawesome",
+  "fa/solid",
+  "fa/regular",
+  "fa/brands",
   "dash/fonts",
   "dash/icons",
   "dash/colors",

data/_sass/dash/_fonts.scss

@@ -11,5 +11,6 @@
   }
 }
 
+
 @include font('Varela Round', '/assets/fonts/VarelaRound-Regular');
-@include font('Roboto Mono', '/assets/fonts/RobotoMono-Medium');
+@include font('Roboto Mono', '/assets/fonts/RobotoMono-Medium');

data/_sass/dash/_icons.scss

@@ -1,9 +1,8 @@
 // Font Awesome Icons
 
-$icon-quote-right: "\f10e";
-$icon-chevron-right: "\f054";
-$icon-check: "\f00c";
-$icon-minus: "\f068";
-$icon-flask: "\f0c3";
-$icon-tag: "\f02b";
-$icon-lightbulb: "\f02b";
+$icon-quote-right: fa-content($fa-var-quote-right);
+$icon-chevron-right: fa-content($fa-var-chevron-right);
+$icon-check: fa-content($fa-var-check);
+$icon-minus: fa-content($fa-var-minus);
+$icon-flask: fa-content($fa-var-flask);
+$icon-tag: fa-content($fa-var-tag);

data/_sass/dash/_layout.scss

@@ -13,17 +13,12 @@
   .command_prompt {
     color: $color-blue;
     font-size: $base-font-size;
-
-    svg {
-      width: 20px;
-      height: 20px;
-      margin-bottom: -1px;
-      margin-left: 1px;
-    }
+    margin-left: 0.1em;
 
     &:before {
       content: $icon-chevron-right;
       @include font-awesome-icon;
+      margin-right: 0.2em;
     }
   }
 }
@@ -98,12 +93,7 @@
   width: 100%;
   animation: type 2s steps(60, end);
   margin-bottom: 1em;
-
-  & > svg {
-    color: $color-blue;
-    margin-right: 0.6em;
-    margin-bottom: -1px;
-  }
+  margin-left: 0.5em;
 
   &:after {
     content: "_";
@@ -114,6 +104,8 @@
   &:before {
     content: $icon-chevron-right;
     @include font-awesome-icon;
+    margin-right: 0.5em;
+    color: $color-blue;
   }
 }
 
@@ -155,17 +147,10 @@
     list-style: none;
     margin-left: 0;
 
-    svg {
-      @include themed() {
-        color: t('list-secondary');
-      }
-      margin-right: 0.65em;
-      margin-bottom: -1px;
-    }
-
     &:before {
       content: $icon-check;
       @include font-awesome-icon;
+      margin-right: 0.5em;
     }
   }
 
@@ -185,25 +170,18 @@
        color: t('quote-primary');
     }
 
+    & > p {
+        display: block;
+        padding-left: 3em;
+    }
+
     &:before {
       content: $icon-quote-right;
       @include font-awesome-icon;
-    }
-
-    & > svg.svg-inline--fa {
-      @include themed() {
-         color: t('quote-primary');
-      }
+      margin-right: -2em;
       float: left;
-      width: 3em;
-      height: 3em;
-      margin-right: 1em;
-    }
 
-    & > ul > li > svg {
-      @include themed() {
-         color: t('quote-primary');
-      }
+      font-size: 2em;
     }
 
     li {
@@ -213,10 +191,6 @@
       &:before {
         content: $icon-minus;
       }
-
-      & > svg {
-        margin-left: 2em;
-      }
     }
   }
 }
@@ -226,6 +200,8 @@
    & > .post-link {
      font-size: $base-font-size;
      font-size: $post-link-font-size;
+     display: inline-block;
+     text-align: initial;
    }
 
    & > .post-meta {
@@ -241,7 +217,7 @@
    text-align: left;
    & > a {
      display: inline-block;
-     margin-bottom: 1em;
+     margin: 0.3em 0.3em 0.3em 0;
    }
  }
 
@@ -260,19 +236,22 @@
     }
   }
 
-  & > svg {
-    margin-right: 0.4em;
-  }
-
   &:before {
     content: $icon-tag;
     @include font-awesome-icon;
+    margin-right: 0.5em;
   }
 }
 
+.tag {
+  display: inline-block;
+  margin: 0.3em 0.3em 0.3em 0;
+}
+
 .post-tags {
   margin-top: 0.3em;
   margin-bottom: 0.5em;
+  text-align: initial;
 }
 
 .credits {
@@ -304,10 +283,6 @@
     &:hover {
       text-decoration: none;
     }
-
-    svg {
-      padding-left: 0.1em;
-    }
   }
 
   & > a {
@@ -365,17 +340,11 @@ ul.related-posts {
       margin: 0;
     }
 
-    & > svg.svg-inline--fa {
-      color: $color-green;
-      margin-right: 0.3em;
-      width: 22px;
-      height: 22px;
-      margin-bottom: -2px;
-    }
-
     &:before {
       content: $icon-flask;
       @include font-awesome-icon;
+      color: $color-green;
+      margin-right: 0.5em;
     }
   }
 }
@@ -402,4 +371,4 @@ ul.related-posts {
         }
         color: $color-yellow;
     }
-}
+}

data/_sass/dash/_mixins.scss

@@ -5,11 +5,11 @@
   font-variant: normal;
   text-rendering: auto;
   font-weight: 900;
-
-  display: none;
   -webkit-font-smoothing: antialiased;
 }
 
+$theme-map: null;
+
 @mixin themed() {
   @each $theme, $map in $themes {
     .theme--#{$theme} & {