jekyll-theme-profile 1.10.0 → 1.10.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +2 -337
- data/_config.yml +31 -50
- data/_includes/collection-menu.html +57 -33
- data/_includes/custom-colors.html +99 -0
- data/_includes/head.html +2 -14
- data/_includes/header-appbar.html +6 -15
- data/_includes/header-sidebar.html +4 -13
- data/_includes/header-stacked.html +2 -15
- data/_includes/header-topbar.html +3 -0
- data/_includes/link-card.html +10 -23
- data/_includes/links.html +4 -4
- data/_includes/masthead.html +1 -1
- data/_includes/nav-overlay.html +44 -29
- data/_includes/paginator_nav.html +28 -0
- data/_includes/post-timeline-card.html +28 -9
- data/_includes/post-timeline.html +24 -12
- data/_includes/posts.html +1 -1
- data/_includes/repositories.html +1 -1
- data/_includes/thumbnail.html +19 -0
- data/_layouts/category_index.html +0 -2
- data/_layouts/category_layout.html +23 -46
- data/_layouts/default.html +1 -4
- data/_layouts/docs.html +10 -16
- data/_layouts/home.html +0 -1
- data/_layouts/landing.html +3 -5
- data/_layouts/linktree.html +5 -3
- data/_layouts/page.html +14 -1
- data/_layouts/paginate.html +1 -27
- data/_layouts/paginate_timeline.html +7 -31
- data/_layouts/post.html +11 -12
- data/_layouts/profile.html +25 -13
- data/_layouts/repositories.html +0 -1
- data/_layouts/tag_index.html +0 -2
- data/_layouts/tags.html +1 -4
- data/_sass/_main.scss +11 -50
- data/assets/css/theme.scss +0 -77
- data/assets/img/social-preview.png +0 -0
- metadata +25 -21
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
{%- assign bg_image = page.background.image | default: site.background.image %}
|
|
2
|
+
{%- assign dark_overlay = page.background.dark.overlay | default: page.background.overlay | default: site.background.dark.overlay | default: site.background.overlay %}
|
|
3
|
+
{%- assign light_overlay = page.background.light.overlay | default: page.background.overlay | default: site.background.light.overlay | default: site.background.overlay %}
|
|
4
|
+
{%- assign header_color = page.header.color | default: site.header.color %}
|
|
5
|
+
{%- assign header_text = page.header.text | default: site.header.text %}
|
|
6
|
+
{%- assign header_accent = page.header.accent | default: site.header.accent %}
|
|
7
|
+
{%- assign header_image = page.header.image | default: site.header.image %}
|
|
8
|
+
{%- assign header_overlay = page.header.overlay | default: site.header.overlay %}
|
|
9
|
+
<style>
|
|
10
|
+
{%- if bg_image %}
|
|
11
|
+
body {
|
|
12
|
+
position: relative;
|
|
13
|
+
background-image: url('{{ bg_image | relative_url }}');
|
|
14
|
+
background-size: cover;
|
|
15
|
+
background-repeat: no-repeat;
|
|
16
|
+
background-attachment: fixed;
|
|
17
|
+
z-index: -10;
|
|
18
|
+
}
|
|
19
|
+
{%- endif %}
|
|
20
|
+
{%- if dark_overlay %}
|
|
21
|
+
/* Dark mode styles */
|
|
22
|
+
[data-color-mode='dark'] {
|
|
23
|
+
--overlay-color: {{ dark_overlay }};
|
|
24
|
+
}
|
|
25
|
+
@media(prefers-color-scheme: dark) {
|
|
26
|
+
[data-color-mode='auto'][data-dark-theme='dark_dimmed'] {
|
|
27
|
+
--overlay-color: {{ dark_overlay }};
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
{%- endif %}
|
|
31
|
+
{%- if light_overlay %}
|
|
32
|
+
/* Light mode styles */
|
|
33
|
+
[data-color-mode='light'] {
|
|
34
|
+
--overlay-color: {{ light_overlay }};
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
@media(prefers-color-scheme: light) {
|
|
38
|
+
[data-color-mode='auto'][data-light-theme='light'] {
|
|
39
|
+
--overlay-color: {{ light_overlay }};
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
{%- endif %}
|
|
43
|
+
{%- if header_color %}
|
|
44
|
+
.Header {
|
|
45
|
+
--color-header-bg: {{ header_color }};
|
|
46
|
+
}
|
|
47
|
+
/* Light mode styles */
|
|
48
|
+
[data-color-mode='light'] {
|
|
49
|
+
--color-header-bg: {{ header_color }};
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
@media(prefers-color-scheme: light) {
|
|
53
|
+
[data-color-mode='auto'][data-light-theme='light'] {
|
|
54
|
+
--color-header-bg: {{ header_color }};
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
/* Dark mode styles */
|
|
58
|
+
[data-color-mode='dark'] {
|
|
59
|
+
--color-header-bg: {{ header_color }};
|
|
60
|
+
}
|
|
61
|
+
@media(prefers-color-scheme: dark) {
|
|
62
|
+
[data-color-mode='auto'][data-dark-theme='dark_dimmed'] {
|
|
63
|
+
--color-header-bg: {{ header_color }};
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
{%- endif %}
|
|
67
|
+
{%- if header_text %}
|
|
68
|
+
.Header {
|
|
69
|
+
--color-header-logo: {{ header_text }};
|
|
70
|
+
--color-fg-muted: {{ header_text }};
|
|
71
|
+
}
|
|
72
|
+
{%- endif %}
|
|
73
|
+
{%- if header_accent %}
|
|
74
|
+
.Header {
|
|
75
|
+
--color-header-text: {{ header_accent }};
|
|
76
|
+
--color-accent-fg: {{ header_accent }};
|
|
77
|
+
}
|
|
78
|
+
{%- endif %}
|
|
79
|
+
{%- if header_image %}
|
|
80
|
+
.Header {
|
|
81
|
+
position: relative;
|
|
82
|
+
background-image: url('{{ header_image | relative_url }}');
|
|
83
|
+
background-size: cover;
|
|
84
|
+
background-repeat: no-repeat;
|
|
85
|
+
}
|
|
86
|
+
{%- endif %}
|
|
87
|
+
{%- if header_overlay %}
|
|
88
|
+
.Header::before {
|
|
89
|
+
content: "";
|
|
90
|
+
position: absolute;
|
|
91
|
+
top: 0;
|
|
92
|
+
right: 0;
|
|
93
|
+
bottom: 0;
|
|
94
|
+
left: 0;
|
|
95
|
+
z-index: -1;
|
|
96
|
+
background-color: {{ header_overlay }};
|
|
97
|
+
}
|
|
98
|
+
{%- endif %}
|
|
99
|
+
</style>
|
data/_includes/head.html
CHANGED
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
{%- assign bg_image = page.background_image | default: site.background.image | default: null %}
|
|
2
|
-
|
|
3
1
|
<head>
|
|
4
2
|
<meta charset="utf-8">
|
|
5
3
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
@@ -29,18 +27,8 @@
|
|
|
29
27
|
<script src="{{ '/assets/js/anchor-links.js' | relative_url }}"></script>
|
|
30
28
|
<script src="{{ '/assets/js/timeline.js' | relative_url }}"></script>
|
|
31
29
|
|
|
32
|
-
{%-
|
|
33
|
-
|
|
34
|
-
body {
|
|
35
|
-
position: relative;
|
|
36
|
-
background-image: url('{{ bg_image | relative_url }}');
|
|
37
|
-
background-size: cover;
|
|
38
|
-
background-repeat: no-repeat;
|
|
39
|
-
background-attachment: fixed;
|
|
40
|
-
z-index: -10;
|
|
41
|
-
}
|
|
42
|
-
</style>
|
|
43
|
-
{%- endif %}
|
|
30
|
+
{%- include custom-colors.html %}
|
|
31
|
+
|
|
44
32
|
{%- if page.css_style %}
|
|
45
33
|
<style>
|
|
46
34
|
{{ page.css_style }}
|
|
@@ -1,18 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
});
|
|
6
|
-
$('#collapse-btn').click(function() {
|
|
7
|
-
$('.Extend').addClass('d-none');
|
|
8
|
-
})
|
|
9
|
-
});
|
|
10
|
-
</script>
|
|
1
|
+
{%- assign user = site.github.owner %}
|
|
2
|
+
{%- assign name = site.title | default: user.name | default: user.login %}
|
|
3
|
+
{%- assign user_img = site.user_image | default: user.avatar_url | default: "/assets/img/user-image.jpg" %}
|
|
4
|
+
|
|
11
5
|
<header class="AppHeader position-sticky top-0 z-2 border-bottom topbar">
|
|
12
6
|
<div class="AppHeader-item d-flex flex-justify-between p-2 flex-items-center">
|
|
13
7
|
{%- if site.nav %}
|
|
14
|
-
<div class="d-flex">
|
|
15
|
-
|
|
8
|
+
<div class="d-flex d-sm-none">
|
|
9
|
+
{% include nav-overlay.html %}
|
|
16
10
|
</div>
|
|
17
11
|
{%- endif %}
|
|
18
12
|
<div tabindex="-1" class="d-flex flex-1 ml-3" id="github-logo">
|
|
@@ -43,9 +37,6 @@
|
|
|
43
37
|
<div class="AppHeader-item width-full hide-sm">
|
|
44
38
|
{%- include navbar-underline.html %}
|
|
45
39
|
</div>
|
|
46
|
-
<div class="Extend Overlay-header d-none">
|
|
47
|
-
{%- include nav-overlay.html %}
|
|
48
|
-
</div>
|
|
49
40
|
</div>
|
|
50
41
|
{%- endif %}
|
|
51
42
|
</header>
|
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
<script>
|
|
2
2
|
$(document).ready(function () {
|
|
3
|
-
$('#expansion-btn').click(function () {
|
|
4
|
-
$('.Extend').toggleClass('d-none');
|
|
5
|
-
});
|
|
6
|
-
$('#collapse-btn').click(function () {
|
|
7
|
-
$('.Extend').addClass('d-none');
|
|
8
|
-
})
|
|
9
3
|
$('#toolbar-btn').click(function () {
|
|
10
4
|
$('.Sidebar').toggleClass('d-lg-block');
|
|
11
5
|
$('.Toolbar-expand').toggleClass('d-lg-block');
|
|
@@ -21,14 +15,14 @@
|
|
|
21
15
|
})
|
|
22
16
|
});
|
|
23
17
|
</script>
|
|
24
|
-
<div class="Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky top-0">
|
|
25
|
-
<div class="flex-column flex-1 position-sticky top-0"
|
|
18
|
+
<div class="Header d-flex border-right flex-items-start p-0 flex-justify-end position-sticky background-fixed top-0">
|
|
19
|
+
<div class="flex-column flex-1 position-sticky top-0">
|
|
26
20
|
<div class="Toolbar topbar d-flex flex-row py-3 flex-lg-justify-end flex-justify-start">
|
|
27
21
|
<div class="Toolbar-expand d-flex flex-justify-center d-none">
|
|
28
22
|
<button id="sidebar-btn" class="btn-octicon mr-2">{% octicon chevron-right height:16 %}</button>
|
|
29
23
|
</div>
|
|
30
|
-
<div class="d-flex flex-justify-center">
|
|
31
|
-
|
|
24
|
+
<div class="d-flex flex-justify-center d-lg-none">
|
|
25
|
+
{%- include nav-overlay.html %}
|
|
32
26
|
</div>
|
|
33
27
|
<div class="d-flex flex-justify-center">
|
|
34
28
|
{% include toggle.html %}
|
|
@@ -59,8 +53,5 @@
|
|
|
59
53
|
{%- endif %}
|
|
60
54
|
</div>
|
|
61
55
|
</div>
|
|
62
|
-
<div class="Extend d-none">
|
|
63
|
-
{%- include nav-overlay.html %}
|
|
64
|
-
</div>
|
|
65
56
|
</div>
|
|
66
57
|
</div>
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
$(document).ready(function () {
|
|
3
|
-
$('#expansion-btn').click(function () {
|
|
4
|
-
$('.Extend').toggleClass('d-none');
|
|
5
|
-
});
|
|
6
|
-
$('#collapse-btn').click(function () {
|
|
7
|
-
$('.Extend').addClass('d-none');
|
|
8
|
-
})
|
|
9
|
-
});
|
|
10
|
-
</script>
|
|
11
1
|
<div class="Profile text-center mt-3">
|
|
12
2
|
{%- include masthead.html %}
|
|
13
3
|
{%- if site.repo_info %}
|
|
@@ -27,15 +17,12 @@
|
|
|
27
17
|
{% include nav.html %}
|
|
28
18
|
</div>
|
|
29
19
|
<div class="d-flex flex-1 flex-sm-grow-0 flex-justify-start">
|
|
30
|
-
<div class="d-flex">
|
|
31
|
-
|
|
20
|
+
<div class="d-flex d-sm-none">
|
|
21
|
+
{% include nav-overlay.html%}
|
|
32
22
|
</div>
|
|
33
23
|
<div class="d-flex">
|
|
34
24
|
{% include toggle.html %}
|
|
35
25
|
</div>
|
|
36
26
|
</div>
|
|
37
27
|
</div>
|
|
38
|
-
<div class="Extend d-none">
|
|
39
|
-
{% include nav-overlay.html %}
|
|
40
|
-
</div>
|
|
41
28
|
{%- endif %}
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
{%- assign user = site.github.owner %}
|
|
2
|
+
{%- assign name = site.title | default: user.name | default: user.login %}
|
|
3
|
+
{%- assign user_img = site.user_image | default: user.avatar_url | default: "/assets/img/user-image.jpg" %}
|
|
1
4
|
<script>
|
|
2
5
|
$(document).ready(function () {
|
|
3
6
|
$('#expansion-btn').click(function () {
|
data/_includes/link-card.html
CHANGED
|
@@ -7,45 +7,32 @@ This builds a link card
|
|
|
7
7
|
- name
|
|
8
8
|
- url (optional)
|
|
9
9
|
- thumbnail (optional)
|
|
10
|
-
-
|
|
10
|
+
- octicon (optional) The name of the octicon icon to use for image
|
|
11
11
|
|
|
12
12
|
{%- endcomment %}
|
|
13
|
+
|
|
14
|
+
{%- assign link = include.link %}
|
|
15
|
+
|
|
13
16
|
{%- if link.url %}
|
|
14
17
|
<a href="{{ link.url | relative_url }}"
|
|
15
|
-
class="Link Link-btn d-flex flex-justify-between flex-items-center hover-grow no-underline border rounded-3 p-2"
|
|
18
|
+
class="Link Link-btn d-flex flex-justify-between flex-items-center hover-grow no-underline border rounded-3 p-2"
|
|
19
|
+
{% if link.url contains "http" %}target="_blank" rel="noopener noreferrer"{% endif %}>
|
|
16
20
|
<div class="avatar-7">
|
|
17
|
-
{
|
|
18
|
-
<img src="{{ link.thumbnail | relative_url }}" width="48" height="48"
|
|
19
|
-
class="rounded-2 box-shadow-none img-cover float-left" alt="{{ link.name }}">
|
|
20
|
-
{%- endif %}
|
|
21
|
-
{%- if link.octicon %}
|
|
22
|
-
{% octicon {{ link.octicon }} height:48 %}
|
|
23
|
-
{%- endif %}
|
|
21
|
+
{% include thumbnail.html thumbnail=link.thumbnail octicon = link.octicon %}
|
|
24
22
|
</div>
|
|
25
|
-
<div class="p-2">
|
|
23
|
+
<div class="p-2 flex-1">
|
|
26
24
|
<p class="f3 text-center mb-0">{{ link.name }}</p>
|
|
27
|
-
{%- if link.description %}
|
|
28
|
-
<p class="f5 text-gray text-center mb-0 mt-1">{{ link.description }}</p>
|
|
29
|
-
{%- endif %}
|
|
30
25
|
</div>
|
|
31
|
-
<div class="avatar-7"></div>
|
|
32
26
|
</a>
|
|
33
27
|
{%- else %}
|
|
34
28
|
<div class="Link-text github-component position-relative height-full d-flex flex-column text-center p-1">
|
|
35
29
|
<div class="d-inline-flex flex-items-center">
|
|
36
30
|
<div class="avatar-7">
|
|
37
|
-
{
|
|
38
|
-
<img src="{{ link.thumbnail | relative_url }}" width="48" height="48"
|
|
39
|
-
class="rounded-1 box-shadow-none img-contain float-left" alt="{{ link.name }}">
|
|
40
|
-
{%- endif %}
|
|
31
|
+
{% include thumbnail.html thumbnail=link.thumbnail octicon = link.octicon %}
|
|
41
32
|
</div>
|
|
42
|
-
<div class="flex-
|
|
33
|
+
<div class="p-2 flex-1">
|
|
43
34
|
<p class="f3 lh-condensed text-center mt-1">{{ link.name }}</p>
|
|
44
|
-
{%- if link.description %}
|
|
45
|
-
<p class="f5 text-gray text-center mt-1">{{ link.description }}</p>
|
|
46
|
-
{%- endif %}
|
|
47
35
|
</div>
|
|
48
|
-
<div class="avatar-7"></div>
|
|
49
36
|
</div>
|
|
50
37
|
</div>
|
|
51
38
|
{%- endif %}
|
data/_includes/links.html
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
{% assign links =
|
|
2
|
-
<div class="width-full">
|
|
3
|
-
<div class="d-flex flex-column
|
|
1
|
+
{% assign links = include.links %}
|
|
2
|
+
<div class="width-full mb-8">
|
|
3
|
+
<div class="d-flex flex-column">
|
|
4
4
|
{%- for link in links %}
|
|
5
5
|
<div class="mb-2">
|
|
6
|
-
{%- include link-card.html %}
|
|
6
|
+
{%- include link-card.html link=link %}
|
|
7
7
|
</div>
|
|
8
8
|
{%- endfor %}
|
|
9
9
|
</div>
|
data/_includes/masthead.html
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{%- assign user = site.github.owner %}
|
|
2
2
|
{%- assign name = include.title | default: site.title | default: user.name | default: user.login %}
|
|
3
|
-
{%- assign user_img = site.user_image | default: user.avatar_url %}
|
|
3
|
+
{%- assign user_img = site.user_image | default: user.avatar_url | default: "/assets/img/user-image.jpg" %}
|
|
4
4
|
{%- assign user_metadata = site.user_metadata -%}
|
|
5
5
|
|
|
6
6
|
<div class="Masthead">
|
data/_includes/nav-overlay.html
CHANGED
|
@@ -1,38 +1,53 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
{%- assign user = site.github.owner %}
|
|
2
|
+
{%- assign name = site.title | default: user.name | default: user.login %}
|
|
3
|
+
{%- assign user_img = site.user_image | default: user.avatar_url | default: "/assets/img/user-image.jpg" %}
|
|
4
|
+
{%- assign nav_id = include.id | default: "nav-menu" %}
|
|
5
|
+
<script>
|
|
6
|
+
$(document).ready(function () {
|
|
7
|
+
const $menu = $("#{{ nav_id }}");
|
|
8
|
+
const $closeButton = $(".close-menu");
|
|
9
|
+
|
|
10
|
+
if ($menu.length && $closeButton.length) {
|
|
11
|
+
$closeButton.click(() => $menu.removeAttr("open")); // Properly closes the dropdown
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
</script>
|
|
15
|
+
<details class="details-reset details-overlay" id="{{ nav_id }}">
|
|
16
|
+
<summary class="AppHeader-button btn btn-invisible" aria-haspopup="true">
|
|
17
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
18
|
+
<path d="M4 6H20M4 12H20M4 18H20" stroke="currentColor" stroke-width="2" stroke-linecap="round" />
|
|
19
|
+
</svg>
|
|
20
|
+
</summary>
|
|
21
|
+
<details-menu class="SelectMenu" role="menu">
|
|
22
|
+
<div class="SelectMenu-modal">
|
|
23
|
+
<div class="SelectMenu-header">
|
|
24
|
+
<div tabindex="-1" class="SelectMenu-title" id="github-logo">
|
|
6
25
|
<a href="{{ site.baseurl }}/" class="AppHeader-link d-flex flex-items-center no-underline mr-3">
|
|
7
|
-
<img class="avatar img-cover circle" height="32" width="32" alt="{{ name }}"
|
|
26
|
+
<img class="avatar img-cover circle" height="32" width="32" alt="{{ name }}"
|
|
27
|
+
src="{{ user_img | relative_url }}">
|
|
8
28
|
<span class="h4 text-semibold mx-3">{{ name }}</span>
|
|
9
29
|
</a>
|
|
10
30
|
</div>
|
|
31
|
+
<div class="d-flex flex-justify-end">
|
|
32
|
+
<button class="SelectMenu-closeButton close-menu" type="button">
|
|
33
|
+
{% octicon x height: 16 %}
|
|
34
|
+
</button>
|
|
35
|
+
</div>
|
|
11
36
|
</div>
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
{% octicon x height: 16 %}
|
|
15
|
-
</button>
|
|
16
|
-
</div>
|
|
17
|
-
</div>
|
|
18
|
-
<div class="Overlay-body d-flex flex-column p-2">
|
|
19
|
-
<ul data-overflow-nav class="ActionListWrap SideNav">
|
|
37
|
+
|
|
38
|
+
<div class="SelectMenu-list">
|
|
20
39
|
{%- for nav_item in site.nav %}
|
|
21
|
-
<
|
|
22
|
-
<a href="{{ nav_item.url | relative_url }}" class="ActionListContent ActionListItem-label" >
|
|
23
|
-
{{ nav_item.name }}
|
|
24
|
-
</a>
|
|
25
|
-
</li>
|
|
40
|
+
<a href="{{ nav_item.url }}" class="SelectMenu-item" role="menuitem"{% if page.url contains nav_item.url %} aria-current="page"{% endif %}>{{ nav_item.name }}</a>
|
|
26
41
|
{%- endfor %}
|
|
27
|
-
</ul>
|
|
28
|
-
</div>
|
|
29
|
-
<div class="Overlay-footer Overlay-footer--alignEnd d-block pt-0">
|
|
30
|
-
<div class="ActionList-sectionDivider mt-0 mb-1"></div>
|
|
31
|
-
{%- if site.social_media %}
|
|
32
|
-
<div class="ActionList px-0 flex-1">
|
|
33
|
-
{%- include social.html %}
|
|
34
42
|
</div>
|
|
35
|
-
|
|
43
|
+
<div class="SelectMenu-footer">
|
|
44
|
+
<div class="ActionList-sectionDivider mt-0 mb-1"></div>
|
|
45
|
+
{%- if site.social_media %}
|
|
46
|
+
<div class="ActionList px-0 flex-1 pb-">
|
|
47
|
+
{%- include social.html %}
|
|
48
|
+
</div>
|
|
49
|
+
{%- endif %}
|
|
50
|
+
</div>
|
|
36
51
|
</div>
|
|
37
|
-
</
|
|
38
|
-
</
|
|
52
|
+
</details-menu>
|
|
53
|
+
</details>
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
{% assign paginate_path = include.paginate_path | default: site.paginate_path %}
|
|
2
|
+
{% assign previous_page_path = include.previous_page_path | default: paginator.previous_page_path %}
|
|
3
|
+
{% assign next_page_path = include.next_page_path | default: paginator.next_page_path %}
|
|
4
|
+
<div class="paginate-container">
|
|
5
|
+
{% if paginator.total_pages > 1 %}
|
|
6
|
+
<div role="navigation" aria-label="Pagination" class="d-flex d-md-inline-block pagination">
|
|
7
|
+
{%- if paginator.previous_page %}
|
|
8
|
+
<a class="previous_page" rel="prev" href="{{ previous_page_path | relative_url }}"
|
|
9
|
+
aria-disabled="false">Previous</a>
|
|
10
|
+
{% endif %}
|
|
11
|
+
|
|
12
|
+
{%- for paginator_nav_page in (1..paginator.total_pages) %}
|
|
13
|
+
{%- if paginator_nav_page == paginator.page %}
|
|
14
|
+
<a href="{{ page.url | relative_url }}" aria-label="{{ paginator_nav_page }}" aria-current="page">{{ paginator_nav_page }}</a>
|
|
15
|
+
{% elsif paginator_nav_page == 1 %}
|
|
16
|
+
<a href="{{ paginate_path | relative_url | replace: 'page:num', '' }}" aria-label="{{ paginator_nav_page }}">{{ paginator_nav_page }}</a>
|
|
17
|
+
{% else %}
|
|
18
|
+
<a href="{{ paginate_path | relative_url | replace: ':num', paginator_nav_page }}" aria-label="{{ paginator_nav_page }}">{{ paginator_nav_page }}</a>
|
|
19
|
+
{%- endif %}
|
|
20
|
+
{%- endfor %}
|
|
21
|
+
|
|
22
|
+
{%- if paginator.next_page %}
|
|
23
|
+
<a class="next_page" rel="next" href="{{ next_page_path | relative_url }}"
|
|
24
|
+
aria-disabled="false">Next</a>
|
|
25
|
+
{% endif %}
|
|
26
|
+
</div>
|
|
27
|
+
{% endif %}
|
|
28
|
+
</div>
|
|
@@ -1,9 +1,28 @@
|
|
|
1
|
+
{%- comment -%}
|
|
2
|
+
post-timeline-card.html
|
|
3
|
+
Usage example:
|
|
4
|
+
{% include post-timeline-card.html post=post %}
|
|
5
|
+
|
|
6
|
+
Expects:
|
|
7
|
+
post (object) with fields:
|
|
8
|
+
- url
|
|
9
|
+
- title
|
|
10
|
+
- author (optional)
|
|
11
|
+
- date
|
|
12
|
+
- tags (array, optional)
|
|
13
|
+
- excerpt (optional)
|
|
14
|
+
- content (optional)
|
|
15
|
+
- type (string, optional, for the Octicon, defaults to 'comment')
|
|
16
|
+
- video (URL string, optional)
|
|
17
|
+
- image (URL string, optional)
|
|
18
|
+
{%- endcomment -%}
|
|
19
|
+
{%- assign post = include.post %}
|
|
1
20
|
{%- assign icon = post.type | default: "comment" %}
|
|
2
21
|
<div class="TimelineItem flex-wrap">
|
|
3
22
|
<div class="col-12 col-md-5 position-relative">
|
|
4
23
|
<div class="TimelineItem-title mt-5 position-sticky d-flex">
|
|
5
24
|
<div class="TimelineItem-badge">{% octicon {{icon}} height:16 %}</div>
|
|
6
|
-
<div class="title">
|
|
25
|
+
<div class="title mb-5">
|
|
7
26
|
<div class="h2">
|
|
8
27
|
<a href="{{ post.url | relative_url }}">
|
|
9
28
|
{{ post.title }}
|
|
@@ -14,28 +33,28 @@
|
|
|
14
33
|
{%- endif %}
|
|
15
34
|
<div class="text-gray mb-2 ws-normal">{{ post.date | date: "%b %d, %Y"}}</div>
|
|
16
35
|
{%- for tag in post.tags %}
|
|
17
|
-
<span class="IssueLabel IssueLabel--big color-bg-accent-emphasis color-fg-on-emphasis mr-1">{{tag}}</span>
|
|
36
|
+
<span class="IssueLabel IssueLabel--big color-bg-accent-emphasis color-fg-on-emphasis mr-1 mb-5">{{tag}}</span>
|
|
18
37
|
{%- endfor %}
|
|
19
38
|
</div>
|
|
20
39
|
</div>
|
|
21
40
|
</div>
|
|
22
41
|
<div class="col-12 col-md-7">
|
|
23
|
-
<div class="
|
|
42
|
+
<div class="pt-md-7 ml-5 border-bottom">
|
|
24
43
|
{%- if post.video %}
|
|
25
|
-
<div id="Timeline-video-container" class="image-container">
|
|
44
|
+
<div id="Timeline-video-container" class="image-container mb-5">
|
|
26
45
|
<iframe id="Timeline-video" src="{{ post.video }}" frameborder="0" height="inherited"
|
|
27
46
|
width="inherited"></iframe>
|
|
28
47
|
</div>
|
|
29
48
|
{%- elsif post.image %}
|
|
30
|
-
<div class="image-container">
|
|
49
|
+
<div class="image-container mb-5">
|
|
31
50
|
<img class="rounded-2" src="{{ post.image}}" width="800" height="425" alt="{{ post.title }}" />
|
|
32
51
|
</div>
|
|
33
52
|
{%- endif %}
|
|
34
|
-
<div class="summary"> {{ post.excerpt }}</div>
|
|
35
|
-
{%- if post.content !=
|
|
36
|
-
<div class="more">
|
|
53
|
+
{% if post.excerpt != blank %}<div class="summary mb-5"> {{ post.excerpt }}</div>{% endif %}
|
|
54
|
+
{%- if post.content != post.excerpt %}
|
|
55
|
+
<div class="more mb-5">
|
|
37
56
|
<a href="{{ post.url | relative_url }}" class="link-mktg arrow-target-mktg text-semibold f4-mktg">
|
|
38
|
-
|
|
57
|
+
Continue
|
|
39
58
|
<svg xmlns="http://www.w3.org/2000/svg" class="octicon arrow-symbol-mktg" width="16" height="16"
|
|
40
59
|
viewBox="0 0 16 16" fill="none">
|
|
41
60
|
<path fill="currentColor"
|
|
@@ -1,18 +1,30 @@
|
|
|
1
|
-
{%-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
{%- comment -%}
|
|
2
|
+
post-timeline.html
|
|
3
|
+
Usage example:
|
|
4
|
+
{% include post-timeline.html collection=site.posts limit=5 index='/blog/index.html' %}
|
|
4
5
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
6
|
+
Expects:
|
|
7
|
+
collection (array, required) - A list of posts or other objects to display.
|
|
8
|
+
limit (integer, optional) - Number of posts to display (default: all).
|
|
9
|
+
index (string, optional) - Index page for the collection.
|
|
10
|
+
{%- endcomment -%}
|
|
11
|
+
|
|
12
|
+
{%- assign timeline_collection = include.collection | sort: "date" | reverse %}
|
|
13
|
+
{%- assign timeline_post_limit = include.limit | default: -1 %}
|
|
14
|
+
{%- if timeline_post_limit < 0 %}
|
|
15
|
+
{%- assign timeline_post_limit = collection.size %}
|
|
16
|
+
{%- endif %}
|
|
17
|
+
{% assign timeline_index = include.index %}
|
|
18
|
+
|
|
19
|
+
<div class="container-xl mx-auto p-responsive-blog mb-8">
|
|
20
|
+
{%- for post in timeline_collection | limit: timeline_post_limit %}
|
|
21
|
+
{%- include post-timeline-card.html post=post %}
|
|
22
|
+
{%- endfor %}
|
|
23
|
+
{%- if timeline_collection.size > timeline_post_limit and timeline_index %}
|
|
24
|
+
<div class="mx-auto p-responsive-blog">
|
|
13
25
|
<div class="d-flex gutter-spacious">
|
|
14
26
|
<div class="col-12 col-md-7 offset-md-5">
|
|
15
|
-
<a href="{{
|
|
27
|
+
<a href="{{ timeline_index | relative_url }}"
|
|
16
28
|
class="Link--primary arrow-target-mktg text-semibold btn ml-5">View all {% octicon chevron-right height:16 %}</a>
|
|
17
29
|
</div>
|
|
18
30
|
</div>
|
data/_includes/posts.html
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
{%- include post-card.html %}
|
|
6
6
|
{%- endfor %}
|
|
7
7
|
</div>
|
|
8
|
-
{%- if site.
|
|
8
|
+
{%- if site.paginate %}
|
|
9
9
|
<div class="col-12 col-md-7 offset-md-5 mb-5">
|
|
10
10
|
<a href="{{ site.paginate_path | relative_url | replace: 'page:num', '' }}" class="btn ml-5">Read more</a>
|
|
11
11
|
</div>
|
data/_includes/repositories.html
CHANGED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{%- comment %}
|
|
2
|
+
This creates a thumbnail image. Thumbnail images can either be set to an image or an octicon
|
|
3
|
+
|
|
4
|
+
## Inputs
|
|
5
|
+
|
|
6
|
+
- thumbnail (optional)
|
|
7
|
+
- octicon (optional)
|
|
8
|
+
|
|
9
|
+
{%- endcomment %}
|
|
10
|
+
|
|
11
|
+
{%- assign thumbnail = include.thumbnail %}
|
|
12
|
+
{%- assign octicon = include.octicon %}
|
|
13
|
+
|
|
14
|
+
{%- if include.thumbnail %}
|
|
15
|
+
<img src="{{ thumbnail | relative_url }}" width="48" height="48"
|
|
16
|
+
class="rounded-2 box-shadow-none img-cover float-left" alt="{{ name }}">
|
|
17
|
+
{% elsif octicon %}
|
|
18
|
+
{% octicon {{ octicon }} height:48 %}
|
|
19
|
+
{% endif %}
|
|
@@ -7,8 +7,6 @@ title: Category
|
|
|
7
7
|
{%- assign category_permalink = page.pagination.permalink | default: site.autopages.categories.permalink | default: category_permalink %}
|
|
8
8
|
{%- assign per_section = page.per_section | default: page.pagination.per_page | default: 3 %}
|
|
9
9
|
|
|
10
|
-
<h1 class="h3-mktg mt-4 mb-6 mb-md-8">{{ page.title }}</h1>
|
|
11
|
-
|
|
12
10
|
{% include post-gallery.html
|
|
13
11
|
collection=categories
|
|
14
12
|
collection_permalink=category_permalink
|