Add the 'generators' for categories and tags

This commit is contained in:
foo-dogsquared 2018-10-24 17:51:53 +08:00
parent 3a92d6a745
commit 6a2bd100a2
23 changed files with 192 additions and 120 deletions

View File

@ -29,7 +29,7 @@ gitlab_username: foo-dogsquared
linkedin_username: gabriel-arazas
twitter_username: foo_dogsquared
paginate: 10
paginate_path: '/page:num/'
paginate_path: 'page/:num/'
# Enabling Disqus
disqus:
@ -48,15 +48,27 @@ pinpost: ["A Freebie's Resource List (Mostly Related to Programming)"]
google_analytics: UA-126718538-1
collections:
generators:
output: true
permalink: data/:name
# Default settings
defaults:
-
scope:
path: ""
path: "_posts"
type: "posts"
values:
permalink: posts/:title
layout: post
comments: true
-
scope:
path: "_generators"
type: "generators"
values:
layout: generator
# Exclude from processing.
# The following items will not be processed, by default. Create a custom list

View File

@ -0,0 +1,4 @@
---
data: categories
title: Categories
---

4
_generators/tags.md Normal file
View File

@ -0,0 +1,4 @@
---
data: tags
title: Tags
---

View File

@ -1,2 +1,14 @@
<!-- Mathjax -->
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=TeX-MML-AM_CHTML"></script>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]},
CommonHTML: {
scale: 100,
minScaleAdjust: 40,
linebreaks: {
automatic: true,
width: "container"
}}
});
</script>

View File

