r-jekyll-theme 0.1.2 → 0.1.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +46 -36
- data/_config.yml +41 -39
- data/_includes/blog/categories.html +16 -0
- data/_includes/blog/go_back_to_blog.html +3 -0
- data/_includes/blog/post_meta.html +76 -0
- data/_includes/blog/posts_list.html +23 -0
- data/_includes/blog/tags.html +16 -0
- data/_includes/footer.html +11 -12
- data/_includes/head.html +4 -6
- data/_includes/header.html +13 -7
- data/_includes/print/print_button.html +1 -1
- data/_includes/toc/pages.html +19 -6
- data/_layouts/default.html +6 -8
- data/_layouts/post.html +27 -0
- data/_sass/r.scss +2 -2
- data/_sass/r/content/blog.scss +102 -0
- data/_sass/r/content/code.scss +1 -0
- data/_sass/r/content/image.scss +1 -0
- data/_sass/r/content/note.scss +2 -2
- data/_sass/r/content/quote.scss +3 -3
- data/_sass/r/content/title.scss +15 -5
- data/_sass/r/layout/desktop.scss +48 -19
- data/_sass/r/layout/mobile.scss +17 -5
- data/_sass/r/styling/animations.scss +8 -8
- data/assets/blog/neonbrand-Ak5c5VTch5E-unsplash.jpg +0 -0
- metadata +10 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 8c47ff1ed0df12505c7bd7609720ac3dd4825a19f364b2a867f6174ef68f5678
|
4
|
+
data.tar.gz: ab52c289ae446332afa5ba2c4882ca651eee86ea5461544cead50d6bd16ccc57
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 4c8a4f3eac91be6ee8d2d805f1c8a1858742a55274651e34b07cd5b1e93dbf8517119e0dfafafdf803d1ebc50d02e8bf9ffc80689bca75a6b106cf132db9a2da
|
7
|
+
data.tar.gz: 5f9d5c3058ca0966fd9b3f0f0830fef5f1b2b3587fadf986f7b99d6984cc5d9287a3796b9e5d5c3720c6711cca930ed8a18c6acc94c4f701956aff0855a4e273
|
data/README.md
CHANGED
@@ -8,18 +8,22 @@ You can install the github-remote or gem-based r-jekyll-theme. You can also fork
|
|
8
8
|
### Preparing for the theme installation
|
9
9
|
You need to create a directory for your Jekyll site and initialize a `Gemfile`.
|
10
10
|
|
11
|
-
|
11
|
+
#### Before you begin
|
12
|
+
Ensure that you have Ruby and Jekyll installed. See [Jekyll - Quickstart](https://jekyllrb.com/docs/).
|
13
|
+
|
14
|
+
1. Create a directory in which you want to develop your Jekyll site.
|
12
15
|
2. In the site directory, run `bundle init`
|
13
16
|
**Result:** A `Gemfile` is created.
|
14
17
|
|
15
18
|
### Installing the github-remote-theme
|
16
|
-
|
19
|
+
If you plan to deploy your Jekyll site to GitHub-Pages, use this installation method.
|
17
20
|
|
18
21
|
1. To the `Gemfile`, add:
|
19
22
|
```ruby
|
23
|
+
gem "github-pages"
|
20
24
|
gem "jekyll-remote-theme"
|
21
25
|
```
|
22
|
-
2. In the site directory, create
|
26
|
+
2. In the site directory, create the `_config.yml` file.
|
23
27
|
3. To the `_config.yml` file, add:
|
24
28
|
```yaml
|
25
29
|
plugins:
|
@@ -29,21 +33,22 @@ This is the recommended theme installation method if you plan to deploy your Jek
|
|
29
33
|
4. Run `bundle`
|
30
34
|
|
31
35
|
### Installing the gem-based theme
|
32
|
-
|
36
|
+
If you're into old school, use this installation method.
|
33
37
|
|
34
38
|
1. To the `Gemfile`, add:
|
35
39
|
```ruby
|
40
|
+
gem "github-pages"
|
36
41
|
gem "r-jekyll-theme"
|
37
42
|
```
|
38
|
-
2. In the site directory, create
|
39
|
-
|
43
|
+
2. In the site directory, create the `_config.yml` file.
|
44
|
+
3. To the `_config.yml` file, add:
|
40
45
|
```yaml
|
41
46
|
theme: r-jekyll-theme
|
42
47
|
```
|
43
|
-
|
48
|
+
4. Run `bundle`
|
44
49
|
|
45
50
|
### Forking the theme GitHub repository
|
46
|
-
|
51
|
+
If you want to heavily modify the template, use this installation method.
|
47
52
|
|
48
53
|
1. Fork the [r-jekyll-theme](https://github.com/rafalkaron/r-jekyll-theme) repository.
|
49
54
|
2. In the root directory of the forked repository, run `bundle`
|
@@ -55,35 +60,27 @@ The r-jekyll-theme requires little configuration. You just need to add some cont
|
|
55
60
|
You add content by creating Markdown files in the root directory of your Jekyll site.
|
56
61
|
**NOTE:** You should start adding your content by creating the `index.md` file.
|
57
62
|
|
58
|
-
1.
|
63
|
+
1. In the root directory of your Jekyll site, create a Markdown file.
|
59
64
|
For example, create the `index.md` file.
|
60
65
|
1. Open the file and add:
|
61
|
-
```markdown
|
62
|
-
---
|
63
|
-
layout: default
|
64
|
-
title: Home
|
65
|
-
order: "0"
|
66
|
-
---
|
67
|
-
```
|
68
|
-
where:
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
1. Add content.
|
66
|
+
```markdown
|
67
|
+
---
|
68
|
+
layout: default
|
69
|
+
title: Home
|
70
|
+
order: "0"
|
71
|
+
---
|
72
|
+
```
|
73
|
+
where:
|
74
|
+
* `layout` is the site HTML template. Always use the `default` value.
|
75
|
+
* `title` is the page title that appears in the site navigation and in the web browser tab.
|
76
|
+
* `order` is the position of the page link in the site navigation.
|
77
|
+
1. Add Markdown (Kramdown) content.
|
73
78
|
For reference, see [content.md](https://raw.githubusercontent.com/rafalkaron/r-jekyll-theme/main/content.md).
|
74
79
|
**TIP:** To keep your files organized, add any media files to the `assets` directory.
|
75
80
|
1. Save the Markdown file.
|
76
81
|
|
77
|
-
### Previewing your site
|
78
|
-
1. Set up your development environment by running `bundle install`
|
79
|
-
2. Run `bundle exec jekyll serve`
|
80
|
-
3. In your web browser, go to `http://localhost:4000`
|
81
|
-
4. Add pages, documents, data, styling etc.
|
82
|
-
For more information, see [Jekyll Home](https://jekyllrb.com/).
|
83
|
-
**Info:** As you modify the theme or add content, your site regenerates automatically in the web browser. However, to see any `_config.yml` updates, you need to restart the server.
|
84
|
-
|
85
82
|
### Configuring site metadata and contact info
|
86
|
-
You configure site metadata and contact information by editing the `_confing.yml` file.
|
83
|
+
You configure site metadata and contact information by editing the `_confing.yml` file. For reference, see the default [_config.yml](https://raw.githubusercontent.com/rafalkaron/r-jekyll-theme/main/_config.yml).
|
87
84
|
|
88
85
|
### Styling
|
89
86
|
You can override the default styling by creating the `main.scss` file in the `assets` directory.
|
@@ -91,10 +88,23 @@ You can override the default styling by creating the `main.scss` file in the `as
|
|
91
88
|
1. In the root directory of your Jekyll site, create the `assets` directory.
|
92
89
|
2. In the `assets` directory, create and open the `main.scss` file.
|
93
90
|
3. To the `main.scss` file, add:
|
94
|
-
```scss
|
95
|
-
---
|
96
|
-
---
|
97
|
-
@import "r";
|
98
|
-
```
|
91
|
+
```scss
|
92
|
+
---
|
93
|
+
---
|
94
|
+
@import "r";
|
95
|
+
```
|
99
96
|
5. Under the `@import "r";` rule, add your styling.
|
100
|
-
4. Save the `main.scss` file.
|
97
|
+
4. Save the `main.scss` file.
|
98
|
+
|
99
|
+
### Previewing your site
|
100
|
+
You can generate and preview your site locally before publishing it.
|
101
|
+
|
102
|
+
1. Set up your development environment by running `bundle install`
|
103
|
+
2. Run `bundle exec jekyll serve`
|
104
|
+
3. In your web browser, go to `http://localhost:4000`
|
105
|
+
4. Add pages, documents, data, styling etc. For more information, see [Jekyll Home](https://jekyllrb.com/).
|
106
|
+
**Info:** As you modify the theme or add content, your site should regenerate automatically in the web browser. However, to see any `_config.yml` updates, you need to restart the server.
|
107
|
+
If your site does not regenerate automatically in the web browser, ensure that you have the following added to your `_config.yml` file:
|
108
|
+
```yaml
|
109
|
+
livereload: true
|
110
|
+
```
|
data/_config.yml
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
### Site metadata
|
2
|
-
title:
|
2
|
+
title: Red
|
3
3
|
author: Name Surname
|
4
4
|
description: Site description
|
5
5
|
keywords: comma, separated, keywords
|
@@ -8,48 +8,50 @@ logo: "Red"
|
|
8
8
|
|
9
9
|
### Contact data
|
10
10
|
contact:
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
11
|
+
email:
|
12
|
+
id: "mail@domain.com"
|
13
|
+
href: "mailto:"
|
14
|
+
title: "Email"
|
15
|
+
icon: "/assets/icons/email.svg"
|
16
|
+
icon_dark: "/assets/icons/email_dark.svg"
|
17
|
+
github:
|
18
|
+
id: "github_id"
|
19
|
+
href: "https://github.com/"
|
20
|
+
title: "GitHub"
|
21
|
+
icon: "/assets/icons/github.svg"
|
22
|
+
icon_dark: "/assets/icons/github_dark.svg"
|
23
|
+
linkedin:
|
24
|
+
id: "linkedin_id"
|
25
|
+
href: "https://linkedin.com/in/"
|
26
|
+
title: "LinkedIn"
|
27
|
+
icon: "/assets/icons/linkedin.svg"
|
28
|
+
icon_dark: "/assets/icons/linkedin_dark.svg"
|
29
|
+
twitter:
|
30
|
+
id: "twitter_id"
|
31
|
+
href: "https://twitter.com/"
|
32
|
+
title: "Twitter"
|
33
|
+
icon: "/assets/icons/twitter.svg"
|
34
|
+
icon_dark: "/assets/icons/twitter_dark.svg"
|
35
|
+
500px:
|
36
|
+
id: "500px_id"
|
37
|
+
href: "https://500px.com/"
|
38
|
+
title: "500px"
|
39
|
+
icon: "/assets/icons/500px.svg"
|
40
|
+
icon_dark: "/assets/icons/500px_dark.svg"
|
41
41
|
|
42
42
|
### Site configuration
|
43
|
+
permalink: blog/:categories/:title/
|
43
44
|
livereload: true
|
44
|
-
exclude:
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
45
|
+
exclude:
|
46
|
+
- LICENSE
|
47
|
+
- Gemfile
|
48
|
+
- Gemfile.lock
|
49
|
+
- README.md
|
50
|
+
- r-jekyll-theme.gemspec
|
51
|
+
- r-jekyll-theme-0.1.2.gem
|
50
52
|
markdown: kramdown
|
51
53
|
kramdown:
|
52
|
-
|
54
|
+
input: GFM
|
53
55
|
|
54
56
|
### GitHub-remote theme
|
55
57
|
#plugins:
|
@@ -57,4 +59,4 @@ kramdown:
|
|
57
59
|
#remote_theme: rafalkaron/r-jekyll-theme@main
|
58
60
|
|
59
61
|
### Gem-based theme
|
60
|
-
#theme: r-jekyll-theme
|
62
|
+
#theme: r-jekyll-theme
|
@@ -0,0 +1,16 @@
|
|
1
|
+
{% if site.categories %}
|
2
|
+
<div id="categories-container">
|
3
|
+
<h1 class="blog-header" id="blog-categories">Categories</h1>
|
4
|
+
{% for category in site.categories %}
|
5
|
+
<div class="category-group">
|
6
|
+
{% capture category_name %}{{ category | first }}{% endcapture %}
|
7
|
+
<h3 id="{{ category_name | slugize }}" class="category-head">{{ category_name }}</h3>
|
8
|
+
<ul class="post-tags">
|
9
|
+
{% for post in site.categories[category_name] %}
|
10
|
+
<li class="post-tag"><a href="{{ site.baseurl }}{{ post.url }}">{{post.title}}</a></li>
|
11
|
+
{% endfor %}
|
12
|
+
</ul>
|
13
|
+
</div>
|
14
|
+
{% endfor %}
|
15
|
+
</div>
|
16
|
+
{%endif%}
|
@@ -0,0 +1,76 @@
|
|
1
|
+
<div class="post-meta">
|
2
|
+
<div class="post-info">
|
3
|
+
{% if post %}
|
4
|
+
<time class="post-published" datetime="{{ post.date | date_to_xmlschema }}{{ post.date | date_to_xmlschema }}" itemprop="datePublished">{{ post.date | date: date_format }}</time>
|
5
|
+
{%endif%}
|
6
|
+
{% if page %}
|
7
|
+
<time class="post-published" datetime="{{ page.date | date_to_xmlschema }}{{ page.date | date_to_xmlschema }}" itemprop="datePublished">{{ page.date | date: "%B %d, %Y" }}</time>
|
8
|
+
{%endif%}
|
9
|
+
|
10
|
+
{%- if post.modified_date -%}<span> ~ </span>
|
11
|
+
{%- assign mdate = post.modified_date | date_to_xmlschema -%}
|
12
|
+
<time class="post-modified" datetime="{{ mdate }}" itemprop="dateModified">{{ mdate | date: date_format }}</time>
|
13
|
+
{%- endif -%}
|
14
|
+
{%- if page.modified_date -%}<span> ~ </span>
|
15
|
+
{%- assign mdate = page.modified_date | date_to_xmlschema -%}
|
16
|
+
<time class="post-modified" datetime="{{ mdate }}" itemprop="dateModified">{{ mdate | date: "%B %d, %Y" }}</time>
|
17
|
+
{%- endif -%}
|
18
|
+
|
19
|
+
{%- if post.author -%}<span> • </span>
|
20
|
+
<span class="p-author h-card" itemprop="name">{{ post.author }}</span>
|
21
|
+
{% endif -%}
|
22
|
+
{%- if page.author -%}<span> • </span>
|
23
|
+
<span class="p-author h-card" itemprop="name">{{ page.author }}</span>
|
24
|
+
{% endif -%}
|
25
|
+
|
26
|
+
{%- if post.category -%}<span> • </span>
|
27
|
+
<span class="post-categories">
|
28
|
+
{% assign categories = post.categories %}
|
29
|
+
{% for category in categories %}
|
30
|
+
<a href="{{site.baseurl}}/blog/#{{category|slugize}}">{{category}}</a>
|
31
|
+
{% unless forloop.last %} {% endunless %}
|
32
|
+
{% endfor %}
|
33
|
+
</span>
|
34
|
+
{%- endif -%}
|
35
|
+
{%- if page.category -%}<span> • </span>
|
36
|
+
<span class="post-categories">
|
37
|
+
{% assign categories = page.categories %}
|
38
|
+
{% for category in categories %}
|
39
|
+
<a href="{{site.baseurl}}/blog/#{{category|slugize}}">{{category}}</a>
|
40
|
+
{% unless forloop.last %} {% endunless %}
|
41
|
+
{% endfor %}
|
42
|
+
</span>
|
43
|
+
{%- endif -%}
|
44
|
+
</div>
|
45
|
+
|
46
|
+
{%- if post.tags -%}
|
47
|
+
<ul class="post-tags">
|
48
|
+
{%- for tag in post.tags %}
|
49
|
+
<span class="post-categories">
|
50
|
+
{% assign categories = post.categories %}
|
51
|
+
{% for category in categories %}
|
52
|
+
<li class="post-tag"><a href="{{site.baseurl}}/blog/#{{tag|slugize}}">{{tag}}</a></li>
|
53
|
+
{% unless forloop.last %} {% endunless %}
|
54
|
+
{% endfor %}
|
55
|
+
</span>
|
56
|
+
{%- endfor -%}
|
57
|
+
{%- endif -%}
|
58
|
+
{%- if page.tags -%}
|
59
|
+
<ul class="post-tags">
|
60
|
+
{%- for tag in page.tags %}
|
61
|
+
<span class="post-categories">
|
62
|
+
{% assign categories = page.categories %}
|
63
|
+
{% for category in categories %}
|
64
|
+
<li class="post-tag"><a href="{{site.baseurl}}/blog/#{{tag|slugize}}">{{tag}}</a></li>
|
65
|
+
{% unless forloop.last %} {% endunless %}
|
66
|
+
{% endfor %}
|
67
|
+
</span>
|
68
|
+
{%- endfor -%}
|
69
|
+
{%- endif -%}
|
70
|
+
</ul>
|
71
|
+
|
72
|
+
{%- if post.excerpt -%}
|
73
|
+
<div class="post-excerpt">{{post.excerpt}}</div>
|
74
|
+
{%- endif -%}
|
75
|
+
|
76
|
+
</div>
|
@@ -0,0 +1,23 @@
|
|
1
|
+
{%if site.posts%}
|
2
|
+
{% assign postsByYear = site.posts | group_by_exp:"post", "post.date | date: '%Y'" %}
|
3
|
+
{% for year in postsByYear %}
|
4
|
+
{%- assign date_format = site.date_format | default:"%b %-d, %Y" -%}
|
5
|
+
|
6
|
+
|
7
|
+
<div id="post-list-container">
|
8
|
+
{% for post in year.items %}
|
9
|
+
<ul id="post-list">
|
10
|
+
|
11
|
+
<li class="post-item">
|
12
|
+
<a href="{{ post.url }}" class="post-link"> <h1 id="{{post.title | slugify }}"> {%- if post.image -%} <img class="post-image" src="{{ post.image }}"> {%- endif -%}{{post.title}}</h1> </a>
|
13
|
+
{% include blog/post_meta.html -%}
|
14
|
+
<div class="read-more">
|
15
|
+
<a href="{{ post.url }}" class="read-more-link"> Read more...</a>
|
16
|
+
</div>
|
17
|
+
|
18
|
+
</li>
|
19
|
+
{% endfor %}
|
20
|
+
</ul>
|
21
|
+
</div>
|
22
|
+
{% endfor %}
|
23
|
+
{%endif%}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
{% if site.tags %}
|
2
|
+
<div id="tags-container">
|
3
|
+
<h1 class="blog-header" id="blog-tags">Tags</h1>
|
4
|
+
{% for tag in site.tags %}
|
5
|
+
<div class="tag-group">
|
6
|
+
{% capture tag_name %}{{ tag | first }}{% endcapture %}
|
7
|
+
<h3 id="{{ tag_name | slugize }}" class="tag-head">{{ tag_name }}</h3>
|
8
|
+
<ul class="post-tags">
|
9
|
+
{% for post in site.tags[tag_name] %}
|
10
|
+
<li class="post-tag"><a href="{{ site.baseurl }}{{ post.url }}">{{post.title}}</a></li>
|
11
|
+
{% endfor %}
|
12
|
+
</ul>
|
13
|
+
</div>
|
14
|
+
{% endfor %}
|
15
|
+
</div>
|
16
|
+
{%endif%}
|
data/_includes/footer.html
CHANGED
@@ -1,17 +1,16 @@
|
|
1
|
-
|
2
|
-
|
3
1
|
<footer id="site-footer">
|
4
2
|
<div class="footer-column footer-contact">
|
5
3
|
{%- if site.contact %}
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
4
|
+
{%- assign con = site.contact -%}
|
5
|
+
{%- for entry in con -%}
|
6
|
+
{%- assign key = entry | first -%}
|
7
|
+
{% if con[key].id %}
|
8
|
+
<a target="blank" class="footer-image-link" href="{{ con[key].href }}{{ con[key].id }}"
|
9
|
+
title="{{ con[key].title }}"><img class="footer-icon" src="/{{ con[key].icon }}"></a>
|
10
|
+
{%- endif -%}
|
11
|
+
{% endfor %}
|
13
12
|
{%- endif %}
|
14
13
|
</div>
|
15
|
-
<div class="footer-column footer-copyright">Copyright © {{site.since}}-{{ 'now' | date: "%Y" }} <a
|
16
|
-
|
17
|
-
|
14
|
+
<div class="footer-column footer-copyright">Copyright © {{site.since}}-{{ 'now' | date: "%Y" }} <a
|
15
|
+
class="footer-link" href="{{site.email.href}}{{site.email.id}}" target="blank">{{site.author}}</a>.</div>
|
16
|
+
</footer>
|
data/_includes/head.html
CHANGED
@@ -1,12 +1,10 @@
|
|
1
|
-
|
2
|
-
|
3
1
|
<head>
|
4
2
|
{%- assign title = page.title -%}
|
5
3
|
{%- if site.title -%}
|
6
|
-
|
4
|
+
{% assign title = site.title | append: " | " | append: page.title %}
|
7
5
|
{%- endif -%}
|
8
6
|
{% if page.title == nil %}
|
9
|
-
|
7
|
+
{% assign title = site.title | append: " | " | append: "404" %}
|
10
8
|
{% endif %}
|
11
9
|
<title>{{ title }}</title>
|
12
10
|
<meta charset="utf-8">
|
@@ -15,6 +13,6 @@
|
|
15
13
|
<meta name="keywords" content="{{ site.keywords }}">
|
16
14
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
17
15
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
|
18
|
-
<link rel="icon" type="image/ico" href="assets/favicon.svg">
|
19
|
-
<link rel="stylesheet" href="assets/main.css">
|
16
|
+
<link rel="icon" type="image/ico" href="/assets/favicon.svg">
|
17
|
+
<link rel="stylesheet" href="/assets/main.css">
|
20
18
|
</head>
|
data/_includes/header.html
CHANGED
@@ -1,9 +1,7 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
<header id="site-header" role="banner">
|
1
|
+
<header id="site-header" role="banner">
|
4
2
|
<div id="site-logo-container">
|
5
3
|
{%- if site.logo %}
|
6
|
-
<a href="index.html" id="site-logo">{{ site.logo }}</a>
|
4
|
+
<a href="/index.html" id="site-logo">{{ site.logo }}</a>
|
7
5
|
{%- endif %}
|
8
6
|
</div>
|
9
7
|
|
@@ -16,9 +14,17 @@
|
|
16
14
|
<div id="site-nav-section">
|
17
15
|
<h1 class="print print-header">Contents</h1>
|
18
16
|
<div id="toc-sections">
|
19
|
-
{% include toc/sections.html html=content anchor_class="nav-link" h_min=1 h_max=1 sanitize=true %}
|
17
|
+
{% include toc/sections.html html=content anchor_class="nav-link" h_min=1 h_max=1 sanitize=true skip_no_ids=true %}
|
18
|
+
|
19
|
+
{%- if page.layout == "post" -%}
|
20
|
+
<ul>
|
21
|
+
<li><a style="font-weight: bold;" href="{{page.url}}#top" class="nav-link nav-link-top">{{ page.title }}</a></li>
|
22
|
+
</ul>
|
23
|
+
|
24
|
+
{% include toc/sections.html html=content anchor_class="nav-link" h_min=2 h_max=2 sanitize=true skip_no_ids=true %}
|
25
|
+
|
26
|
+
{%- endif %}
|
20
27
|
</div>
|
21
28
|
</div>
|
22
29
|
</nav>
|
23
|
-
</header>
|
24
|
-
|
30
|
+
</header>
|
@@ -1 +1 @@
|
|
1
|
-
<input id="print-button" class="screen" type="button" value="Print {{ page.title }}" onClick="window.print()">
|
1
|
+
<input id="print-button" class="screen" type="button" value="Print: {{ page.title }}" onClick="window.print()">
|
data/_includes/toc/pages.html
CHANGED
@@ -1,14 +1,13 @@
|
|
1
1
|
{%- assign default_paths = site.pages | where: "layout", "default" | sort: "order" | map: "path" -%}
|
2
2
|
{%- assign page_paths = site.header_pages | default: default_paths -%}
|
3
3
|
|
4
|
-
|
5
4
|
<ul class="{{ page.title | slugify }}">
|
6
5
|
{%- for path in page_paths %}
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
6
|
+
{%- assign toc_page = site.pages | where: "path", path | first -%}
|
7
|
+
{%- assign link_title = toc_page.title -%}
|
8
|
+
{%- if toc_page.navtitle -%}
|
9
|
+
{% assign link_title = toc_page.navtitle %}
|
10
|
+
{% endif %}
|
12
11
|
<li><a href="{{ toc_page.url | relative_url }}" class="nav-link {{ toc_page.title | slugify }}">{{ link_title | escape }}</a></li>
|
13
12
|
{%- endfor %}
|
14
13
|
</ul>
|
@@ -19,3 +18,17 @@
|
|
19
18
|
}
|
20
19
|
</style>
|
21
20
|
|
21
|
+
{%- if page.layout == "post" -%}
|
22
|
+
<style>
|
23
|
+
a.blog {
|
24
|
+
text-decoration: underline;
|
25
|
+
}
|
26
|
+
|
27
|
+
div#toc-sections a {
|
28
|
+
text-decoration: none;
|
29
|
+
}
|
30
|
+
div#toc-sections a:hover {
|
31
|
+
text-decoration: underline;
|
32
|
+
}
|
33
|
+
</style>
|
34
|
+
{% endif %}
|
data/_layouts/default.html
CHANGED
@@ -7,15 +7,13 @@
|
|
7
7
|
{%- include print/cover_front.html -%}
|
8
8
|
{%- include header.html -%}
|
9
9
|
|
10
|
-
<main id="page-content" class="content {{ page.outputclass }}">
|
10
|
+
<main id="page-content" class="content {{ page.outputclass }}">
|
11
|
+
{% include content/multipage.html -%}
|
12
|
+
</main>
|
11
13
|
|
12
|
-
{
|
13
|
-
|
14
|
-
</main>
|
15
|
-
|
16
|
-
{%- include footer.html -%}
|
17
|
-
{%- include print/cover_back.html -%}
|
14
|
+
{%- include footer.html -%}
|
15
|
+
{%- include print/cover_back.html -%}
|
18
16
|
|
19
17
|
</body>
|
20
18
|
|
21
|
-
</html>
|
19
|
+
</html>
|
data/_layouts/post.html
ADDED
@@ -0,0 +1,27 @@
|
|
1
|
+
<!DOCTYPE html>
|
2
|
+
<html lang="en">
|
3
|
+
{%- include head.html %}
|
4
|
+
|
5
|
+
<body>
|
6
|
+
{%- include print/cover_front.html -%}
|
7
|
+
{%- include header.html -%}
|
8
|
+
|
9
|
+
<main id="page-content" class="content {{ page.outputclass }}">
|
10
|
+
|
11
|
+
<article class="post">
|
12
|
+
<h1 class="post-title"> {%- if page.image -%} <img class="post-image" src="{{ page.image }}"> {% endif %}
|
13
|
+
{{ page.title | escape }} </h1>
|
14
|
+
|
15
|
+
|
16
|
+
|
17
|
+
{% include blog/post_meta.html -%}
|
18
|
+
|
19
|
+
{{ content }}
|
20
|
+
{% include blog/go_back_to_blog.html %}
|
21
|
+
</article>
|
22
|
+
</main>
|
23
|
+
{%- include footer.html -%}
|
24
|
+
{%- include print/cover_back.html -%}
|
25
|
+
</body>
|
26
|
+
|
27
|
+
</html>
|
data/_sass/r.scss
CHANGED
@@ -16,7 +16,6 @@ html {
|
|
16
16
|
@import "r/layout/print";
|
17
17
|
}
|
18
18
|
@import "r/layout/columns";
|
19
|
-
|
20
19
|
// Styling
|
21
20
|
@import "r/styling/animations",
|
22
21
|
"r/styling/shadow",
|
@@ -36,5 +35,6 @@ main#page-content {
|
|
36
35
|
"r/content/note",
|
37
36
|
"r/content/abbr",
|
38
37
|
"r/content/link",
|
39
|
-
"r/content/title"
|
38
|
+
"r/content/title",
|
39
|
+
"r/content/blog";
|
40
40
|
}
|
@@ -0,0 +1,102 @@
|
|
1
|
+
div#post-list-container {
|
2
|
+
|
3
|
+
ul#post-list {
|
4
|
+
list-style: none;
|
5
|
+
padding: 0;
|
6
|
+
margin: 0;
|
7
|
+
|
8
|
+
li.post-item {
|
9
|
+
margin: 0;
|
10
|
+
padding: 0;
|
11
|
+
|
12
|
+
a.post-link,
|
13
|
+
a.post-link:hover,
|
14
|
+
a.post-link:active {
|
15
|
+
text-decoration-color: $primary-color;
|
16
|
+
}
|
17
|
+
|
18
|
+
|
19
|
+
div.post-excerpt {
|
20
|
+
p {
|
21
|
+
margin-top: $margin;
|
22
|
+
}
|
23
|
+
}
|
24
|
+
}
|
25
|
+
|
26
|
+
|
27
|
+
}
|
28
|
+
}
|
29
|
+
|
30
|
+
div.read-more,
|
31
|
+
div.go-back {
|
32
|
+
text-align: right;
|
33
|
+
|
34
|
+
a.read-more-link,
|
35
|
+
a.go-back-link {
|
36
|
+
font-size: 1.8rem;
|
37
|
+
}
|
38
|
+
}
|
39
|
+
div.post-info {
|
40
|
+
margin-top: $margin;
|
41
|
+
|
42
|
+
* {
|
43
|
+
font-weight: bold;
|
44
|
+
}
|
45
|
+
|
46
|
+
span.post-categories {
|
47
|
+
text-decoration: none;
|
48
|
+
font-weight: bold;
|
49
|
+
color: $text-dark;
|
50
|
+
|
51
|
+
* {
|
52
|
+
text-decoration: inherit;
|
53
|
+
font-weight: inherit;
|
54
|
+
color: inherit;
|
55
|
+
}
|
56
|
+
}
|
57
|
+
|
58
|
+
span.post-categories:hover,
|
59
|
+
span.post-categories:active {
|
60
|
+
color: $secondary-color;
|
61
|
+
text-decoration: underline;
|
62
|
+
}
|
63
|
+
}
|
64
|
+
|
65
|
+
ul.post-tags {
|
66
|
+
display: flex;
|
67
|
+
flex-wrap: wrap;
|
68
|
+
padding: 0;
|
69
|
+
margin-top: 0.25rem;
|
70
|
+
|
71
|
+
li.post-tag {
|
72
|
+
font-size: 1.3rem;
|
73
|
+
list-style: none;
|
74
|
+
padding: 0.25em 0.75em;
|
75
|
+
margin: 0.8rem 0.8rem 0.8rem 0;
|
76
|
+
background-color: $background-middle;
|
77
|
+
color: $text-dark;
|
78
|
+
border-radius: $border-radius;
|
79
|
+
width: auto;
|
80
|
+
text-align: center;
|
81
|
+
vertical-align: middle;
|
82
|
+
display: inline;
|
83
|
+
text-decoration: none;
|
84
|
+
font-weight: bold;
|
85
|
+
|
86
|
+
* {
|
87
|
+
border: none;
|
88
|
+
text-decoration: inherit;
|
89
|
+
font-size: inherit;
|
90
|
+
font-weight: inherit;
|
91
|
+
color: inherit;
|
92
|
+
}
|
93
|
+
}
|
94
|
+
li.post-tag:hover,
|
95
|
+
li.post-tag:active {
|
96
|
+
color: $secondary-color;
|
97
|
+
}
|
98
|
+
}
|
99
|
+
|
100
|
+
img.post-image {
|
101
|
+
margin-top: 0;
|
102
|
+
}
|
data/_sass/r/content/code.scss
CHANGED
data/_sass/r/content/image.scss
CHANGED
data/_sass/r/content/note.scss
CHANGED
@@ -4,11 +4,11 @@
|
|
4
4
|
.note_caution,
|
5
5
|
.note_tip {
|
6
6
|
padding: 0.5rem 1rem;
|
7
|
-
background-color: $background-middle;
|
8
7
|
display: block;
|
9
8
|
border-left: $border;
|
10
9
|
font-size: 1.4rem;
|
11
|
-
|
10
|
+
width: fit-content;
|
11
|
+
max-width: 100%;
|
12
12
|
}
|
13
13
|
|
14
14
|
/* Style note captions */
|
data/_sass/r/content/quote.scss
CHANGED
@@ -17,10 +17,10 @@ q::after {
|
|
17
17
|
blockquote {
|
18
18
|
width: fit-content;
|
19
19
|
margin: $margin 0;
|
20
|
-
padding: 0 0.5rem 0
|
21
|
-
background-color: $background-middle;
|
20
|
+
padding: 0 0.5rem 0 1.2rem;
|
22
21
|
font-size: 1.3rem;
|
23
|
-
border-
|
22
|
+
border-left: $border;
|
23
|
+
border-color: $background-middle;
|
24
24
|
}
|
25
25
|
blockquote * {
|
26
26
|
font-size: 1.3rem;
|
data/_sass/r/content/title.scss
CHANGED
@@ -27,27 +27,27 @@ h6 * {
|
|
27
27
|
/* Individual titles */
|
28
28
|
h1 {
|
29
29
|
margin: 0;
|
30
|
-
font-size:
|
30
|
+
font-size: 4rem;
|
31
31
|
font-weight: bold;
|
32
32
|
margin-left: -0.035em;
|
33
33
|
}
|
34
34
|
h2 {
|
35
|
-
font-size: 2.
|
35
|
+
font-size: 2.8rem;
|
36
36
|
font-weight: bold;
|
37
37
|
color: $primary-color;
|
38
38
|
|
39
39
|
}
|
40
40
|
h3 {
|
41
41
|
margin: 1em 0 0 0;
|
42
|
-
font-size: 2.
|
43
|
-
|
42
|
+
font-size: 2.2rem;
|
43
|
+
font-weight: normal;
|
44
44
|
}
|
45
45
|
h4,
|
46
46
|
h5,
|
47
47
|
h6 {
|
48
48
|
margin: 1em 0 0 0;
|
49
49
|
font-size: 1.8rem;
|
50
|
-
|
50
|
+
font-weight: normal;
|
51
51
|
}
|
52
52
|
|
53
53
|
/* Support images in titles */
|
@@ -61,4 +61,14 @@ h6 > img {
|
|
61
61
|
margin: inherit;
|
62
62
|
height: 1.2em;
|
63
63
|
margin-bottom: -0.25em;
|
64
|
+
}
|
65
|
+
|
66
|
+
img.post-image {
|
67
|
+
overflow: auto;
|
68
|
+
padding: 0;
|
69
|
+
margin: $margin 0;
|
70
|
+
max-width: 100%;
|
71
|
+
display: block;
|
72
|
+
border-radius: $border-radius;
|
73
|
+
height: unset;
|
64
74
|
}
|
data/_sass/r/layout/desktop.scss
CHANGED
@@ -27,7 +27,7 @@ body {
|
|
27
27
|
main#page-content {
|
28
28
|
display: block;
|
29
29
|
min-width: 60rem;
|
30
|
-
margin: 0 0 0
|
30
|
+
margin: 0 0 0 40rem;
|
31
31
|
}
|
32
32
|
|
33
33
|
article {
|
@@ -35,8 +35,18 @@ article {
|
|
35
35
|
padding: 5rem 10rem;
|
36
36
|
}
|
37
37
|
|
38
|
-
|
39
|
-
|
38
|
+
div#post-list-container {
|
39
|
+
margin-top: 2.5rem;
|
40
|
+
}
|
41
|
+
|
42
|
+
div#post-list-container article{
|
43
|
+
padding: 2.5rem 10rem;
|
44
|
+
}
|
45
|
+
|
46
|
+
article + article,
|
47
|
+
div#tags-container,
|
48
|
+
div#categories-container {
|
49
|
+
border-top: 0.5rem dotted $background-middle;
|
40
50
|
}
|
41
51
|
|
42
52
|
/*** Body - END */
|
@@ -49,15 +59,9 @@ header#site-header {
|
|
49
59
|
top: 0;
|
50
60
|
left: 0;
|
51
61
|
bottom: 0;
|
52
|
-
padding: 5rem
|
62
|
+
padding: 5rem;
|
53
63
|
text-align: left;
|
54
64
|
background-color: $primary-color;
|
55
|
-
overflow-y: auto;
|
56
|
-
-ms-overflow-style: none;
|
57
|
-
scrollbar-width: none;
|
58
|
-
}
|
59
|
-
header#site-header::-webkit-scrollbar {
|
60
|
-
display: none;
|
61
65
|
}
|
62
66
|
|
63
67
|
/* Logo */
|
@@ -67,7 +71,9 @@ div#site-logo-container {
|
|
67
71
|
overflow: hidden;
|
68
72
|
flex-grow: 0;
|
69
73
|
flex-shrink: 0;
|
70
|
-
margin: 0
|
74
|
+
margin: 0;
|
75
|
+
position: fixed;
|
76
|
+
width: 30rem
|
71
77
|
}
|
72
78
|
a#site-logo {
|
73
79
|
font-size: 15rem;
|
@@ -84,15 +90,28 @@ nav#site-nav {
|
|
84
90
|
display: flex;
|
85
91
|
align-items: flex-start;
|
86
92
|
justify-content: flex-start;
|
87
|
-
margin:
|
88
|
-
|
93
|
+
margin: 2.5rem 0;
|
94
|
+
width: 30rem;
|
95
|
+
position: fixed;
|
96
|
+
top: 15rem;
|
97
|
+
bottom: 8rem;
|
98
|
+
overflow-y: auto;
|
99
|
+
-ms-overflow-style: none;
|
100
|
+
scrollbar-width: none;
|
89
101
|
}
|
90
102
|
|
103
|
+
// nav#site-nav::-webkit-scrollbar {
|
104
|
+
// display: none;
|
105
|
+
// }
|
106
|
+
|
91
107
|
div#site-nav-page {
|
92
|
-
padding: 0 1.5rem 0
|
108
|
+
padding: 0 1.5rem 0 0rem;
|
109
|
+
border-right: 0.25rem solid $text-light;
|
110
|
+
|
93
111
|
}
|
94
112
|
div#site-nav-section {
|
95
|
-
padding: 0
|
113
|
+
padding: 0 0rem 0 1.5rem;
|
114
|
+
margin-left: -0.20rem;
|
96
115
|
border-left: 0.25rem solid $text-light;
|
97
116
|
}
|
98
117
|
|
@@ -107,7 +126,7 @@ div#toc-pages ul {
|
|
107
126
|
div#toc-sections ul {
|
108
127
|
margin: 0;
|
109
128
|
padding: 0;
|
110
|
-
display: flexbox;
|
129
|
+
display: flexbox;
|
111
130
|
justify-content: flex-start;
|
112
131
|
flex-wrap: wrap;
|
113
132
|
}
|
@@ -115,8 +134,15 @@ div#toc-pages li {
|
|
115
134
|
list-style: none;
|
116
135
|
padding-bottom: 0.8em;
|
117
136
|
}
|
137
|
+
|
138
|
+
div#toc-pages li:last-of-type {
|
139
|
+
padding-bottom: 0;
|
140
|
+
}
|
141
|
+
|
118
142
|
div#toc-sections li {
|
119
143
|
list-style: none;
|
144
|
+
padding-bottom: 0.4em;
|
145
|
+
line-height: 1em;
|
120
146
|
}
|
121
147
|
|
122
148
|
/* Navigation links */
|
@@ -125,7 +151,7 @@ div#toc-sections li {
|
|
125
151
|
font-size: 2.2rem;
|
126
152
|
}
|
127
153
|
#toc-sections a.nav-link {
|
128
|
-
font-size: 1.
|
154
|
+
font-size: 1.4rem;
|
129
155
|
}
|
130
156
|
a.nav-link {
|
131
157
|
color: $text-light;
|
@@ -146,7 +172,7 @@ footer#site-footer {
|
|
146
172
|
left: 0;
|
147
173
|
bottom: 0;
|
148
174
|
display: flexbox;
|
149
|
-
width:
|
175
|
+
width: 35rem;
|
150
176
|
background-color: $primary-color;
|
151
177
|
padding: 2.5rem;
|
152
178
|
}
|
@@ -184,4 +210,7 @@ img.footer-icon:first-of-type {
|
|
184
210
|
color: $text-dark;
|
185
211
|
padding: 5rem;
|
186
212
|
}
|
187
|
-
|
213
|
+
div#post-list-container article{
|
214
|
+
padding: 2.5rem 5rem;
|
215
|
+
}
|
216
|
+
}
|
data/_sass/r/layout/mobile.scss
CHANGED
@@ -36,7 +36,17 @@ article {
|
|
36
36
|
padding: 5rem 5rem;
|
37
37
|
}
|
38
38
|
|
39
|
-
|
39
|
+
div#post-list-container article{
|
40
|
+
padding: 2.5rem 5rem;
|
41
|
+
}
|
42
|
+
|
43
|
+
div#post-list-container {
|
44
|
+
margin-top: 2.5rem;
|
45
|
+
}
|
46
|
+
|
47
|
+
article + article,
|
48
|
+
div#categories-container,
|
49
|
+
div#tags-container {
|
40
50
|
border-top: 0.5rem dotted $background-middle;
|
41
51
|
}
|
42
52
|
/*** Body - END */
|
@@ -47,7 +57,7 @@ header#site-header {
|
|
47
57
|
top: 0;
|
48
58
|
left: 0;
|
49
59
|
right: 0;
|
50
|
-
padding: 2.5rem 4.2rem
|
60
|
+
padding: 2.5rem 4.2rem;
|
51
61
|
display: flex;
|
52
62
|
flex-direction: row;
|
53
63
|
flex-wrap: nowrap;
|
@@ -65,7 +75,6 @@ div#site-logo-container {
|
|
65
75
|
margin: 0 5rem 0 0;
|
66
76
|
flex-grow: 0;
|
67
77
|
flex-shrink: 0;
|
68
|
-
min-height: 10rem;
|
69
78
|
}
|
70
79
|
a#site-logo {
|
71
80
|
font-size: 10rem;
|
@@ -73,6 +82,7 @@ a#site-logo {
|
|
73
82
|
color: $text-light;
|
74
83
|
text-decoration: none;
|
75
84
|
line-height: 0.9em;
|
85
|
+
height: 0.7em;
|
76
86
|
overflow: hidden;
|
77
87
|
font-family: $logo-font;
|
78
88
|
margin-left: -0.035em;
|
@@ -119,9 +129,10 @@ div#toc-sections li {
|
|
119
129
|
#toc-pages a.nav-link {
|
120
130
|
font-weight: bold;
|
121
131
|
font-size: 2.2rem;
|
132
|
+
|
122
133
|
}
|
123
134
|
#toc-sections a.nav-link {
|
124
|
-
font-size: 1.
|
135
|
+
font-size: 1.4rem;
|
125
136
|
}
|
126
137
|
a.nav-link {
|
127
138
|
color: $text-light;
|
@@ -203,6 +214,7 @@ img.footer-icon {
|
|
203
214
|
a#site-logo {
|
204
215
|
font-size: 6.2rem;
|
205
216
|
line-height: 0.9em;
|
217
|
+
margin-bottom: $margin-small;
|
206
218
|
overflow: hidden;
|
207
219
|
}
|
208
220
|
nav#site-nav {
|
@@ -221,7 +233,7 @@ img.footer-icon {
|
|
221
233
|
font-size: 2.2rem;
|
222
234
|
}
|
223
235
|
#toc-sections a.nav-link {
|
224
|
-
font-size: 1.
|
236
|
+
font-size: 1.4rem;
|
225
237
|
}
|
226
238
|
}
|
227
239
|
|
@@ -33,11 +33,11 @@ main,
|
|
33
33
|
}
|
34
34
|
/*** Page-level animations - END*/
|
35
35
|
|
36
|
-
a:hover,
|
37
|
-
a:active,
|
38
|
-
a:focus,
|
39
|
-
abbr[title]:hover,
|
40
|
-
abbr[title]:focus,
|
41
|
-
abbr[title]:active {
|
42
|
-
|
43
|
-
}
|
36
|
+
// a:hover,
|
37
|
+
// a:active,
|
38
|
+
// a:focus,
|
39
|
+
// abbr[title]:hover,
|
40
|
+
// abbr[title]:focus,
|
41
|
+
// abbr[title]:active {
|
42
|
+
// transition-duration: 0.5s;
|
43
|
+
// }
|
Binary file
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: r-jekyll-theme
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.1.
|
4
|
+
version: 0.1.3
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- rafalkaron
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date:
|
11
|
+
date: 2021-01-31 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: jekyll
|
@@ -48,6 +48,11 @@ files:
|
|
48
48
|
- LICENSE
|
49
49
|
- README.md
|
50
50
|
- _config.yml
|
51
|
+
- _includes/blog/categories.html
|
52
|
+
- _includes/blog/go_back_to_blog.html
|
53
|
+
- _includes/blog/post_meta.html
|
54
|
+
- _includes/blog/posts_list.html
|
55
|
+
- _includes/blog/tags.html
|
51
56
|
- _includes/content/multipage.html
|
52
57
|
- _includes/content/singlepage.html
|
53
58
|
- _includes/footer.html
|
@@ -60,10 +65,12 @@ files:
|
|
60
65
|
- _includes/toc/pages.html
|
61
66
|
- _includes/toc/sections.html
|
62
67
|
- _layouts/default.html
|
68
|
+
- _layouts/post.html
|
63
69
|
- _layouts/singlepage_dev.html
|
64
70
|
- _sass/_variables.scss
|
65
71
|
- _sass/r.scss
|
66
72
|
- _sass/r/content/abbr.scss
|
73
|
+
- _sass/r/content/blog.scss
|
67
74
|
- _sass/r/content/code.scss
|
68
75
|
- _sass/r/content/image.scss
|
69
76
|
- _sass/r/content/link.scss
|
@@ -83,6 +90,7 @@ files:
|
|
83
90
|
- _sass/r/styling/selection.scss
|
84
91
|
- _sass/r/styling/shadow.scss
|
85
92
|
- assets/bicycle.jpg
|
93
|
+
- assets/blog/neonbrand-Ak5c5VTch5E-unsplash.jpg
|
86
94
|
- assets/favicon.svg
|
87
95
|
- assets/icons/500px.svg
|
88
96
|
- assets/icons/500px_dark.svg
|