Merged gem branch

404.html

@@ -1,21 +1,6 @@
 ---
-layout: default
+layout: 404
 title: 404
 description: The page you are looking for couldn't be found.
 permalink: /404.html
 ---
-
-<style type="text/css" media="screen">
-  .container {
-    margin: 0px auto;
-    max-width: 600px;
-    text-align: center;
-    padding-top: 60px;
-  }
-</style>
-
-<div class="container">
-  <img src="/assets/img/404.gif" width="100%" alt="404 - Page not found">
-  <p><strong>Page not found :(</strong></p>
-  <p>I'm sorry. We couldn't find the page you are looking for.</p>
-</div>

Gemfile

@@ -1,7 +1,7 @@
-source 'https://rubygems.org'
+source "https://rubygems.org"
 
-gem 'rouge'
-gem 'jekyll'
-gem 'jekyll-paginate'
-gem 'jekyll-paginate-content'
-gem 'json'
+gem "rouge"
+gem "jekyll"
+gem "jekyll-paginate"
+gem "jekyll-paginate-content"
+gem "json"

README.md

@@ -2,15 +2,15 @@
 
 # Jekflix Template
 
-Version 2.0 is [here](https://github.com/thiagorossener/jekflix-template#v200)! 🎉🎊
+Version 3.0 is [here](https://github.com/thiagorossener/jekflix-template#v300)! 🎉🎊
 
 ![Jekflix Template Cover Image](https://res.cloudinary.com/dm7h7e8xj/image/upload/v1505354182/jekflix-logo_mfngps.png)
 
 See the [demo here](https://jekflix.rossener.com/).
 
 ## What is it?
 
-A template for Jekyll inspired by Netflix panel for who loves movies and series and would like to have a blog with this cool appearance.
+A theme for Jekyll inspired by Netflix panel for who loves movies and series and would like to have a blog with this cool appearance.
 
 ![Jekflix Screenshot Image](https://res.cloudinary.com/dm7h7e8xj/image/upload/v1566390829/jekflix-screenshot-2_zfiog2.jpg)
 
@@ -72,6 +72,19 @@ You can create posts manually using the [Front Matter properties](https://github
 
 ## Release notes
 
+### v3.0.1
+
+- Added assets folder
+- Fixed post SVG icons
+
+### v3.0.0
+
+- Created theme `gem`
+- Enabled text translations
+- Added heading anchor links
+- Changed code highlight colors
+- Changed from Stylus to SASS
+
 ### v2.0.1
 - Fixed bugs
 - Optimized to support disabled JS

_config.yml

@@ -11,6 +11,15 @@ tags:
 email: youremail@xyz.com
 disqus_username: disqus_username
 show_hero: true
+menu:
+  - title: Home
+    url: /
+  - title: About
+    url: /about
+  - title: Contact
+    url: /contact
+  - title: Feed
+    url: /feed.xml
 
 
 # Social Media Settings
@@ -23,14 +32,6 @@ linkedin_username: linkedin_username
 medium_username: medium_username
 
 
-# Theme Settings
-themeColor: "#ff0a16"
-primaryDark: "#141414"
-accentDark: "#ffffff"
-lightGray: "#f2f2f2"
-texts: "#333333"
-
-
 # Posts Settings
 show_time_bar: true
 show_modal_on_exit: false
@@ -43,6 +44,8 @@ baseurl: "" # the subpath of your site, e.g. /blog
 url: "" # the base hostname & protocol for your site
 google_analytics: "UA-XXXXXXXX-X"
 language: "en"
+categories_folder: category
+sent_message_url: "/contact/message-sent/"
 
 
 # Build settings
@@ -53,6 +56,8 @@ collections:
   authors:
     output: true
 paginate_path: "/page/:num/"
+show_get_theme_btn: true
+use_logo: false
 
 # Content paginator
 paginate_content:
@@ -72,6 +77,10 @@ paginate_content:
     single:
       is_generated: true
 
+# SASS
+sass:
+  style: compressed
+
 # Plugins
 plugins:
   - jekyll-paginate
@@ -89,3 +98,6 @@ exclude: [
   'gulpfile.js',
   'README.md'
 ]
+
+# Theme
+version: v3.0.2

_includes/author.html

@@ -7,7 +7,7 @@
       {% else %}
         <img class="img-rounded" src="/assets/img/user.jpg" alt="{{ author.display_name }}">
       {% endif %}
-      <p class="def">Author</p>
+      <p class="def">{{ site.translations.text.author | default: "Author" }}</p>
       <h3 class="name">
         <a href="{{ author.url }}">{{ author.display_name }}</a>
       </h3>

_includes/comments.html

@@ -1,7 +1,7 @@
 {% if site.disqus_username %}
 
 <section class="comments">
-    <h3>Comments</h3>
+    <h3>{{ site.translations.text.comments | default: "Comments" }}</h3>
     <div id="disqus_thread"></div>
 </section>
 <script type="text/javascript">

_includes/date.html

@@ -1,4 +1,4 @@
-{% assign months = "January,February,Mark,April,May,June,July,August,September,October,November,December" | split: "," %}
+{% assign months = "January,February,March,April,May,June,July,August,September,October,November,December" | split: "," %}
 {% assign month_number = include.date | date: "%-m" | minus: 1 %}
 
 {{ months[month_number] }} {{ include.date | date: "%-d" }}, {{ include.date | date: "%Y" }}

_includes/footer.html

@@ -86,3 +86,6 @@
 
 <!-- Include Google Analytics script -->
 {% include stats.html %}
+
+<!-- Include extra scripts -->
+{% include extra-js.html %}

_includes/head.html

@@ -71,22 +71,25 @@
 
     <!-- Windows 8 Tile Icons -->
     <meta name="application-name" content="{{ site.name }}">
-    <meta name="msapplication-TileColor" content="{{ site.themeColor }}">
+    <meta name="msapplication-TileColor" content="#141414">
     <meta name="msapplication-square70x70logo" content="smalltile.png" />
     <meta name="msapplication-square150x150logo" content="mediumtile.png" />
     <meta name="msapplication-wide310x150logo" content="widetile.png" />
     <meta name="msapplication-square310x310logo" content="largetile.png" />
 
     <!-- Android Lolipop Theme Color -->
-    <meta name="theme-color" content="{{ site.themeColor }}">
+    <meta name="theme-color" content="#141414">
 
     <!-- Fonts -->
     <link href="https://fonts.googleapis.com/css?family=Titillium+Web:300,400,700" rel="stylesheet">
 
-    <link rel="stylesheet" href="{{ '/assets/css/styles.min.css' | prepend: site.baseurl }}">
+    <link rel="stylesheet" href="{{ '/assets/css/styles.css' | prepend: site.baseurl }}">
     <link rel="canonical" href="{{ url }}">
     <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ '/feed.xml' | prepend: site.baseurl | prepend: site.url }}" />
 
+    <!-- Include extra styles -->
+    {% include extra-css.html %}
+
     <!-- JavaScript enabled/disabled -->
     <script>
         document.querySelector('html').classList.remove('no-js');

_includes/header.html

@@ -4,15 +4,21 @@
     </a>
     <h1 class="logo">
         <a href="{{ site.baseurl }}/">
-            {{ site.name }} <span class="version">v2.0.1</span>
+            {% if site.use_logo %}
+                {% include logo.html %}
+            {% else %}
+                {{ site.name }} <span class="version">{{ site.version }}</span>
+            {% endif %}
         </a>
     </h1>
     <a id="search" class="dosearch" role="button">
         <svg class="icon-search"><use xlink:href="#icon-search"></use></svg>
     </a>
-    <a href="https://github.com/thiagorossener/jekflix-template" class="get-theme" role="button">
-        Get this theme!
-    </a>
+    {% if site.show_get_theme_btn %}
+        <a href="https://github.com/thiagorossener/jekflix-template" class="get-theme" role="button">
+            Get this theme!
+        </a>
+    {% endif %}
 </header>
 
 <div id="mask" class="overlay"></div>

_includes/links.html

@@ -1,20 +1,9 @@
 <ul>
-  <li>
-    <a href="{{ site.url }}{{site.baseurl}}/">Home</a>
-  </li>
-  {% for page in site.pages %}
-    {% if page.menu %}
+  {% for item in site.menu %}
+    {% if item.title and item.url %}
       <li>
-        <a href="{{ site.url }}{{ site.baseurl }}{{ page.url }}">{{ page.title }}</a>
+        <a href="{{ site.url }}{{ site.baseurl }}{{ item.url }}">{{ item.title }}</a>
       </li>
     {% endif %}
   {% endfor %}
-  {% if site.email %}
-    <li>
-      <a href="{{ site.url }}{{site.baseurl}}/contact/">Contact</a>
-    </li>
-  {% endif %}
-  <li>
-    <a class="feed" href="{{ site.url }}{{site.baseurl}}/feed.xml" title="Atom/RSS feed">Feed</a>
-  </li>
 </ul>

assets/img/icons/preloader.svg → _includes/loader.html

@@ -1,11 +1,9 @@
----
----
-<svg width="50" height="50" viewBox="0 0 38 38" xmlns="http://www.w3.org/2000/svg">
+<svg width="50" height="50" viewBox="0 0 38 38" xmlns="http://www.w3.org/2000/svg" class="loader">
     <defs>
         <linearGradient x1="0%" y1="100%" x2="100%" y2="100%" id="a">
-            <stop stop-color="{{ site.themeColor }}" stop-opacity="0" offset="0%"/>
-            <stop stop-color="{{ site.themeColor }}" stop-opacity=".631" offset="63.146%"/>
-            <stop stop-color="{{ site.themeColor }}" offset="100%"/>
+            <stop stop-color="currentColor" stop-opacity="0" offset="0%"/>
+            <stop stop-color="currentColor" stop-opacity=".631" offset="63.146%"/>
+            <stop stop-color="currentColor" offset="100%"/>
         </linearGradient>
     </defs>
     <g fill="none" fill-rule="evenodd">
@@ -19,7 +17,7 @@
                     dur="1.9s"
                     repeatCount="indefinite" />
             </path>
-            <circle fill="{{ site.themeColor }}" cx="36" cy="18" r="1">
+            <circle fill="currentColor" cx="36" cy="18" r="1">
                 <animateTransform
                     attributeName="transform"
                     type="rotate"

_includes/logo.html

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 279 41">
+  <path fill="currentColor" d="M13.62,32 L16.02,32 L16.02,41 L0.24,41 L0.24,32 L2.64,32 L2.64,9.98 L0.24,9.98 L0.24,0.98 L25.02,0.98 L31.38,7.4 L31.38,17.66 L28.74,20.3 L31.38,22.88 L31.38,32 L33.78,32 L33.78,41 L20.4,41 L20.4,26.12 L19.14,24.8 L13.62,24.8 L13.62,32 Z M13.62,15.8 L19.14,15.8 L20.4,14.48 L20.4,11.3 L19.14,9.98 L13.62,9.98 L13.62,15.8 Z M37.08,7.4 L43.5,0.98 L61.08,0.98 L67.5,7.4 L67.5,34.58 L61.08,41 L43.5,41 L37.08,34.58 L37.08,7.4 Z M56.52,11.3 L55.2,9.98 L49.38,9.98 L48.06,11.3 L48.06,30.68 L49.38,32 L55.2,32 L56.52,30.68 L56.52,11.3 Z M89.04,25.58 L77.34,25.58 L70.86,19.22 L70.86,7.4 L77.28,0.98 L94.86,0.98 L101.28,7.4 L101.28,15.32 L90.3,15.32 L90.3,11.3 L88.98,9.98 L83.16,9.98 L81.84,11.3 L81.84,15.32 L83.16,16.58 L94.86,16.58 L101.28,23 L101.28,34.58 L94.86,41 L77.28,41 L70.86,34.58 L70.86,26.9 L81.84,26.9 L81.84,30.68 L83.16,32 L88.98,32 L90.3,30.68 L90.3,26.9 L89.04,25.58 Z M122.82,25.58 L111.12,25.58 L104.64,19.22 L104.64,7.4 L111.06,0.98 L128.64,0.98 L135.06,7.4 L135.06,15.32 L124.08,15.32 L124.08,11.3 L122.76,9.98 L116.94,9.98 L115.62,11.3 L115.62,15.32 L116.94,16.58 L128.64,16.58 L135.06,23 L135.06,34.58 L128.64,41 L111.06,41 L104.64,34.58 L104.64,26.9 L115.62,26.9 L115.62,30.68 L116.94,32 L122.76,32 L124.08,30.68 L124.08,26.9 L122.82,25.58 Z M151.8,32 L158.82,32 L158.82,30.38 L167.82,30.38 L167.82,41 L138.42,41 L138.42,32 L140.82,32 L140.82,9.98 L138.42,9.98 L138.42,0.98 L167.82,0.98 L167.82,11.6 L158.82,11.6 L158.82,9.98 L151.8,9.98 L151.8,16.52 L153.42,16.52 L153.42,14.9 L162.42,14.9 L162.42,27.14 L153.42,27.14 L153.42,25.52 L151.8,25.52 L151.8,32 Z M195.36,41 L184.56,23.12 L184.56,32 L186.96,32 L186.96,41 L171.18,41 L171.18,32 L173.58,32 L173.58,9.98 L171.18,9.98 L171.18,0.98 L184.2,0.98 L195.18,19.28 L195.18,9.98 L192.78,9.98 L192.78,0.98 L208.56,0.98 L208.56,9.98 L206.16,9.98 L206.16,32 L208.56,32 L208.56,41 L195.36,41 Z M225.3,32 L232.32,32 L232.32,30.38 L241.32,30.38 L241.32,41 L211.92,41 L211.92,32 L214.32,32 L214.32,9.98 L211.92,9.98 L211.92,0.98 L241.32,0.98 L241.32,11.6 L232.32,11.6 L232.32,9.98 L225.3,9.98 L225.3,16.52 L226.92,16.52 L226.92,14.9 L235.92,14.9 L235.92,27.14 L226.92,27.14 L226.92,25.52 L225.3,25.52 L225.3,32 Z M258.06,32 L260.46,32 L260.46,41 L244.68,41 L244.68,32 L247.08,32 L247.08,9.98 L244.68,9.98 L244.68,0.98 L269.46,0.98 L275.82,7.4 L275.82,17.66 L273.18,20.3 L275.82,22.88 L275.82,32 L278.22,32 L278.22,41 L264.84,41 L264.84,26.12 L263.58,24.8 L258.06,24.8 L258.06,32 Z M258.06,15.8 L263.58,15.8 L264.84,14.48 L264.84,11.3 L263.58,9.98 L258.06,9.98 L258.06,15.8 Z"></path>
+</svg>

_includes/new-post-tag.html

@@ -1,7 +1,6 @@
 {% capture weekago %}{{ "now" | date: "%s" | minus: 604800 }}{% endcapture %}
 {% capture posttime %}{{ include.date | date: "%s" }}{% endcapture %}
 {% if posttime > weekago %}
-{% assign isnewpost = true %}
-{% else %}
-{% assign isnewpost = false %}
+<div class="new-post-tag">{{ site.translations.text.new_post | default: "New Post" }}</div>
 {% endif %}
+

_includes/pagination-home.html

@@ -5,7 +5,7 @@
             <svg><use xlink:href="#icon-arrow-right"></use></svg>
         </a>
     {% endif %}
-    <span class="page_number ">Page {{ paginator.page }} of {{ paginator.total_pages }}</span>
+    <span class="page_number ">{{ site.translations.pagination.page | default: "Page" }} {{ paginator.page }} {{ site.translations.pagination.of | default: "of" }} {{ paginator.total_pages }}</span>
     {% if paginator.next_page %}
         <a href="{{ paginator.next_page_path }}" class="next" onclick="ga('send', 'event', 'pagination', 'click', 'page next')">
             <svg><use xlink:href="#icon-arrow-right"></use></svg>

_includes/pagination-post.html

@@ -7,14 +7,14 @@
                 {% if include.progressBar %}
                     {% include progress-bar.html %}
                 {% endif %}
-                <span class="text">Next Page <svg class="arrow"><use xlink:href="#icon-arrow-right"></use></svg></span>
+                <span class="text">{{ site.translations.pagination.next_page | default: "Next Page" }} <svg class="arrow"><use xlink:href="#icon-arrow-right"></use></svg></span>
             </a>
         {% else if next_posts.first %}
             <a href="{{ next_posts.first.url }}">
                 {% if include.progressBar %}
                     {% include progress-bar.html finished=true %}
                 {% endif %}
-                <span class="text">Next Post <svg class="arrow"><use xlink:href="#icon-arrow-right"></use></svg></span>
+                <span class="text">{{ site.translations.pagination.next_post | default: "Next Post" }} <svg class="arrow"><use xlink:href="#icon-arrow-right"></use></svg></span>
             </a>
         {% endif %}
     </div>

_includes/read-icon.html

@@ -0,0 +1,3 @@
+<div class="read-icon">
+    <svg><use xlink:href="#icon-read"></use></svg>
+</div>

_includes/recommendation.html

@@ -1,10 +1,10 @@
 <div class="recommendation">
     <div class="message">
-        <strong>Why don't you read something next?</strong>
+        <strong>{{ site.translations.recommendation.text | default: "Why don't you read something next?" }}</strong>
         <div>
             <button>
                 <svg><use xlink:href="#icon-arrow-right"></use></svg>
-                <span>Go back to top</span>
+                <span>{{ site.translations.recommendation.back_btn | default: "Go back to top" }}</span>
             </button>
         </div>
     </div>

_includes/search.html

@@ -1,6 +1,6 @@
 <div class="search-wrapper">
     <div class="search-form">
-        <input type="text" class="search-field" placeholder="Search">
+        <input type="text" class="search-field" placeholder="{{ site.translations.text.search | default: 'Search' }}">
         <svg class="icon-remove-sign"><use xlink:href="#icon-close"></use></svg>
         <ul class="search-results search-list"></ul>
     </div>

_includes/share.html

@@ -1,11 +1,11 @@
 <section class="share">
-    <h3>Share</h3>
-    <a aria-label="Share on Twitter" href="https://twitter.com/intent/tweet?text=&quot;{{ page.description }}&quot;%20{{ site.url }}{{ page.url }}%20via%20&#64;{{ site.twitter_username }}&hashtags={% for tag in page.tags %}{{tag}},{% endfor %}"
-    onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;" title="Share on Twitter">
+    <h3>{{ site.translations.text.share | default: "Share" }}</h3>
+    <a aria-label="{{ site.translations.button.share_on_twitter | default: 'Share on Twitter' }}" href="https://twitter.com/intent/tweet?text=&quot;{{ page.description }}&quot;%20{{ site.url }}{{ page.url }}%20via%20&#64;{{ site.twitter_username }}&hashtags={% for tag in page.tags %}{{tag}},{% endfor %}"
+    onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;" title="{{ site.translations.button.share_on_twitter | default: 'Share on Twitter' }}">
         <svg class="icon icon-twitter"><use xlink:href="#icon-twitter"></use></svg>
     </a>
-    <a aria-label="Share on Facebook"href="https://www.facebook.com/sharer/sharer.php?u={{ site.url }}{{ page.url }}"
-    onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;" title="Share on Facebook">
+    <a aria-label="{{ site.translations.button.share_on_facebook | default: 'Share on Facebook' }}" href="https://www.facebook.com/sharer/sharer.php?u={{ site.url }}{{ page.url }}"
+    onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;" title="{{ site.translations.button.share_on_facebook | default: 'Share on Facebook' }}">
         <svg class="icon icon-facebook"><use xlink:href="#icon-facebook"></use></svg>
     </a>
 </section>

_includes/subscription.html

@@ -0,0 +1 @@
+<!-- Add your newsletter subscription form here -->