beautiful-jekyll-theme 5.0.0 → 6.0.1
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/LICENSE +1 -1
- data/README.md +46 -31
- data/_includes/cloudflare_analytics.html +8 -0
- data/_includes/commentbox.html +7 -0
- data/_includes/comments.html +2 -0
- data/_includes/footer.html +6 -1
- data/_includes/giscus-comment.html +16 -0
- data/_includes/google_analytics.html +12 -0
- data/_includes/head.html +8 -5
- data/_includes/header.html +6 -6
- data/_includes/nav.html +19 -3
- data/_includes/search.html +39 -0
- data/_includes/social-networks-links.html +80 -4
- data/_includes/social-share.html +9 -1
- data/_layouts/base.html +1 -1
- data/_layouts/home.html +74 -66
- data/_layouts/post.html +2 -2
- data/assets/css/beautifuljekyll.css +167 -45
- data/assets/img/install-steps.gif +0 -0
- data/assets/js/beautifuljekyll.js +42 -14
- data/assets/js/staticman.js +39 -28
- data/feed.xml +2 -2
- data/staticman.yml +1 -1
- data/tags.html +1 -1
- metadata +27 -9
data/_layouts/home.html
CHANGED
|
@@ -6,88 +6,96 @@ layout: page
|
|
|
6
6
|
|
|
7
7
|
{% assign posts = paginator.posts | default: site.posts %}
|
|
8
8
|
|
|
9
|
-
|
|
9
|
+
<!-- role="list" needed so that `list-style: none` in Safari doesn't remove the list semantics -->
|
|
10
|
+
<ul class="posts-list list-unstyled" role="list">
|
|
10
11
|
{% for post in posts %}
|
|
11
|
-
<
|
|
12
|
+
<li class="post-preview">
|
|
13
|
+
<article>
|
|
12
14
|
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
15
|
+
{%- capture thumbnail -%}
|
|
16
|
+
{% if post.thumbnail-img %}
|
|
17
|
+
{{ post.thumbnail-img }}
|
|
18
|
+
{% elsif post.cover-img %}
|
|
19
|
+
{% if post.cover-img.first %}
|
|
20
|
+
{{ post.cover-img[0].first.first }}
|
|
21
|
+
{% else %}
|
|
22
|
+
{{ post.cover-img }}
|
|
23
|
+
{% endif %}
|
|
19
24
|
{% else %}
|
|
20
|
-
{{ post.cover-img }}
|
|
21
25
|
{% endif %}
|
|
22
|
-
{%
|
|
26
|
+
{% endcapture %}
|
|
27
|
+
{% assign thumbnail=thumbnail | strip %}
|
|
28
|
+
|
|
29
|
+
{% if site.feed_show_excerpt == false %}
|
|
30
|
+
{% if thumbnail != "" %}
|
|
31
|
+
<div class="post-image post-image-normal">
|
|
32
|
+
<a href="{{ post.url | absolute_url }}" aria-label="Thumbnail">
|
|
33
|
+
<img src="{{ thumbnail | absolute_url }}" alt="Post thumbnail">
|
|
34
|
+
</a>
|
|
35
|
+
</div>
|
|
36
|
+
{% endif %}
|
|
23
37
|
{% endif %}
|
|
24
|
-
{% endcapture %}
|
|
25
|
-
{% assign thumbnail=thumbnail | strip %}
|
|
26
38
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
39
|
+
<a href="{{ post.url | absolute_url }}">
|
|
40
|
+
<h2 class="post-title">{{ post.title | strip_html }}</h2>
|
|
41
|
+
|
|
42
|
+
{% if post.subtitle %}
|
|
43
|
+
<h3 class="post-subtitle">
|
|
44
|
+
{{ post.subtitle | strip_html }}
|
|
45
|
+
</h3>
|
|
46
|
+
{% endif %}
|
|
32
47
|
</a>
|
|
33
|
-
</div>
|
|
34
|
-
{% endif %}
|
|
35
|
-
{% endif %}
|
|
36
48
|
|
|
37
|
-
|
|
38
|
-
|
|
49
|
+
<p class="post-meta">
|
|
50
|
+
{% assign date_format = site.date_format | default: "%B %-d, %Y" %}
|
|
51
|
+
Posted on {{ post.date | date: date_format }}
|
|
52
|
+
</p>
|
|
39
53
|
|
|
40
|
-
{% if
|
|
41
|
-
|
|
42
|
-
{{ post.
|
|
43
|
-
|
|
54
|
+
{% if thumbnail != "" %}
|
|
55
|
+
<div class="post-image post-image-small">
|
|
56
|
+
<a href="{{ post.url | absolute_url }}" aria-label="Thumbnail">
|
|
57
|
+
<img src="{{ thumbnail | absolute_url }}" alt="Post thumbnail">
|
|
58
|
+
</a>
|
|
59
|
+
</div>
|
|
44
60
|
{% endif %}
|
|
45
|
-
</a>
|
|
46
|
-
|
|
47
|
-
<p class="post-meta">
|
|
48
|
-
{% assign date_format = site.date_format | default: "%B %-d, %Y" %}
|
|
49
|
-
Posted on {{ post.date | date: date_format }}
|
|
50
|
-
</p>
|
|
51
61
|
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
<
|
|
55
|
-
<
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
62
|
+
{% unless site.feed_show_excerpt == false %}
|
|
63
|
+
{% if thumbnail != "" %}
|
|
64
|
+
<div class="post-image post-image-short">
|
|
65
|
+
<a href="{{ post.url | absolute_url }}" aria-label="Thumbnail">
|
|
66
|
+
<img src="{{ thumbnail | absolute_url }}" alt="Post thumbnail">
|
|
67
|
+
</a>
|
|
68
|
+
</div>
|
|
69
|
+
{% endif %}
|
|
59
70
|
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
71
|
+
<div class="post-entry">
|
|
72
|
+
{% assign excerpt_length = site.excerpt_length | default: 50 %}
|
|
73
|
+
{{ post.excerpt | strip_html | truncatewords: excerpt_length }}
|
|
74
|
+
{% assign excerpt_word_count = post.excerpt | number_of_words %}
|
|
75
|
+
{% if post.content != post.excerpt or excerpt_word_count > excerpt_length %}
|
|
76
|
+
<a href="{{ post.url | absolute_url }}" class="post-read-more">[Read More]</a>
|
|
77
|
+
{% endif %}
|
|
78
|
+
</div>
|
|
79
|
+
{% endunless %}
|
|
68
80
|
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
81
|
+
{% if site.feed_show_tags != false and post.tags.size > 0 %}
|
|
82
|
+
<div class="blog-tags">
|
|
83
|
+
<span>Tags:</span>
|
|
84
|
+
<!-- role="list" needed so that `list-style: none` in Safari doesn't remove the list semantics -->
|
|
85
|
+
<ul class="d-inline list-inline" role="list">
|
|
86
|
+
{% for tag in post.tags %}
|
|
87
|
+
<li class="list-inline-item">
|
|
88
|
+
<a href="{{ '/tags' | absolute_url }}#{{- tag -}}">{{- tag -}}</a>
|
|
89
|
+
</li>
|
|
90
|
+
{% endfor %}
|
|
91
|
+
</ul>
|
|
92
|
+
</div>
|
|
75
93
|
{% endif %}
|
|
76
|
-
</div>
|
|
77
|
-
{% endunless %}
|
|
78
94
|
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
<span>Tags:</span>
|
|
82
|
-
{% for tag in post.tags %}
|
|
83
|
-
<a href="{{ '/tags' | absolute_url }}#{{- tag -}}">{{- tag -}}</a>
|
|
84
|
-
{% endfor %}
|
|
85
|
-
</div>
|
|
86
|
-
{% endif %}
|
|
87
|
-
|
|
88
|
-
</article>
|
|
95
|
+
</article>
|
|
96
|
+
</li>
|
|
89
97
|
{% endfor %}
|
|
90
|
-
</
|
|
98
|
+
</ul>
|
|
91
99
|
|
|
92
100
|
{% if paginator.total_pages > 1 %}
|
|
93
101
|
<ul class="pagination main-pager">
|
data/_layouts/post.html
CHANGED
|
@@ -67,12 +67,12 @@ layout: base
|
|
|
67
67
|
<ul class="pagination blog-pager">
|
|
68
68
|
{% if page.previous.url %}
|
|
69
69
|
<li class="page-item previous">
|
|
70
|
-
<a class="page-link" href="{{ page.previous.url | relative_url }}" data-toggle="tooltip" data-placement="top" title="{{page.previous.title}}">← Previous Post</a>
|
|
70
|
+
<a class="page-link" href="{{ page.previous.url | relative_url }}" data-toggle="tooltip" data-placement="top" title="{{page.previous.title | strip_html | xml_escape}}">← Previous Post</a>
|
|
71
71
|
</li>
|
|
72
72
|
{% endif %}
|
|
73
73
|
{% if page.next.url %}
|
|
74
74
|
<li class="page-item next">
|
|
75
|
-
<a class="page-link" href="{{ page.next.url | relative_url }}" data-toggle="tooltip" data-placement="top" title="{{page.next.title}}">Next Post →</a>
|
|
75
|
+
<a class="page-link" href="{{ page.next.url | relative_url }}" data-toggle="tooltip" data-placement="top" title="{{page.next.title | strip_html | xml_escape}}">Next Post →</a>
|
|
76
76
|
</li>
|
|
77
77
|
{% endif %}
|
|
78
78
|
</ul>
|
|
@@ -20,6 +20,7 @@ body {
|
|
|
20
20
|
background-image: url({{ site.page-img | relative_url }});
|
|
21
21
|
background-attachment: fixed;
|
|
22
22
|
{% endif %}
|
|
23
|
+
overflow-wrap: break-word;
|
|
23
24
|
}
|
|
24
25
|
p {
|
|
25
26
|
line-height: 1.5;
|
|
@@ -75,35 +76,26 @@ hr.small {
|
|
|
75
76
|
margin: -3.125rem 0 0;
|
|
76
77
|
}
|
|
77
78
|
|
|
78
|
-
.main-content {
|
|
79
|
-
padding-top: 5rem;
|
|
80
|
-
}
|
|
81
|
-
@media (min-width: 768px) {
|
|
82
|
-
.main-content {
|
|
83
|
-
padding-top: 8.125rem;
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
|
|
87
79
|
.hideme {
|
|
88
80
|
display: none;
|
|
89
81
|
}
|
|
90
82
|
|
|
91
83
|
::-moz-selection {
|
|
92
|
-
color:
|
|
84
|
+
color: #fff;
|
|
93
85
|
text-shadow: none;
|
|
94
86
|
background-color: {{ site.hover-col | default: "#0085A1" }};
|
|
95
87
|
}
|
|
96
88
|
::selection {
|
|
97
|
-
color:
|
|
89
|
+
color: #fff;
|
|
98
90
|
text-shadow: none;
|
|
99
91
|
background-color: {{ site.hover-col | default: "#0085A1" }};
|
|
100
92
|
}
|
|
101
93
|
img::selection {
|
|
102
|
-
color:
|
|
94
|
+
color: #fff;
|
|
103
95
|
background: transparent;
|
|
104
96
|
}
|
|
105
97
|
img::-moz-selection {
|
|
106
|
-
color:
|
|
98
|
+
color: #fff;
|
|
107
99
|
background: transparent;
|
|
108
100
|
}
|
|
109
101
|
|
|
@@ -138,9 +130,9 @@ img {
|
|
|
138
130
|
background-image: url({{ site.navbar-img | relative_url }});
|
|
139
131
|
background-attachment: fixed;
|
|
140
132
|
{% endif %}
|
|
141
|
-
-webkit-transition:
|
|
142
|
-
-moz-transition:
|
|
143
|
-
transition:
|
|
133
|
+
-webkit-transition: padding .5s ease-in-out;
|
|
134
|
+
-moz-transition: padding .5s ease-in-out;
|
|
135
|
+
transition: padding .5s ease-in-out;
|
|
144
136
|
}
|
|
145
137
|
|
|
146
138
|
.navbar-custom,
|
|
@@ -182,15 +174,6 @@ img {
|
|
|
182
174
|
height: 2.5rem;
|
|
183
175
|
}
|
|
184
176
|
|
|
185
|
-
.navbar-custom .navbar-brand:hover,
|
|
186
|
-
.navbar-custom .navbar-brand:focus ,
|
|
187
|
-
.navbar-custom .navbar-nav .nav-link:hover,
|
|
188
|
-
.navbar-custom .navbar-nav .nav-link:focus,
|
|
189
|
-
.navbar-custom .navbar-nav .dropdown-item:hover,
|
|
190
|
-
.navbar-custom .navbar-nav .dropdown-item:focus {
|
|
191
|
-
color: {{ site.hover-col | default: "#0085A1" }};
|
|
192
|
-
}
|
|
193
|
-
|
|
194
177
|
.navbar-custom .navbar-nav .nav-item {
|
|
195
178
|
text-transform: uppercase;
|
|
196
179
|
font-size: 0.8125rem;
|
|
@@ -228,7 +211,7 @@ img {
|
|
|
228
211
|
border-width: 0.4em;
|
|
229
212
|
}
|
|
230
213
|
|
|
231
|
-
@media (min-width:
|
|
214
|
+
@media (min-width: 1200px) {
|
|
232
215
|
.navbar-custom {
|
|
233
216
|
padding-top: 1.25rem;
|
|
234
217
|
padding-bottom: 1.25rem;
|
|
@@ -243,17 +226,17 @@ img {
|
|
|
243
226
|
height: 3.125rem;
|
|
244
227
|
}
|
|
245
228
|
|
|
246
|
-
.navbar-expand-
|
|
229
|
+
.navbar-expand-xl .navbar-nav .nav-link {
|
|
247
230
|
padding-left: 0.9375rem;
|
|
248
231
|
padding-right: 0.9375rem;
|
|
249
232
|
}
|
|
250
233
|
|
|
251
|
-
.navbar-expand-
|
|
234
|
+
.navbar-expand-xl .navbar-nav .nav-item:not(.dropdown):last-child .nav-link {
|
|
252
235
|
padding-right: 0;
|
|
253
236
|
}
|
|
254
237
|
}
|
|
255
238
|
|
|
256
|
-
@media (min-width:
|
|
239
|
+
@media (min-width: 1200px) {
|
|
257
240
|
.navbar-custom .nav-item.dropdown:hover {
|
|
258
241
|
background: rgba(0, 0, 0, 0.1);
|
|
259
242
|
}
|
|
@@ -264,24 +247,31 @@ img {
|
|
|
264
247
|
}
|
|
265
248
|
|
|
266
249
|
.navbar-custom .nav-item.dropdown .dropdown-menu {
|
|
267
|
-
min-width: 0;
|
|
268
250
|
margin-top: 0;
|
|
269
251
|
font-size: 1em;
|
|
270
252
|
border: 0;
|
|
271
253
|
padding: 0;
|
|
254
|
+
{% if site.navbar-var-length %}
|
|
255
|
+
min-width: 100%;
|
|
256
|
+
{% else %}
|
|
257
|
+
min-width: 0;
|
|
272
258
|
width: 100%;
|
|
273
259
|
word-break: break-word;
|
|
260
|
+
{% endif %}
|
|
274
261
|
}
|
|
262
|
+
|
|
275
263
|
.navbar-custom .nav-item.dropdown .dropdown-menu .dropdown-item {
|
|
276
|
-
white-space: normal;
|
|
277
264
|
padding: 0.625rem;
|
|
278
265
|
background-color: {{ site.navbar-col | default: "#EAEAEA" }};
|
|
279
266
|
text-decoration: none !important;
|
|
280
|
-
border-width: 0 1px 1px 1px;
|
|
281
267
|
font-weight: normal;
|
|
268
|
+
color: {{ site.navbar-text-col | default: "#404040" }};
|
|
269
|
+
{% unless site.navbar-var-length %}
|
|
270
|
+
white-space: normal;
|
|
271
|
+
{% endunless %}
|
|
282
272
|
}
|
|
283
273
|
|
|
284
|
-
@media (min-width:
|
|
274
|
+
@media (min-width: 1200px) {
|
|
285
275
|
.navbar-custom .nav-item.dropdown .dropdown-menu {
|
|
286
276
|
text-align: center;
|
|
287
277
|
}
|
|
@@ -291,9 +281,13 @@ img {
|
|
|
291
281
|
border: 1px solid {{ site.navbar-border-col | default: "#DDDDDD" }};
|
|
292
282
|
border-width: 0 1px 1px;
|
|
293
283
|
}
|
|
284
|
+
|
|
285
|
+
.navbar-custom .nav-item.dropdown .dropdown-menu .dropdown-item:first-child {
|
|
286
|
+
border-top-width: 1px;
|
|
287
|
+
}
|
|
294
288
|
}
|
|
295
289
|
|
|
296
|
-
@media (max-width:
|
|
290
|
+
@media (max-width: 1199px) {
|
|
297
291
|
.navbar-custom .navbar-collapse {
|
|
298
292
|
border-top: 1px solid {{ site.navbar-border-col | default: "#DDDDDD" }};
|
|
299
293
|
margin: 0 -1rem;
|
|
@@ -315,12 +309,20 @@ img {
|
|
|
315
309
|
padding-left: 2rem;
|
|
316
310
|
}
|
|
317
311
|
}
|
|
312
|
+
.navbar-custom .navbar-brand:hover,
|
|
313
|
+
.navbar-custom .navbar-brand:focus ,
|
|
314
|
+
.navbar-custom .navbar-nav .nav-link:hover,
|
|
315
|
+
.navbar-custom .navbar-nav .nav-link:focus,
|
|
316
|
+
.navbar-custom .navbar-nav .dropdown-menu .dropdown-item:hover,
|
|
317
|
+
.navbar-custom .navbar-nav .dropdown-menu .dropdown-item:focus {
|
|
318
|
+
color: {{ site.hover-col | default: "#0085A1" }};
|
|
319
|
+
}
|
|
318
320
|
|
|
319
321
|
.navbar-custom .avatar-container {
|
|
320
322
|
position: absolute;
|
|
321
323
|
left: 50%;
|
|
322
324
|
width: 3.125rem;
|
|
323
|
-
|
|
325
|
+
bottom: -1.5rem;
|
|
324
326
|
transition: opacity 0.5s ease-in-out;
|
|
325
327
|
-webkit-transition: opacity 0.5s ease-in-out;
|
|
326
328
|
-moz-transition: opacity 0.5s ease-in-out;
|
|
@@ -355,9 +357,10 @@ img {
|
|
|
355
357
|
display: none;
|
|
356
358
|
}
|
|
357
359
|
|
|
358
|
-
@media (min-width:
|
|
360
|
+
@media (min-width: 1200px) {
|
|
359
361
|
.navbar-custom.top-nav-regular .avatar-container {
|
|
360
362
|
width: 6.25rem;
|
|
363
|
+
bottom: -1.9375rem;
|
|
361
364
|
}
|
|
362
365
|
|
|
363
366
|
.navbar-custom.top-nav-regular .avatar-container .avatar-img-border {
|
|
@@ -396,6 +399,11 @@ footer a {
|
|
|
396
399
|
color: {{ site.footer-link-col | default: "#404040" }};
|
|
397
400
|
}
|
|
398
401
|
|
|
402
|
+
footer a:hover,
|
|
403
|
+
footer a:focus {
|
|
404
|
+
color: {{ site.footer-hover-col | default: "#0085A1" }};
|
|
405
|
+
}
|
|
406
|
+
|
|
399
407
|
footer .list-inline {
|
|
400
408
|
margin: 0;
|
|
401
409
|
padding: 0;
|
|
@@ -434,6 +442,10 @@ footer .footer-custom-content {
|
|
|
434
442
|
|
|
435
443
|
/* --- Post preview (feed) --- */
|
|
436
444
|
|
|
445
|
+
.posts-list {
|
|
446
|
+
margin: 0;
|
|
447
|
+
}
|
|
448
|
+
|
|
437
449
|
.post-preview {
|
|
438
450
|
padding: 1.25rem 0;
|
|
439
451
|
border-bottom: 1px solid #eee;
|
|
@@ -501,14 +513,14 @@ footer .footer-custom-content {
|
|
|
501
513
|
width: 12rem;
|
|
502
514
|
}
|
|
503
515
|
.post-preview .post-image {
|
|
504
|
-
filter: grayscale(
|
|
516
|
+
filter: grayscale(40%);
|
|
505
517
|
}
|
|
506
518
|
.post-preview .post-image:hover {
|
|
507
519
|
filter: grayscale(0%);
|
|
508
520
|
}
|
|
509
521
|
.post-preview .post-image img {
|
|
510
|
-
height: 100%;
|
|
511
|
-
width: 100%;
|
|
522
|
+
max-height: 100%;
|
|
523
|
+
max-width: 100%;
|
|
512
524
|
}
|
|
513
525
|
.post-preview .post-image-short {
|
|
514
526
|
margin-top: -2.1875rem;
|
|
@@ -529,8 +541,8 @@ footer .footer-custom-content {
|
|
|
529
541
|
display: none;
|
|
530
542
|
}
|
|
531
543
|
.post-preview .post-image-small img {
|
|
532
|
-
width: 6.25rem;
|
|
533
|
-
height: 6.25rem;
|
|
544
|
+
max-width: 6.25rem;
|
|
545
|
+
max-height: 6.25rem;
|
|
534
546
|
}
|
|
535
547
|
@media (max-width: 500px) {
|
|
536
548
|
.post-preview .post-image {
|
|
@@ -556,7 +568,7 @@ footer .footer-custom-content {
|
|
|
556
568
|
.blog-tags {
|
|
557
569
|
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
558
570
|
font-size: 0.9375rem;
|
|
559
|
-
margin
|
|
571
|
+
margin: 1.875rem 0;
|
|
560
572
|
}
|
|
561
573
|
|
|
562
574
|
.blog-tags span {
|
|
@@ -564,6 +576,10 @@ footer .footer-custom-content {
|
|
|
564
576
|
opacity: 0.8;
|
|
565
577
|
}
|
|
566
578
|
|
|
579
|
+
.blog-tags .list-inline-item {
|
|
580
|
+
margin-right: 0;
|
|
581
|
+
}
|
|
582
|
+
|
|
567
583
|
.blog-tags a {
|
|
568
584
|
color: {{ site.text-col | default: "#404040" }};
|
|
569
585
|
text-decoration: none;
|
|
@@ -701,7 +717,7 @@ nav.top-nav-short-permanent ~ header > .intro-header.big-img {
|
|
|
701
717
|
bottom: 0;
|
|
702
718
|
display: none;
|
|
703
719
|
}
|
|
704
|
-
@media (min-width:
|
|
720
|
+
@media (min-width: 1200px) {
|
|
705
721
|
.intro-header {
|
|
706
722
|
margin-top: 8.125rem;
|
|
707
723
|
}
|
|
@@ -883,7 +899,9 @@ pre {
|
|
|
883
899
|
.highlight > pre:not([class~="highlight"]) { /* code block with line number */
|
|
884
900
|
padding: 0;
|
|
885
901
|
}
|
|
886
|
-
.highlight table,
|
|
902
|
+
.highlight table,
|
|
903
|
+
.highlight tr,
|
|
904
|
+
.highlight td { /* to be removed after fixing table styles */
|
|
887
905
|
border: none;
|
|
888
906
|
background: none;
|
|
889
907
|
padding: 0;
|
|
@@ -924,7 +942,10 @@ pre {
|
|
|
924
942
|
}
|
|
925
943
|
|
|
926
944
|
/* --- Notification boxes --- */
|
|
927
|
-
.box-note,
|
|
945
|
+
.box-note,
|
|
946
|
+
.box-warning,
|
|
947
|
+
.box-error,
|
|
948
|
+
.box-success {
|
|
928
949
|
padding: 0.9375rem 0.9375rem 0.9375rem 0.625rem;
|
|
929
950
|
margin: 1.25rem 1.25rem 1.25rem 0.3125rem;
|
|
930
951
|
border: 1px solid #eee;
|
|
@@ -996,3 +1017,104 @@ pre {
|
|
|
996
1017
|
display: block;
|
|
997
1018
|
margin: 0 auto;
|
|
998
1019
|
}
|
|
1020
|
+
|
|
1021
|
+
/* Search bar */
|
|
1022
|
+
#beautifuljekyll-search-overlay {
|
|
1023
|
+
display: none;
|
|
1024
|
+
z-index: 999999;
|
|
1025
|
+
position: fixed;
|
|
1026
|
+
background: rgba(0,0,0,0.9);
|
|
1027
|
+
left: 0;
|
|
1028
|
+
right: 0;
|
|
1029
|
+
top: 0;
|
|
1030
|
+
bottom: 0;
|
|
1031
|
+
text-align: center;
|
|
1032
|
+
padding: 1rem;
|
|
1033
|
+
}
|
|
1034
|
+
#nav-search-exit {
|
|
1035
|
+
position: absolute;
|
|
1036
|
+
top: 1.5rem;
|
|
1037
|
+
cursor: pointer;
|
|
1038
|
+
right: 25%;
|
|
1039
|
+
margin-right: 2rem;
|
|
1040
|
+
color: #555;
|
|
1041
|
+
font-size: 2rem;
|
|
1042
|
+
line-height: 2rem;
|
|
1043
|
+
font-weight: bold;
|
|
1044
|
+
}
|
|
1045
|
+
#nav-search-exit:hover {
|
|
1046
|
+
color: #000;
|
|
1047
|
+
}
|
|
1048
|
+
#nav-search-input {
|
|
1049
|
+
text-align: center;
|
|
1050
|
+
background: #e7edee;
|
|
1051
|
+
margin: auto;
|
|
1052
|
+
display: block;
|
|
1053
|
+
font-size: 2rem;
|
|
1054
|
+
width: 50%;
|
|
1055
|
+
transition: width 300ms ease;
|
|
1056
|
+
color: #222;
|
|
1057
|
+
border-radius: 5rem;
|
|
1058
|
+
outline: none;
|
|
1059
|
+
border: none;
|
|
1060
|
+
padding: 0 3rem;
|
|
1061
|
+
}
|
|
1062
|
+
@media (max-width: 1199px) {
|
|
1063
|
+
#nav-search-input {
|
|
1064
|
+
width: 75%;
|
|
1065
|
+
}
|
|
1066
|
+
#nav-search-exit {
|
|
1067
|
+
right: 12.5%;
|
|
1068
|
+
}
|
|
1069
|
+
}
|
|
1070
|
+
@media (max-width: 767px) {
|
|
1071
|
+
#nav-search-input {
|
|
1072
|
+
width: 100%;
|
|
1073
|
+
}
|
|
1074
|
+
#nav-search-exit {
|
|
1075
|
+
right: 0;
|
|
1076
|
+
}
|
|
1077
|
+
}
|
|
1078
|
+
#nav-search-input:focus {
|
|
1079
|
+
background: #f3f8fe;
|
|
1080
|
+
box-shadow: 0px 0.15rem 1rem #e7f4ff;
|
|
1081
|
+
outline: none;
|
|
1082
|
+
}
|
|
1083
|
+
|
|
1084
|
+
#nav-search-input::placeholder {
|
|
1085
|
+
color: #777;
|
|
1086
|
+
}
|
|
1087
|
+
|
|
1088
|
+
#search-results-container {
|
|
1089
|
+
list-style: none;
|
|
1090
|
+
padding-left: unset;
|
|
1091
|
+
margin-top: 1.5rem;
|
|
1092
|
+
color: #fff;
|
|
1093
|
+
font-size: 1.5rem;
|
|
1094
|
+
max-height: calc(100vh - 6.5rem);
|
|
1095
|
+
overflow-y: auto;
|
|
1096
|
+
}
|
|
1097
|
+
#search-results-container a {
|
|
1098
|
+
color: #fff;
|
|
1099
|
+
text-decoration: none;
|
|
1100
|
+
}
|
|
1101
|
+
#search-results-container a:hover {
|
|
1102
|
+
color: #fff;
|
|
1103
|
+
text-decoration: underline;
|
|
1104
|
+
}
|
|
1105
|
+
|
|
1106
|
+
#nav-search-icon {
|
|
1107
|
+
display: inline-block;
|
|
1108
|
+
}
|
|
1109
|
+
#nav-search-text {
|
|
1110
|
+
display: none;
|
|
1111
|
+
}
|
|
1112
|
+
|
|
1113
|
+
@media (max-width: 1199px) {
|
|
1114
|
+
#nav-search-icon {
|
|
1115
|
+
display: none;
|
|
1116
|
+
}
|
|
1117
|
+
#nav-search-text {
|
|
1118
|
+
display: inline-block;
|
|
1119
|
+
}
|
|
1120
|
+
}
|
|
Binary file
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
// Dean Attali / Beautiful Jekyll
|
|
1
|
+
// Dean Attali / Beautiful Jekyll 2023
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
let BeautifulJekyllJS = {
|
|
4
4
|
|
|
5
5
|
bigImgEl : null,
|
|
6
6
|
numImgs : null,
|
|
@@ -27,6 +27,8 @@ var BeautifulJekyllJS = {
|
|
|
27
27
|
|
|
28
28
|
// show the big header image
|
|
29
29
|
BeautifulJekyllJS.initImgs();
|
|
30
|
+
|
|
31
|
+
BeautifulJekyllJS.initSearch();
|
|
30
32
|
},
|
|
31
33
|
|
|
32
34
|
initNavbar : function() {
|
|
@@ -39,6 +41,8 @@ var BeautifulJekyllJS = {
|
|
|
39
41
|
) / 1000);
|
|
40
42
|
if (brightness <= 125) {
|
|
41
43
|
$(".navbar").removeClass("navbar-light").addClass("navbar-dark");
|
|
44
|
+
} else {
|
|
45
|
+
$(".navbar").removeClass("navbar-dark").addClass("navbar-light");
|
|
42
46
|
}
|
|
43
47
|
},
|
|
44
48
|
|
|
@@ -50,23 +54,23 @@ var BeautifulJekyllJS = {
|
|
|
50
54
|
|
|
51
55
|
// 2fc73a3a967e97599c9763d05e564189
|
|
52
56
|
// set an initial image
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
57
|
+
const imgInfo = BeautifulJekyllJS.getImgInfo();
|
|
58
|
+
const src = imgInfo.src;
|
|
59
|
+
const desc = imgInfo.desc;
|
|
56
60
|
BeautifulJekyllJS.setImg(src, desc);
|
|
57
61
|
|
|
58
62
|
// For better UX, prefetch the next image so that it will already be loaded when we want to show it
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
+
const getNextImg = function() {
|
|
64
|
+
const imgInfo = BeautifulJekyllJS.getImgInfo();
|
|
65
|
+
const src = imgInfo.src;
|
|
66
|
+
const desc = imgInfo.desc;
|
|
63
67
|
|
|
64
|
-
|
|
68
|
+
const prefetchImg = new Image();
|
|
65
69
|
prefetchImg.src = src;
|
|
66
70
|
// if I want to do something once the image is ready: `prefetchImg.onload = function(){}`
|
|
67
71
|
|
|
68
72
|
setTimeout(function(){
|
|
69
|
-
|
|
73
|
+
const img = $("<div></div>").addClass("big-img-transition").css("background-image", 'url(' + src + ')');
|
|
70
74
|
$(".intro-header.big-img").prepend(img);
|
|
71
75
|
setTimeout(function(){ img.css("opacity", "1"); }, 50);
|
|
72
76
|
|
|
@@ -89,9 +93,9 @@ var BeautifulJekyllJS = {
|
|
|
89
93
|
},
|
|
90
94
|
|
|
91
95
|
getImgInfo : function() {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
96
|
+
const randNum = Math.floor((Math.random() * BeautifulJekyllJS.numImgs) + 1);
|
|
97
|
+
const src = BeautifulJekyllJS.bigImgEl.attr("data-img-src-" + randNum);
|
|
98
|
+
const desc = BeautifulJekyllJS.bigImgEl.attr("data-img-desc-" + randNum);
|
|
95
99
|
|
|
96
100
|
return {
|
|
97
101
|
src : src,
|
|
@@ -106,6 +110,30 @@ var BeautifulJekyllJS = {
|
|
|
106
110
|
} else {
|
|
107
111
|
$(".img-desc").hide();
|
|
108
112
|
}
|
|
113
|
+
},
|
|
114
|
+
|
|
115
|
+
initSearch : function() {
|
|
116
|
+
if (!document.getElementById("beautifuljekyll-search-overlay")) {
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
$("#nav-search-link").click(function(e) {
|
|
121
|
+
e.preventDefault();
|
|
122
|
+
$("#beautifuljekyll-search-overlay").show();
|
|
123
|
+
$("#nav-search-input").focus().select();
|
|
124
|
+
$("body").addClass("overflow-hidden");
|
|
125
|
+
});
|
|
126
|
+
$("#nav-search-exit").click(function(e) {
|
|
127
|
+
e.preventDefault();
|
|
128
|
+
$("#beautifuljekyll-search-overlay").hide();
|
|
129
|
+
$("body").removeClass("overflow-hidden");
|
|
130
|
+
});
|
|
131
|
+
$(document).on('keyup', function(e) {
|
|
132
|
+
if (e.key == "Escape") {
|
|
133
|
+
$("#beautifuljekyll-search-overlay").hide();
|
|
134
|
+
$("body").removeClass("overflow-hidden");
|
|
135
|
+
}
|
|
136
|
+
});
|
|
109
137
|
}
|
|
110
138
|
};
|
|
111
139
|
|