minimal-categorized 0.0.10 → 0.0.15

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 156570bfb4f581a3e86595e953d9ca2590a38090df109e508def1672dd846643
-  data.tar.gz: 1a447df98586bb3a1163f732db414be39672f5b679b4b37e9bccbc6b2b80abb7
+  metadata.gz: e6502026a79ea5121f0509b0e4a8827216fcb67cc649ab4535d3e6d0efa47806
+  data.tar.gz: f191548fd794fa7e02b19ee089b98ffae4966e6acb701b449c139c25175bb710
 SHA512:
-  metadata.gz: e92a5f75922ba7ad82fcee985c0de87601b2e36879938f63b193e5bacf10266bf9299eae364fae51237b6d35438a8a204e9d7a0b949285a75358ed1ff6336a5b
-  data.tar.gz: ff0ee93d37f6f377f9435e554077a27151f7cdd7670212b95700ce92e8526571ae3eafb8b0eedac90622ce4552694f2dadf8b2b3102b7adb6fb55bfad8384f88
+  metadata.gz: c057ba19e233ba9095d998e3108e0138a012d01a69ce34ec6af5d36ade8a739bd2d5807142a3b65c1be3a28c049ff56264202457e66f8f956e0d25f05d6f0c08
+  data.tar.gz: c73a249740c57abd2112ac60037b66aaed2fde4d2df8bd7bc0401b7a97594913a4285b80e45a06b19c07eaf32690a7d9b0f9935f73d7b18d866e13e2fb632fb3

data/README.md