@ -1,22 +1,25 @@
<p class="post-meta">
<time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
<img src="{{ 'assets/main/icons/calendar.svg' | relative_url }}" style="width: 1.5em; height: 1.5em">
{%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
<span title="{{ page.date }}"> {{ page.date | date: date_format }}</span>
</time>
{%- assign page = include.page -%}
{%- assign include_link = include.include_link -%}
<time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
<img src="{{ 'assets/main/icons/calendar.svg' | relative_url }}" class="post-meta-icons">
{%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
<span title="{{ page.date }}">{{ page.date | date: date_format }}</span>
</time>
<span class="reading-minutes" style="margin-left: 1.25em">
<img src="{{ 'assets/main/icons/time-clock.svg' | relative_url }}" style="width: 1.5em; height: 1.5em;"> <span class="no-of-mins">{{ page.content | number_of_words }}</span> minutes
</span>
<span class="reading-minutes" style="margin-left: 1.25em">
<img src="{{ 'assets/main/icons/time-clock.svg' | relative_url }}" class="post-meta-icons"><span class="no-of-mins">{{ page.content | number_of_words }}</span> minutes
</span>
{%- if page.categories -%}
<span class="post-category" style="margin-left: 1.25em">
<img src="{{ 'assets/main/icons/categories.svg' | relative_url }}" style="width: 1.5em; height: 1.5em;">
{{ page.categories }}
</span>
{%- endif -%}
{%- if page.categories -%}
<span class="post-category" style="margin-left: 1.25em">
<img src="{{ 'assets/main/icons/categories.svg' | relative_url }}" class="post-meta-icons">
{%- if include_link -%}<a href="{{ site.baseurl }}/data/categories#{{ page.categories }}">{{ page.categories }}</a>
{%- else -%}<span>{{ page.categories }}</span>{%- endif -%}
</span>
{%- endif -%}
{%- if page.updatedOn -%}
<p class="dt-updated">Updated: <span>{{ page.updatedOn | escape }}</span></p>
{%- endif -%}
{%- if page.updatedOn -%}
<p class="dt-updated">Updated: <span>{{ page.updatedOn | escape }}</span></p>
{%- endif -%}
</p>

57
_layouts/generator.html Normal file
View File

@ -0,0 +1,57 @@
---
layout: default
---
{%- if content -%}
{{ content }}
{%- endif -%}
<!--
CREDITS to codinfox for this code
https://codinfox.github.io/dev/2015/03/06/use-tags-and-categories-in-your-jekyll-based-github-pages/
-->
{%- if page.data -%}
{% assign page_data = page.data %}
{% assign rawdata = "" %}
{% for post in site.posts %}
{% assign tdata = post[page_data] | join:'|' | append:'|' %}
{% assign rawdata = rawdata | append:tdata %}
{% endfor %}
{% assign rawdata = rawdata | split:'|' | sort %}
{% assign data = "" %}
{% for datum in rawdata %}
{% if datum != "" %}
{% if data == "" %}
{% assign data = datum | split:'|' %}
{% endif %}
{% unless data contains datum %}
{% assign data = data | join:'|' | append:'|' | append:datum | split:'|' %}
{% endunless %}
{% endif %}
{% endfor %}
<div class="keyword__grid">
{% for datum in data %}<a class="keywords" href="#{{ datum | slugify }}"> {{ datum }} </a>{% endfor %}
</div>
{% for datum in data %}
<div class="datum__post_list">
<h2 id="{{ datum | slugify }}">{{ datum }}</h2>
<ul>
{% for post in site.posts %}
{% if post[page_data] contains datum %}
<li>
<h3>
<a href="{{site.url}}{{site.baseurl}}{{ post.url }}">
{{ post.title }}
</a>
<small>{{ post.date | date_to_string }}</small>
</h3>
</li>
{% endif %}
{% endfor %}
</ul>
</div>
{% endfor %}
{%- endif -%}

View File

@ -23,32 +23,7 @@ layout: default
{% for post in paginator.posts %}
<div class="home-post">
<h2><a href="{{ post.url | relative_url }}" class="post-link">{{ post.title }}</a></h2>
<p class="post-meta">
<time class="dt-published" datetime="{{ post.date | date_to_xmlschema }}" itemprop="datePublished">
<img src="{{ 'assets/main/icons/calendar.svg' | relative_url }}" style="width: 1.5em; height: 1.5em">
{%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
<span title="{{ post.date }}"> {{ post.date | date: date_format }}</span>
</time>
<span class="reading-minutes" style="margin-left: 1.25em">
<img src="{{ 'assets/main/icons/time-clock.svg' | relative_url }}" style="width: 1.5em; height: 1.5em;"> <span class="no-of-mins">{{ post.content | number_of_words }}</span> minutes
</span>
{%- if post.categories -%}
<span class="home-post-category" style="margin-left: 1.25em">
<img src="{{ 'assets/main/icons/categories.svg' | relative_url }}" style="width: 1.5em; height: 1.5em;">
{{ post.categories }}
</span>
{%- endif -%}
{%- if post.updatedOn -%}
<span class="dt-updated" style="margin-left: 1.25em">
<img src="{{ 'assets/main/icons/update.svg' | relative_url }}" style="width: 1.5em; height: 1.5em;">
{{ post.updatedOn }}
</span>
{%- endif -%}
</p>
{%- include post_meta.html page=post include_link=true -%}
</div>
{% endfor %}
<script>

View File

@ -6,7 +6,7 @@ layout: default
<header class="post-header">
<h1 class="post-title p-name" itemprop="name headline">{{ page.title | escape }}{% if page.subtitle %}: <span class="post-subtitle">{{ page.subtitle | escape }}</span>{% endif %}
</h1>
{%- include post_meta.html -%}
{%- include post_meta.html page=page include_link=false -%}
</header>
<div class="post-content e-content" itemprop="articleBody">
@ -23,7 +23,7 @@ layout: default
<div class="post-tags">
<img src="{{ 'assets/main/icons/tag.svg' | relative_url }}" style="width: 2em; height: 2em">
{% for tag in page.tags %}
<a class="link-tag" href="{{site.baseurl}}/tags/#{{tag|slugize}}">{{tag}}</a>
<a class="link-tag" href="{{site.baseurl}}/data/tags#{{tag|slugize}}">{{tag}}</a>
{% unless forloop.last %}&nbsp;{% endunless %}
{% endfor %}
</div>

View File

@ -1,24 +0,0 @@
---
layout: page
permalink: /tags/
title: tags
---
<div id="archives">
{% for tag in site.tags %}
<div class="archive-group">
{% capture tag_name %}{{ tag | first }}{% endcapture %}
<div id="#{{ tag_name | slugize }}"></div>
<p></p>
<h3 class="tag-head">{{ tag_name }}</h3>
<a name="{{ tag_name | slugize }}"></a>
{% for post in site.tags[tag_name] %}
<article class="archive-item">
<h4><a href="{{ site.baseurl }}{{ post.url }}">{{post.title}}</a></h4>
</article>
{% endfor %}
</div>
{% endfor %}
</div>

View File

@ -3,15 +3,9 @@ html {
scroll-behavior: smooth
}
a,
a:hover,
a:visited {
color: $light-brown; // Specified settings for the headers in 'post.html'
}
blockquote {
font-family: "Georgia", $base-font-family;
border-left: $brown solid 5px;
border-left: $brand-color solid 5px;
color: $grey-color-dark;
font-style: italic;
padding: 1em;
@ -50,7 +44,7 @@ ul.social-media-list > li, #list-container > ul > li {
// Table custom properties
table:not(.rouge-table) {
th {
background: linear-gradient(to bottom, lighten($brown, 25%), $light-brown);
background: linear-gradient(to bottom, lighten($brand-color, 25%), $brand-color_l);
color: $super-platinum;
}
tr {
@ -59,11 +53,11 @@ table:not(.rouge-table) {
color: $text-color;
}
&:nth-child(odd) {
background: linear-gradient(to right, $dark-brown, $brown);
background: linear-gradient(to right, $brand-color_d, $brand-color);
color: $super-platinum;
}
&:nth-child(even) {
background: linear-gradient(to right, $dark-brown, $light-brown);
background: linear-gradient(to right, $brand-color_d, $brand-color_l);
color: $super-platinum;
}
}
@ -100,9 +94,10 @@ figure.highlight {
}
}
// Mathjax
.mjx-chtml {
font-size: 1.4em !important;
.mathjax {
&-text {
font-family: "Georgia", $base-font-family;
}
}
// custom properties for several layout items

View File

@ -1,6 +1,6 @@
#pinned-section {
background: linear-gradient(75deg, $dark-brown, $brown, $light-brown);
border: $brown 4px solid;
background: linear-gradient(75deg, $brand-color_d, $brand-color, $brand-color_l);
border: $brand-color 4px solid;
border-top: 0;
border-bottom: 0;
color: white;

View File

@ -1,5 +1,5 @@
.site-footer {
background: linear-gradient(75deg, $dark-brown, $brown, $light-brown);
background: linear-gradient(75deg, $brand-color_d, $brand-color, $brand-color_l);
border-top: 1px solid $grey-color-light;
color: $platinum;
padding: $spacing-unit 0;
@ -48,7 +48,7 @@
margin: 0;
}
a {
a, a:hover, a:visited {
color: $footer-link;
}

View File

@ -1,6 +1,6 @@
.site-header {
background: linear-gradient(75deg, $dark-brown, $brown, $light-brown);
border-top: 5px solid $dark-brown;
background: linear-gradient(75deg, $brand-color_d, $brand-color, $brand-color_l);
border-top: 5px solid $brand-color_d;
border-bottom: 1px solid $grey-color-light;
color: $super-platinum;
}

View File

@ -12,7 +12,10 @@ $spacing-unit: 30px !default;
$text-color: #111 !default;
$background-color: #fdfdfd !default;
$brand-color: #2a7ae2 !default;
$brand-color: #b3411d !default;
$brand-color_l: lighten($brand-color, 10%) !default;
$brand-color_d: darken($brand-color, 20%) !default;
$grey-color: #504f4f !default;
$grey-color-light: lighten($grey-color, 40%) !default;
@ -27,11 +30,6 @@ $on-palm: 600px !default;
$on-laptop: 800px !default;
$on-small-phone: 400px !default;
// Custom variable are added here
$brown: #b3411d !default;
$dark-brown: darken($brown, 20%) !default;
$light-brown: lighten($brown, 10%) !default;
$platinum: #e8ebe4;
$super-platinum: lighten($platinum, 15%) !default;

View File

@ -97,21 +97,18 @@ h1, h2, h3, h4, h5, h6 {
font-weight: $base-font-weight;
}
/**
* Links
*/
a {
color: $brand-color;
color: $brand-color_l;
text-decoration: none;
&:visited {
color: darken($brand-color, 15%);
color: $brand-color;
}
&:hover {
color: $text-color;
text-decoration: underline;
}

View File

@ -18,10 +18,7 @@
margin-bottom: 0;
float: left;
&,
&:visited {
color: $grey-color-dark;
}
&, &:visited {color: $grey-color-dark;}
}
.site-nav {
@ -41,9 +38,7 @@
line-height: $base-line-height;
// Gaps between nav items, but not on the last one
&:not(:last-child) {
margin-right: 20px;
}
&:not(:last-child) {margin-right: 20px;}
}
@include media-query($on-palm) {
@ -73,9 +68,7 @@
padding-top: 10px;
text-align: center;
> svg {
fill: $grey-color-dark;
}
> svg {fill: $grey-color-dark;}
}
input ~ .trigger {
@ -190,14 +183,17 @@
margin-left: 0;
list-style: none;
> li {
margin-bottom: $spacing-unit;
}
> li {margin-bottom: $spacing-unit;}
}
.post-meta {
display: flex;
flex-flow: row wrap;
font-size: $small-font-size;
color: $grey-color;
margin: .25em;
a:visited, a:hover {color: $brand-color_l}
}
.post-link {

View File

@ -0,0 +1,30 @@
.keyword__grid {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin-bottom: 2em;
}
.keywords {
border: $brand-color 1px solid;
background: lighten($brand-color_l, 20%);
color: white;
margin: .2em;
padding: .2em;
&:hover, &:visited {color: white;}
}
.datum__post_list:not(:last-of-type){
margin-bottom: 4em;
> ul {
> li {
padding: .5em;
&:nth-of-type(even) {background: lighten($brand-color_l, 40%)}
> * {margin: 0}
}
}
}

View File

@ -1,3 +1,4 @@
@import
"classification_pages",
"notes"
;

View File

@ -5,7 +5,7 @@
margin: .25em;
padding: .5em;
&:nth-child(odd) {
background: lighten($brown, 50%);
background: lighten($brand-color, 50%);
}
&:last-child {
margin-bottom: 1em;

View File

@ -1,5 +1,5 @@
#list-container {
border: 3px $brown dashed;
border: 3px $brand-color dashed;
border-left: 0px;
border-right: 0px;
color: $grey-color;

View File

@ -22,6 +22,12 @@
h2 {
@include relative-font-size(2);
&::after {
content: "";
display: block;
border-bottom: 2px solid black;
}
@include media-query($on-laptop) {
@include relative-font-size(1.75);
}
@ -88,3 +94,9 @@
}
}
}
.post-meta-icons {
width: 1.5em;
height: 1.5em;
padding: 0 .2em;
}

View File

@ -15,6 +15,6 @@
}
.post-link:visited {
color: $brown;
color: $brand-color;
}

View File

@ -19,6 +19,6 @@
color: $grey-color-dark;
font-size: $small-font-size;
.link-tag {
color: $brown;
color: $brand-color;
}
}