jekyll-theme-yat 1.1.0 → 1.2.0
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/_includes/extensions/hashlocate.html +16 -15
- data/_includes/extensions/trianglify.html +8 -5
- data/_includes/head.html +2 -1
- data/_includes/sidebar/article-menu.html +39 -38
- data/_includes/views/banner.html +9 -6
- data/_includes/views/header.html +91 -39
- data/_layouts/framework.html +1 -1
- data/_sass/misc/common-list.scss +0 -2
- data/_sass/misc/google-translate.scss +10 -15
- data/_sass/yat/_base.scss +1 -1
- data/_sass/yat/_layout.scss +87 -25
- data/_sass/yat.scss +1 -1
- data/assets/{main.scss → css/main.scss} +0 -0
- data/assets/js/main.js +57 -0
- metadata +4 -3
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 199b703930a9c7789ba8aa41c785b78c60297f4deb8ecae19a0931279a041a43
|
4
|
+
data.tar.gz: 5bb14cf3155134a0adb196352f8fdf50b40e0867644979bd11423cb79f2c7eba
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: '08e63a1440c99e39c40acede34c082b69c30fbf1aead084ed7054ec8359aa01bb0bd4e798242594c544872ac4febde68d5c3ca237f0dc618ef1fb7bfa0c5cece'
|
7
|
+
data.tar.gz: 141aa0359967926e9dc208297e31cf1799ddb6dd2e676f46d8e2833758886722f54f33f820b53d8d652a8192ac7c3513c8608eeda78c9d1428e8c86d1eeae663
|
@@ -7,30 +7,31 @@
|
|
7
7
|
return;
|
8
8
|
}
|
9
9
|
|
10
|
-
var headerHeight = 0;
|
11
10
|
var header = document.querySelector('header');
|
12
|
-
|
13
|
-
|
14
|
-
}
|
15
|
-
var supportPageOffset = window.pageXOffset !== undefined;
|
16
|
-
var isCSS1Compat = ((document.compatMode || "") === "CSS1Compat");
|
17
|
-
|
18
|
-
var x = supportPageOffset ? window.pageXOffset : isCSS1Compat ? document.documentElement.scrollLeft : document.body.scrollLeft;
|
19
|
-
var y = supportPageOffset ? window.pageYOffset : isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop;
|
11
|
+
var scrollPos = getScrollPos();
|
12
|
+
var offsetY = element.offsetTop - (header.offsetTop + header.offsetHeight + 20);
|
20
13
|
|
21
|
-
|
22
|
-
if (y === offsetY) {
|
14
|
+
if (offsetY == scrollPos.y) {
|
23
15
|
return;
|
24
16
|
}
|
25
17
|
|
26
|
-
|
18
|
+
if (header.offsetTop == 0 && offsetY > scrollPos.y) {
|
19
|
+
offsetY += header.offsetHeight;
|
20
|
+
} else if (header.offsetTop < 0 && offsetY < scrollPos.y) {
|
21
|
+
offsetY -= header.offsetHeight;
|
22
|
+
}
|
23
|
+
|
24
|
+
smoothScrollTo(offsetY);
|
27
25
|
}
|
28
26
|
|
29
27
|
// The first event occurred
|
30
|
-
|
31
|
-
|
32
|
-
|
28
|
+
window.addEventListener('load', function(event) {
|
29
|
+
if (window.location.hash) {
|
30
|
+
hashLocate(window.location.hash);
|
31
|
+
}
|
32
|
+
});
|
33
33
|
|
34
|
+
// The first event occurred
|
34
35
|
window.addEventListener('click', function(event) {
|
35
36
|
if (event.target.matches('a')) {
|
36
37
|
hashLocate(event.target.getAttribute('href'));
|
@@ -8,16 +8,19 @@
|
|
8
8
|
|
9
9
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/trianglify/2.0.0/trianglify.min.js"></script>
|
10
10
|
<script>
|
11
|
-
function setRandomBgImage(selector, seed) {
|
11
|
+
function setRandomBgImage(selector, seed, zoom) {
|
12
12
|
var element = document.querySelector(selector);
|
13
13
|
if (!element) return;
|
14
14
|
var pattern = Trianglify({
|
15
|
-
width: screen.width,
|
16
|
-
height: element.offsetHeight,
|
15
|
+
width: screen.width * zoom,
|
16
|
+
height: element.offsetHeight * zoom,
|
17
17
|
seed: seed
|
18
18
|
});
|
19
|
-
|
19
|
+
|
20
|
+
var image = document.createElement("div");
|
21
|
+
image.style.backgroundImage = "url(" + pattern.png() + ")";
|
22
|
+
element.appendChild(image);
|
20
23
|
}
|
21
24
|
|
22
|
-
setRandomBgImage('{{ selector }}', '{{ seed }}');
|
25
|
+
setRandomBgImage('{{ selector }}', '{{ seed }}', {{ zoom | default: 1}});
|
23
26
|
</script>
|
data/_includes/head.html
CHANGED
@@ -6,7 +6,8 @@
|
|
6
6
|
{%- seo -%}
|
7
7
|
<link rel="shortcut icon" href="{{ site.favicon }}">
|
8
8
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
9
|
-
<link rel="stylesheet" href="{{ "/assets/main.css" | relative_url }}">
|
9
|
+
<link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}">
|
10
|
+
<script src="{{ "/assets/js/main.js" | relative_url }}"></script>
|
10
11
|
{%- feed_meta -%}
|
11
12
|
{%- if jekyll.environment == 'production' and site.google_analytics -%}
|
12
13
|
{%- include extensions/google-analytics.html -%}
|
@@ -12,48 +12,49 @@
|
|
12
12
|
</div>
|
13
13
|
|
14
14
|
<script>
|
15
|
-
|
16
|
-
|
15
|
+
function generateContent() {
|
16
|
+
var menu = document.querySelector(".post-menu .post-menu-content");
|
17
|
+
var headings = document.querySelector(".post-content").querySelectorAll("h2, h3, h4, h5, h6");
|
17
18
|
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
19
|
+
// Generate post menu
|
20
|
+
var menuHTML = '';
|
21
|
+
for (var i = 0; i < headings.length; i++) {
|
22
|
+
var h = headings[i];
|
23
|
+
menuHTML += (
|
24
|
+
'<li class="h-' + h.tagName.toLowerCase() + '">'
|
25
|
+
+ '<a href="#h-' + h.getAttribute('id') + '">' + h.textContent + '</a></li>');
|
26
|
+
}
|
25
27
|
|
26
|
-
|
28
|
+
menu.innerHTML = '<ul>' + menuHTML + '</ul>';
|
27
29
|
|
28
|
-
|
29
|
-
|
30
|
-
var header = document.querySelector('header');
|
31
|
-
if (header) {
|
32
|
-
offsetHeight = header.offsetHeight + 12;
|
33
|
-
}
|
30
|
+
// The header element
|
31
|
+
var header = document.querySelector('header.site-header');
|
34
32
|
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
curActive
|
47
|
-
|
48
|
-
|
49
|
-
|
33
|
+
// Active the menu item
|
34
|
+
window.addEventListener('scroll', function (event) {
|
35
|
+
var lastActive = menu.querySelector('.active');
|
36
|
+
var changed = true;
|
37
|
+
for (var i = headings.length - 1; i >= 0; i--) {
|
38
|
+
var h = headings[i];
|
39
|
+
var clientRect = h.getBoundingClientRect();
|
40
|
+
var headerHeight = header.offsetTop + header.offsetHeight + 20;
|
41
|
+
if (clientRect.top <= headerHeight) {
|
42
|
+
var id = 'h-' + h.getAttribute('id');
|
43
|
+
var curActive = menu.querySelector('a[href="#' + id + '"]');
|
44
|
+
if (curActive) {
|
45
|
+
curActive.classList.add('active');
|
46
|
+
}
|
47
|
+
if (lastActive == curActive) {
|
48
|
+
changed = false;
|
49
|
+
}
|
50
|
+
break;
|
50
51
|
}
|
51
|
-
break;
|
52
52
|
}
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
}
|
53
|
+
if (lastActive && changed) {
|
54
|
+
lastActive.classList.remove('active');
|
55
|
+
}
|
56
|
+
event.preventDefault();
|
57
|
+
});
|
58
|
+
}
|
59
|
+
generateContent();
|
59
60
|
</script>
|
data/_includes/views/banner.html
CHANGED
@@ -44,12 +44,14 @@
|
|
44
44
|
|
45
45
|
{%- else -%}
|
46
46
|
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
47
|
+
<div class="page-banner-default">
|
48
|
+
<h1 class="page-banner-heading">
|
49
|
+
{{ heading | default: page.title | escape }}
|
50
|
+
</h1>
|
51
|
+
<h3 class="page-banner-subheading">
|
52
|
+
{{ subheading | default: page.subtitle | escape }}
|
53
|
+
</h3>
|
54
|
+
</div>
|
53
55
|
|
54
56
|
{%- endif -%}
|
55
57
|
</div>
|
@@ -72,6 +74,7 @@
|
|
72
74
|
|
73
75
|
{%- endif -%}
|
74
76
|
|
77
|
+
{%- assign zoom = 1.5 -%}
|
75
78
|
{%- include extensions/trianglify.html -%}
|
76
79
|
|
77
80
|
{%- endif -%}
|
data/_includes/views/header.html
CHANGED
@@ -1,44 +1,96 @@
|
|
1
|
-
|
1
|
+
|
2
|
+
{%- include functions.html func='log' level='debug' msg='Get banner value' -%}
|
3
|
+
{% assign name = 'banner' %}
|
4
|
+
{%- include functions.html func='get_value' -%}
|
5
|
+
{% assign banner = return %}
|
6
|
+
|
7
|
+
{%- include functions.html func='log' level='debug' msg='Get header_transparent value' -%}
|
8
|
+
{% assign name = 'header_transparent' %}
|
9
|
+
{%- include functions.html func='get_value' -%}
|
10
|
+
{% assign header_transparent = return %}
|
11
|
+
|
12
|
+
{%- if banner and header_transparent -%}
|
13
|
+
{%- assign header_transparent_class = "site-header-transparent" -%}
|
14
|
+
{%- endif -%}
|
15
|
+
|
16
|
+
<header class="site-header {{ header_transparent_class }}" role="banner">
|
2
17
|
|
3
18
|
<div class="wrapper">
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
<
|
14
|
-
|
15
|
-
<
|
16
|
-
<
|
17
|
-
<
|
18
|
-
|
19
|
-
|
20
|
-
</label>
|
21
|
-
|
22
|
-
<div class="trigger">
|
23
|
-
{%- for path in page_paths -%}
|
24
|
-
{%- assign my_page = site.pages | where: "path", path | first -%}
|
25
|
-
{%- if my_page.title -%}
|
26
|
-
<a class="page-link" href="{{ my_page.url | relative_url }}">
|
27
|
-
{{ my_page.title | upcase | escape }}
|
28
|
-
</a>
|
29
|
-
{%- endif -%}
|
30
|
-
{%- endfor -%}
|
31
|
-
|
32
|
-
{%- assign name = 'translate_langs' -%}
|
33
|
-
{%- include functions.html func='get_value' -%}
|
34
|
-
{%- assign translate_langs = return -%}
|
35
|
-
{%- if translate_langs.size > 0 -%}
|
36
|
-
<span class="page-link">
|
37
|
-
{%- include extensions/google-translate.html -%}
|
19
|
+
<div class="site-header-inner">
|
20
|
+
{%- assign default_paths = site.pages | where: "dir", "/" | map: "path" -%}
|
21
|
+
{%- assign page_paths = site.header_pages | default: default_paths -%}
|
22
|
+
|
23
|
+
<span class="site-brand">
|
24
|
+
{%- include views/site-brand.html -%}
|
25
|
+
</span>
|
26
|
+
|
27
|
+
{%- if page_paths -%}
|
28
|
+
<nav class="site-nav">
|
29
|
+
<input type="checkbox" id="nav-trigger" class="nav-trigger" />
|
30
|
+
<label for="nav-trigger">
|
31
|
+
<span class="menu-icon">
|
32
|
+
<svg viewBox="0 0 18 15" width="18px" height="15px">
|
33
|
+
<path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/>
|
34
|
+
</svg>
|
38
35
|
</span>
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
36
|
+
</label>
|
37
|
+
|
38
|
+
<div class="trigger">
|
39
|
+
{%- for path in page_paths -%}
|
40
|
+
{%- assign my_page = site.pages | where: "path", path | first -%}
|
41
|
+
{%- if my_page.title -%}
|
42
|
+
<a class="page-link" href="{{ my_page.url | relative_url }}">
|
43
|
+
{{ my_page.title | upcase | escape }}
|
44
|
+
</a>
|
45
|
+
{%- endif -%}
|
46
|
+
{%- endfor -%}
|
47
|
+
|
48
|
+
{%- assign name = 'translate_langs' -%}
|
49
|
+
{%- include functions.html func='get_value' -%}
|
50
|
+
{%- assign translate_langs = return -%}
|
51
|
+
{%- if translate_langs.size > 0 -%}
|
52
|
+
<span class="page-link">
|
53
|
+
{%- include extensions/google-translate.html -%}
|
54
|
+
</span>
|
55
|
+
{%- endif -%}
|
56
|
+
</div>
|
57
|
+
</nav>
|
58
|
+
{%- endif -%}
|
59
|
+
</div>
|
43
60
|
</div>
|
44
61
|
</header>
|
62
|
+
|
63
|
+
<script>
|
64
|
+
(function() {
|
65
|
+
var lastScrollY = getScrollPos().y;
|
66
|
+
var documentElement = document.documentElement;
|
67
|
+
|
68
|
+
function storeScrollData() {
|
69
|
+
var y = getScrollPos().y;
|
70
|
+
|
71
|
+
{%- if banner and header_transparent -%}
|
72
|
+
documentElement.setAttribute("data-header-transparent", "");
|
73
|
+
{%- endif -%}
|
74
|
+
|
75
|
+
var scrollStatus = "";
|
76
|
+
|
77
|
+
if (y <= 0) {
|
78
|
+
scrollStatus = "top";
|
79
|
+
} else if ((window.innerHeight + y) >= document.body.offsetHeight) {
|
80
|
+
scrollStatus = "bottom";
|
81
|
+
} else {
|
82
|
+
var isScrollDown = (y - lastScrollY > 0) ? true : false;
|
83
|
+
scrollStatus = isScrollDown ? "down" : "up";
|
84
|
+
}
|
85
|
+
|
86
|
+
lastScrollY = y;
|
87
|
+
documentElement.setAttribute("data-scroll-status", scrollStatus);
|
88
|
+
}
|
89
|
+
|
90
|
+
window.addEventListener('scroll', function(e) {
|
91
|
+
storeScrollData();
|
92
|
+
});
|
93
|
+
|
94
|
+
storeScrollData();
|
95
|
+
})();
|
96
|
+
</script>
|
data/_layouts/framework.html
CHANGED
data/_sass/misc/common-list.scss
CHANGED
@@ -122,15 +122,19 @@ body {
|
|
122
122
|
position: absolute;
|
123
123
|
top: 110%;
|
124
124
|
right: -10px;
|
125
|
+
background-color: lighten($theme-color, 5%);
|
125
126
|
-webkit-transition: all 0.25s ease-in-out;
|
126
127
|
transition: all 0.25s ease-in-out;
|
127
128
|
width: 100px;
|
128
129
|
text-align: center;
|
129
|
-
|
130
|
+
margin-top: 0;
|
130
131
|
z-index: 200;
|
132
|
+
border-radius: 3px;
|
133
|
+
padding-top: 8px;
|
134
|
+
padding-bottom: 8px;
|
135
|
+
visibility: hidden;
|
131
136
|
|
132
137
|
li {
|
133
|
-
background: lighten($theme-color, 5%);
|
134
138
|
padding: 5px;
|
135
139
|
|
136
140
|
a {
|
@@ -140,24 +144,14 @@ body {
|
|
140
144
|
img {
|
141
145
|
width: 24px;
|
142
146
|
max-height: 24px;
|
147
|
+
border: none;
|
143
148
|
}
|
144
149
|
}
|
145
150
|
|
146
|
-
&:first-child {
|
147
|
-
padding-top: 10px;
|
148
|
-
border-radius: 3px 3px 0 0;
|
149
|
-
}
|
150
|
-
|
151
|
-
&:last-child {
|
152
|
-
padding-bottom: 10px;
|
153
|
-
border-radius: 0 0 3px 3px;
|
154
|
-
}
|
155
|
-
|
156
151
|
&:hover {
|
157
152
|
@extend .ct-language-selected;
|
158
153
|
}
|
159
154
|
}
|
160
|
-
|
161
155
|
}
|
162
156
|
|
163
157
|
.list-unstyled {
|
@@ -169,7 +163,7 @@ body {
|
|
169
163
|
.ct-language {
|
170
164
|
display: inline-block;
|
171
165
|
position: relative;
|
172
|
-
background: #fefefe2b;
|
166
|
+
background-color: #fefefe2b;
|
173
167
|
padding: 3px 10px;
|
174
168
|
border-radius: 3px;
|
175
169
|
|
@@ -177,8 +171,9 @@ body {
|
|
177
171
|
cursor: pointer;
|
178
172
|
|
179
173
|
.ct-language-dropdown {
|
180
|
-
|
174
|
+
margin-top: 8px;
|
181
175
|
max-height: 10000px;
|
176
|
+
visibility: visible;
|
182
177
|
}
|
183
178
|
}
|
184
179
|
|
data/_sass/yat/_base.scss
CHANGED
data/_sass/yat/_layout.scss
CHANGED
@@ -1,10 +1,51 @@
|
|
1
|
+
/**
|
2
|
+
* Animation for transparent header
|
3
|
+
*/
|
4
|
+
html {
|
5
|
+
&[data-header-transparent] {
|
6
|
+
header.site-header {
|
7
|
+
position: fixed;
|
8
|
+
}
|
9
|
+
}
|
10
|
+
|
11
|
+
&[data-scroll-status='top'] {
|
12
|
+
header.site-header-transparent {
|
13
|
+
height: 0;
|
14
|
+
|
15
|
+
&.site-header {
|
16
|
+
text-shadow: 0 0 2px #505050a0;
|
17
|
+
}
|
18
|
+
}
|
19
|
+
|
20
|
+
footer.site-footer {
|
21
|
+
color: #888;
|
22
|
+
background-color: transparent;
|
23
|
+
|
24
|
+
.site-footer-inner {
|
25
|
+
border-top: solid 1px #eee;
|
26
|
+
}
|
27
|
+
}
|
28
|
+
}
|
29
|
+
|
30
|
+
&[data-scroll-status='down'] {
|
31
|
+
header.site-header {
|
32
|
+
top: -$header-height;
|
33
|
+
}
|
34
|
+
|
35
|
+
.framework .sidebar {
|
36
|
+
top: 20px;
|
37
|
+
}
|
38
|
+
}
|
39
|
+
}
|
40
|
+
|
1
41
|
/**
|
2
42
|
* Site header
|
3
43
|
*/
|
4
44
|
.site-header {
|
5
|
-
background: $header-background-color;
|
45
|
+
background-color: $header-background-color;
|
6
46
|
height: $header-height;
|
7
47
|
width: 100%;
|
48
|
+
transition: height 0.2s, text-shadow 0.2s, top 0.2s;
|
8
49
|
|
9
50
|
// Positioning context for the mobile navigation icon
|
10
51
|
@include flex-sticky(0);
|
@@ -13,26 +54,28 @@
|
|
13
54
|
a {
|
14
55
|
text-decoration: none;
|
15
56
|
}
|
57
|
+
|
58
|
+
.site-header-inner {
|
59
|
+
position: relative;
|
60
|
+
}
|
16
61
|
}
|
17
62
|
|
18
63
|
.site-brand {
|
19
|
-
|
64
|
+
line-height: $header-height;
|
20
65
|
margin-right: 50px;
|
21
66
|
|
22
67
|
.site-brand-inner {
|
23
68
|
@include relative-font-size(1.125);
|
24
69
|
font-weight: $base-font-weight;
|
25
|
-
filter: drop-shadow(0 0 2px #08080880);
|
26
|
-
text-shadow: 0 0 2px #080808d0;
|
27
70
|
letter-spacing: -1px;
|
28
|
-
transition:
|
71
|
+
transition: filter 0.2s;
|
29
72
|
|
30
73
|
&, &:visited {
|
31
74
|
color: $header-text-color;
|
32
75
|
}
|
33
76
|
|
34
77
|
&:hover {
|
35
|
-
filter: drop-shadow(0 0
|
78
|
+
filter: drop-shadow(0 0 2px #08080880);
|
36
79
|
}
|
37
80
|
|
38
81
|
.site-favicon {
|
@@ -45,8 +88,10 @@
|
|
45
88
|
|
46
89
|
.site-nav {
|
47
90
|
@include relative-font-size(1.025);
|
48
|
-
float: right;
|
49
91
|
line-height: $header-height;
|
92
|
+
position: absolute;
|
93
|
+
right: 0;
|
94
|
+
top: 0;
|
50
95
|
|
51
96
|
.nav-trigger {
|
52
97
|
display: none;
|
@@ -68,12 +113,11 @@
|
|
68
113
|
|
69
114
|
@include media-query($on-palm) {
|
70
115
|
position: absolute;
|
71
|
-
|
116
|
+
top: 0;
|
72
117
|
text-align: left;
|
73
118
|
|
74
119
|
label[for="nav-trigger"] {
|
75
120
|
display: block;
|
76
|
-
float: right;
|
77
121
|
z-index: 2;
|
78
122
|
cursor: pointer;
|
79
123
|
}
|
@@ -113,9 +157,14 @@
|
|
113
157
|
.site-footer {
|
114
158
|
@include relative-font-size(0.9);
|
115
159
|
color: $footer-text-color;
|
116
|
-
background: $footer-background-color;
|
117
|
-
padding: $spacing-unit * 0.8 0;
|
160
|
+
background-color: $footer-background-color;
|
118
161
|
text-align: left;
|
162
|
+
transition: background-color 0.2s;
|
163
|
+
|
164
|
+
.site-footer-inner {
|
165
|
+
transition: border-top 0.2s;
|
166
|
+
padding: $spacing-unit * 0.8 0;
|
167
|
+
}
|
119
168
|
|
120
169
|
a {
|
121
170
|
$a-color: invert(mix(invert($theme-color), #0030ae));
|
@@ -151,6 +200,7 @@
|
|
151
200
|
*/
|
152
201
|
.page-content {
|
153
202
|
@extend %flex-1; /* <-- Keep footer on the bottom */
|
203
|
+
-ms-flex: none; /* <-- Fix IE footer issue */
|
154
204
|
padding: $spacing-unit * 1.5 0;
|
155
205
|
}
|
156
206
|
|
@@ -184,7 +234,7 @@
|
|
184
234
|
@include relative-font-size(1.5);
|
185
235
|
|
186
236
|
display: block;
|
187
|
-
font-weight:
|
237
|
+
font-weight: $base-font-weight * 1.5;
|
188
238
|
}
|
189
239
|
}
|
190
240
|
|
@@ -271,6 +321,7 @@
|
|
271
321
|
position: relative;
|
272
322
|
height: $banner-height;
|
273
323
|
background-color: $banner-background;
|
324
|
+
transition: height 0.2s;
|
274
325
|
|
275
326
|
.page-banner-img {
|
276
327
|
position: absolute;
|
@@ -294,23 +345,33 @@
|
|
294
345
|
padding: 10px 5px;
|
295
346
|
text-shadow: 1px 1px 2px #333;
|
296
347
|
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
348
|
+
& > *:first-child {
|
349
|
+
margin: 0;
|
350
|
+
|
351
|
+
> :nth-child(1) {
|
352
|
+
@include relative-font-size(2.825);
|
353
|
+
letter-spacing: -1px;
|
354
|
+
line-height: 1;
|
355
|
+
margin-bottom: 10px;
|
302
356
|
|
303
|
-
|
304
|
-
|
357
|
+
@include media-query($on-palm) {
|
358
|
+
@include relative-font-size(2.425);
|
359
|
+
}
|
305
360
|
}
|
306
|
-
}
|
307
361
|
|
308
|
-
|
362
|
+
> :nth-child(2) {
|
363
|
+
font-weight: $base-font-weight * 1.5;
|
364
|
+
}
|
309
365
|
|
310
|
-
|
311
|
-
|
366
|
+
> :last-child {
|
367
|
+
margin-bottom: 0;
|
368
|
+
}
|
312
369
|
}
|
313
370
|
}
|
371
|
+
|
372
|
+
@include media-query($on-palm) {
|
373
|
+
height: $banner-height / 1.5;
|
374
|
+
}
|
314
375
|
}
|
315
376
|
|
316
377
|
|
@@ -318,7 +379,7 @@
|
|
318
379
|
* Layout and sidebar
|
319
380
|
*/
|
320
381
|
.framework {
|
321
|
-
@extend %flex
|
382
|
+
@extend %flex;
|
322
383
|
|
323
384
|
.main {
|
324
385
|
@extend %flex-1;
|
@@ -326,6 +387,7 @@
|
|
326
387
|
|
327
388
|
.sidebar {
|
328
389
|
padding-left: 8px;
|
390
|
+
transition: top 0.2s, display 0.2s;
|
329
391
|
|
330
392
|
@include flex-sticky($header-height + 20px);
|
331
393
|
|
@@ -347,7 +409,7 @@
|
|
347
409
|
}
|
348
410
|
|
349
411
|
.segment-name {
|
350
|
-
font-weight:
|
412
|
+
font-weight: $base-font-weight * 1.5;
|
351
413
|
margin-bottom: 8px;
|
352
414
|
position: relative;
|
353
415
|
|
data/_sass/yat.scss
CHANGED
@@ -31,7 +31,7 @@ $footer-height: $header-height * 1.05 !default;
|
|
31
31
|
$footer-text-color: rgba(lighten(invert($theme-color), 30%), 50%) !default;
|
32
32
|
$footer-background-color: darken($theme-color, 5%) !default;
|
33
33
|
|
34
|
-
$banner-height:
|
34
|
+
$banner-height: 400px !default;
|
35
35
|
$banner-text-color: lighten($white-color, 0%) !default;
|
36
36
|
$banner-background: darken(#333, 5%) !default;
|
37
37
|
|
File without changes
|
data/assets/js/main.js
ADDED
@@ -0,0 +1,57 @@
|
|
1
|
+
// Fix DOM matches function
|
2
|
+
if (!Element.prototype.matches) {
|
3
|
+
Element.prototype.matches =
|
4
|
+
Element.prototype.matchesSelector ||
|
5
|
+
Element.prototype.mozMatchesSelector ||
|
6
|
+
Element.prototype.msMatchesSelector ||
|
7
|
+
Element.prototype.oMatchesSelector ||
|
8
|
+
Element.prototype.webkitMatchesSelector ||
|
9
|
+
function(s) {
|
10
|
+
var matches = (this.document || this.ownerDocument).querySelectorAll(s),
|
11
|
+
i = matches.length;
|
12
|
+
while (--i >= 0 && matches.item(i) !== this) {}
|
13
|
+
return i > -1;
|
14
|
+
};
|
15
|
+
}
|
16
|
+
|
17
|
+
// Get Scroll position
|
18
|
+
function getScrollPos() {
|
19
|
+
var supportPageOffset = window.pageXOffset !== undefined;
|
20
|
+
var isCSS1Compat = ((document.compatMode || "") === "CSS1Compat");
|
21
|
+
|
22
|
+
var x = supportPageOffset ? window.pageXOffset : isCSS1Compat ? document.documentElement.scrollLeft : document.body.scrollLeft;
|
23
|
+
var y = supportPageOffset ? window.pageYOffset : isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop;
|
24
|
+
|
25
|
+
return { x: x, y: y };
|
26
|
+
}
|
27
|
+
|
28
|
+
var _scrollTimer = [];
|
29
|
+
|
30
|
+
// Smooth scroll
|
31
|
+
function smoothScrollTo(y, time) {
|
32
|
+
time = time == undefined ? 500 : time;
|
33
|
+
|
34
|
+
var scrollPos = getScrollPos();
|
35
|
+
var count = 60;
|
36
|
+
var length = (y - scrollPos.y);
|
37
|
+
|
38
|
+
function easeInOut(k) {
|
39
|
+
return .5 * (Math.sin((k - .5) * Math.PI) + 1);
|
40
|
+
}
|
41
|
+
|
42
|
+
for (var i = _scrollTimer.length - 1; i >= 0; i--) {
|
43
|
+
clearTimeout(_scrollTimer[i]);
|
44
|
+
}
|
45
|
+
|
46
|
+
for (var i = 0; i <= count; i++) {
|
47
|
+
(function() {
|
48
|
+
var cur = i;
|
49
|
+
_scrollTimer[cur] = setTimeout(function() {
|
50
|
+
window.scrollTo(
|
51
|
+
scrollPos.x,
|
52
|
+
scrollPos.y + length * easeInOut(cur/count)
|
53
|
+
);
|
54
|
+
}, (time / count) * cur);
|
55
|
+
})();
|
56
|
+
}
|
57
|
+
}
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: jekyll-theme-yat
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.
|
4
|
+
version: 1.2.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- jeffreytse
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2019-09-
|
11
|
+
date: 2019-09-24 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|
@@ -166,7 +166,8 @@ files:
|
|
166
166
|
- _sass/yat/_base.scss
|
167
167
|
- _sass/yat/_layout.scss
|
168
168
|
- _sass/yat/_syntax-highlighting.scss
|
169
|
-
- assets/main.scss
|
169
|
+
- assets/css/main.scss
|
170
|
+
- assets/js/main.js
|
170
171
|
homepage: https://github.com/jeffreytse/jekyll-theme-yat
|
171
172
|
licenses:
|
172
173
|
- MIT
|