@@ -2,7 +2,7 @@
 
 [![LICENSE](https://img.shields.io/badge/license-MIT-lightgrey.svg)](https://raw.githubusercontent.com/mmistakes/minimal-mistakes/master/LICENSE)
 [![Jekyll](https://img.shields.io/badge/jekyll-%3E%3D%203.9-blue.svg)](https://jekyllrb.com/)
-[![Ruby gem](https://img.shields.io/gem/v/minimal-mistakes-jekyll.svg)](https://rubygems.org/gems/minimal-mistakes-jekyll)
+[![Gem Version](https://badge.fury.io/rb/minimal-categorized.svg)](https://badge.fury.io/rb/minimal-categorized)
 
 minimal-categorized is a flexible Jekyll theme, designed for sites with content easily aggregated into categories. Demo is available [here](https://itsmeaga1n.github.io/minimal-categorized/).
 
@@ -40,7 +40,7 @@ Structure of `_data/menu.yml`:
 * menu_title: Displayed on menu (only for normal menu)
 * menu_headline: Displayed in menu (only for normal menu) and in about page
 * menu_intro: Displayed in menu (only for normal menu) and in about page
-* show_menu_on_category_select: Boolean value determining if menu should be visible on category selection page
+* show_menu_on_gate_page: Boolean value determining if menu should be visible on category selection page
 * minimal_menu: Boolean value determining the style of menu bar
 * menu_logo: Path to logo displayed on menu (only for normal menu)
 * menu_pages: a list of items in menu. Each item contains information:

data/_data/menu.yml

@@ -1,11 +1,17 @@
 menu_title: Example menu title
 menu_headline: example menu headline
 menu_intro: Hi! This is an example of intro that you could write for your jekyll minimal-categorized theme!
-show_menu_on_category_select: False
+show_menu_on_gate_page: False
 minimal_menu: True
 menu_logo: assets/img/avatar.png
 
 menu_pages:
+- title: Home
+  url: /
+  show_on_home: False
+  icon_name: fas fa-home
+  category: home
+
 - title: Category 1
   url: /category-1.html
   show_on_home: True
@@ -13,6 +19,7 @@ menu_pages:
   icon_name: fas fa-dice
   category: category-1
   tooltip: This is category 1
+  description: Category 1 description, which is written in menu.yml file under :description property
 
 - title: Category 2
   url: /category-2.html
@@ -21,8 +28,9 @@ menu_pages:
   icon_name: fas fa-cogs
   category: category-2
   tooltip: This is category 2
+  description: Category 2 description, which is written in menu.yml file under :description property
 
-- title: ABOUT
+- title: About
   url: about.html
   show_on_home: False
   icon_name: fas fa-address-card

data/_data/metaData.yml

@@ -1,5 +1,7 @@
 author: Site Author
 avatar_url: assets/img/avatar.png
+lightTheme: False
+show_menu_logo_on_home_page: True
 cookies:
   enabled: True
   message: This site might be using cookies! Customize your message or disable cookies in metaData.yml!

data/_includes/avatar.html

@@ -0,0 +1,5 @@
+<div class="avatar_container">
+    <div class="avatar" >
+        <img src="{{ site.data.metaData.avatar_url }}" alt="avatar" onerror="this.style.display='none'"> 
+    </div>
+</div>

data/_includes/menu.html

@@ -1,62 +1,61 @@
 {% if site.data.menu.minimal_menu %}
-<aside class="menu">
-    <div class="menu-top">
+    <aside class="menu">
+        <div class="menu-top">
 
-        <ul class="navigation">
-            {% for menu_item in site.data.menu.menu_pages %}
-            <li>
-                <a href="{{ menu_item.url | relative_url }}" category="{{ menu_item.category }}" title="{{ menu_item.tooltip }}">
-                    <i class="{{ menu_item.icon_name }}"> </i>
+            <ul class="navigation">
+                {% for menu_item in site.data.menu.menu_pages %}
+                <li>
+                    <a href="{{ menu_item.url | relative_url }}" category="{{ menu_item.category }}" title="{{ menu_item.tooltip }}">
+                        <i class="{{ menu_item.icon_name }}"> </i>
+                    </a>
+                </li>
+                {% endfor %}
+            </ul>
+        </div>
+        <div class="menu-contact">
+            {% for contact in site.data.menu.menu_contacts %}
+                <a href="{{ contact.url | relative_url }}" target="{{ contact.target }}">
+                    <i class="{{ contact.faicon }}"></i>
                 </a>
-            </li>
             {% endfor %}
-        </ul>
-    </div>
-    <div class="menu-contact">
-        {% for contact in site.data.menu.menu_contacts %}
-
-        <a href="{{ contact.url | relative_url }}" target="{{ contact.target }}">
-            <i class="{{ contact.faicon }}"></i>
-        </a>
-        {% endfor %}
-    </div>
-</aside>
+        </div>
+    </aside>
 
 {% else %}
 
-<aside class="menu">
-    <div class="menu-top">
-        <div class="profile">
-            <div class="avatar">
-                <a href="{{ '/about.html' | relative_url }}" alt="avatar">
-                    <img src="{{ site.data.menu.menu_logo | relative_url }}" alt="avatar" onerror="this.style.display='none'">
-                </a>
+    <aside class="menu">
+        <div class="menu-top">
+            <div class="profile">
+                <div class="avatar">
+                    <a href="{{ '/about.html' | relative_url }}" alt="avatar">
+                        <img src="{{ site.data.menu.menu_logo | relative_url }}" alt="avatar" onerror="this.style.display='none'">
+                    </a>
+                </div>
+                <h1>{{ site.data.menu.menu_title }}</h1>
+                <h2>{{ site.data.menu.menu_headline }}</h2>
+                <p>{{ site.data.menu.menu_intro }}</p>
             </div>
-            <h1>{{ site.data.menu.menu_title }}</h1>
-            <h2>{{ site.data.menu.menu_headline }}</h2>
-            <p>{{ site.data.menu.menu_intro }}</p>
+
+            <ul class="navigation">
+                {% for menu_item in site.data.menu.menu_pages %}
+                <li>
+                    <a href="{{ menu_item.url | relative_url }}" category="{{ menu_item.category }}" title="{{ menu_item.tooltip }}">
+                        <i class="{{ menu_item.icon_name }}"> </i>
+                        <span>{{ menu_item.title }}</span>
+                    </a>
+                </li>
+                {% endfor %}
+            </ul>
         </div>
+        <div class="menu-contact">
+            {% for contact in site.data.menu.menu_contacts %}
 
-        <ul class="navigation">
-            {% for menu_item in site.data.menu.menu_pages %}
-            <li>
-                <a href="{{ menu_item.url | relative_url }}" category="{{ menu_item.category }}" title="{{ menu_item.tooltip }}">
-                    <i class="{{ menu_item.icon_name }}"> </i>
-                    <span>{{ menu_item.title }}</span>
-                </a>
-            </li>
+            <a href="{{ contact.url | relative_url }}" target="{{ contact.target }}">
+                <i class="{{ contact.faicon }}"></i>
+            </a>
             {% endfor %}
-        </ul>
-    </div>
-    <div class="menu-contact">
-        {% for contact in site.data.menu.menu_contacts %}
-
-        <a href="{{ contact.url | relative_url }}" target="{{ contact.target }}">
-            <i class="{{ contact.faicon }}"></i>
-        </a>
-        {% endfor %}
-    </div>
-</aside>
+        </div>
+    </aside>
 {% endif %}
 
 <script>

data/_layouts/gate.html

@@ -0,0 +1,35 @@
+<!doctype html>
+<html>
+  <head>
+    {% include common-head.html %}
+    <script>
+      {% include gate.js %}
+    </script>
+  </head>
+  {% if site.data.menu.minimal_menu and site.data.menu.show_menu_on_gate_page %}
+  <body class="is-minimal-menu" >
+  {% else %}
+  <body>
+  {% endif %}
+    {% if site.data.menu.show_menu_on_gate_page %}
+    {% include menu.html %}
+    <main class="content-layout">
+    {% else %}
+    <main class="content-layout no-menu">
+    {% endif %}
+        <div class="gate">
+            {% for menu_item in site.data.menu.menu_pages %}
+                {% if menu_item.show_on_home %}
+                    <a href="{{ menu_item.url | relative_url }}" class="category-container">
+                        <div class="category" style="background-image: url('{{ menu_item.image_url | relative_url}}')"></div>
+                        <p>
+                            {{ menu_item.title }}
+                        </p>
+                    </a>
+                {% endif %}
+            {% endfor %}
+        </div>
+      </main>
+  </body>
+</html>
+

data/_layouts/home.html

@@ -1,35 +1,35 @@
-<!doctype html>
-<html>
-  <head>
-    {% include common-head.html %}
-    <script>
-      {% include home.js %}
-    </script>
-  </head>
-  {% if site.data.menu.minimal_menu and site.data.menu.show_menu_on_category_select %}
-  <body class="is-minimal-menu" >
-  {% else %}
-  <body>
-  {% endif %}
-    {% if site.data.menu.show_menu_on_category_select %}
-    {% include menu.html %}
-    <main class="content-layout">
-    {% else %}
-    <main class="content-layout no-menu">
+---
+layout: default
+category: home
+---
+<div class="content-container home">
+    
+    <h1>
+        {% if site.data.metaData.show_menu_logo_on_home_page %}
+        {% include avatar.html %}
     {% endif %}
-        <div class="home">
-            {% for menu_item in site.data.menu.menu_pages %}
-                {% if menu_item.show_on_home %}
-                    <a href="{{ menu_item.url | relative_url }}" class="category-container">
-                        <div class="category" style="background-image: url('{{ menu_item.image_url | relative_url}}')"></div>
-                        <p>
-                            {{ menu_item.title }}
-                        </p>
+        {{ page.title }}
+    </h1>
+    <p class="page-summary">{{ page.summary }}</p>
+    <div class="category_wrapper">
+    {% for menu_item in site.data.menu.menu_pages %}
+        {% if menu_item.show_on_home %}
+            <div class="category_container">
+                <div class="category_image">
+                    <a href="{{ menu_item.url | relative_url }}">
+                        <img class="category" src="{{ menu_item.image_url | relative_url}}">
                     </a>
-                {% endif %}
-            {% endfor %}
-        </div>
-      </main>
-  </body>
-</html>
-
+                </div>
+                <div class="category_description">
+                    <a href="{{ menu_item.url | relative_url }}">
+                    <h2> {{ menu_item.title }} </h2>
+                    </a>
+                    <p>
+                        {{ menu_item.description }}
+                    </p>
+                </div>
+            </div>
+        {% endif %}
+    {% endfor %}
+</div>
+</div>

data/_layouts/post.html

@@ -9,6 +9,8 @@ layout: default
     {% endif %}
     <div class="content-container {{ page.category }}">
         <h1>{{ page.title }}</h1>
-        {{content}}
+        <div class="post-content">
+            {{content}}
+        </div>
     </div>
 </div>

data/_sass/styles/_avatar.scss

@@ -0,0 +1,16 @@
+.avatar {
+    &_container {
+        justify-content: center!important;
+        display: flex;
+    }
+    display: block;
+    width: $avatar-dim;
+    height: $avatar-dim;
+    border-radius: 50%;
+    border: 2px solid $p_light;
+    overflow: hidden;
+    img {
+        height: $avatar-dim;
+        width: $avatar-dim;
+    }
+}

data/_sass/styles/_category-aggregator.scss

@@ -1,16 +1,16 @@
 .category-aggregator {
-    color: $p_dark;
+    color: $p_text;
     a {
-        color: $secondary;
+        color: $p_text;
         &:hover {
-            color: darken($secondary, 10%);
+            color: $primary;
         }
     }
     hr {
         border: 0;
         height: 0;
         border-top: 1px solid rgba(0, 0, 0, 0.1);
-        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
+        border-bottom: 1px solid $p_text_dimmed;
         margin: $gap auto $gap * 0.5 auto;
     }
     article {
@@ -20,7 +20,7 @@
             padding-left: 18px;
             font-style: italic;
             margin-top: -0.6em;
-            color: rgba(0, 0, 0, 0.4);
+            color: $p_text_dimmed;
             font-size: 0.9em;
         }
         .article-read {

data/_sass/styles/_cookies.scss

@@ -1,19 +1,18 @@
 .cookie-container {
     position: fixed;
-    right: 0;
     padding: 20px 15px;
-    z-index: 100;
-    background-image: radial-gradient(farthest-corner at 25% 0, $primary, $p_dark);
-    box-shadow: 0 0 6px 0 $p_dark;
+    z-index: $pop-ups-z-1;
+    background-image: radial-gradient(farthest-corner at 25% 0, $p_darkest, $dark);
+    box-shadow: 0 0 6px 0 $dark;
     text-align: center;
     opacity: 0.95;
     -webkit-transition: opacity 800ms, visibility 800ms;
     transition: opacity 800ms, visibility 800ms;
     bottom: 30px;
-    left: 30px;
+    left: 40px;
     max-width: 300px;
     border-radius: 3px;
-    border: 3px solid $p_dark;
+    border: 3px solid $dark;
 
     p {
         color: $p_text;
@@ -25,15 +24,30 @@
         visibility: hidden;
     }
     button {
-        line-height: 1.5;
+        line-height: 1.4;
         font-weight: 700;
-        font-family: Titillium Web,sans-serif;
         display: inline-block;
-        padding: 15px 30px;
-        background: $p_text;
-        color: $primary;
-        border: 3px solid $p_light;
+        padding: 10px 20px;
+        background-color: $p_dark;
+        color: $p_text;
+        border: none;
         border-radius: 3px;
         text-decoration: none;
+        cursor: pointer;
+        -webkit-transition: background-color 200ms;
+        transition: background-color 200ms;
+        &:hover {
+            background-color: $primary;
+        }
+    }
+    @include mobile {
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        max-width: 100%;
+        padding: 12px 10px;
+        border-left: 0;
+        border-right: 0;
+        border-bottom: 0;
     }
 }

data/_sass/styles/_defaults.scss

@@ -2,18 +2,18 @@ h1 {
     text-transform: uppercase;
     font-weight: 700;
     text-rendering: optimizeLegibility;
-    color: inherit;
+    color: $primary;
     text-align: center;
     font-size: 2.5em;
     letter-spacing: -1px;
-    padding: 1em 50px 1em;
+    padding: 0.5em;
 }
 
-h2, h2 a {
+h2, h2, h3 a {
     font-weight: 700;
     font-size: 1.4em;
     line-height: 1.4em;
-    color: $secondary;
+    color: $primary;
 }
 
 * {
@@ -26,6 +26,7 @@ body {
     font-size: 16px;
     color: $base-white;
     font-family: forma-djr-micro,Arial,sans-serif;
+    -webkit-font-smoothing: antialiased;
 }
 main {
     .content-container {
@@ -35,7 +36,9 @@ main {
         padding: 0px 18px 24px;
         flex-grow: 1;
         position: relative;
-
+        p {
+            @include hyperlink-convention();
+        }
         .content-separator {
             margin: $gap auto;
             &:last-child {