jekyll-theme-prologue 0.2.4 → 0.2.5
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +26 -19
- data/_config.yml +9 -8
- data/_includes/header.html +1 -1
- data/_includes/section.html +2 -1
- data/_layouts/home.html +18 -16
- data/_sass/jekyll-theme-prologue.scss +14 -4
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: b86b82ae01213016cb29c9ed5c93b1f2db04c6b3
|
|
4
|
+
data.tar.gz: '09b67933da31dbc55b68b7a3300cc5f0be6d4e86'
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 81416c9bba4a2139ba34e13fc401f92e9a723d6d42eb7d14241f747503c60048a52d2b2979cd049533df49a87af9a56888fce993a08d025acfff50c7a17b80fd
|
|
7
|
+
data.tar.gz: 72dfcdd5e0ba6b6b0064dbfd9d765d9a454fabc974460ae331c07fab5928bfa84c6976543c1aca12ad1e1f33ae0b5010685902221a97036feea6a02fe7ab0fc8
|
data/README.md
CHANGED
|
@@ -1,14 +1,24 @@
|
|
|
1
1
|
# Prologue - Jekyll Theme
|
|
2
|
-
|
|
2
|
+
|
|
3
|
+
(Actively maintained, expect some changes)
|
|
3
4
|
|
|
4
5
|
[](https://badge.fury.io/rb/jekyll-theme-prologue)
|
|
5
6
|
|
|
6
7
|
|
|
7
8
|
|
|
8
|
-
|
|
9
|
+
This is Prologue, a simple, single page responsive site template from [HTML5 UP](https://html5up.net/prologue), now available as a Jekyll theme from [Chris Bobbe](https://chrisbobbe.github.io). It features a clean, minimalistic design and a sticky sidebar with navigation-linked scrolling.
|
|
9
10
|
|
|
10
11
|
**Demo**: https://chrisbobbe.github.io/jekyll-theme-prologue/
|
|
11
12
|
|
|
13
|
+
# Added Features
|
|
14
|
+
|
|
15
|
+
* **[Formspree.io](https://formspree.io/) contact form integration** - just add your email to the `_config.yml` and it works!
|
|
16
|
+
* Set a cover photo for any of your sections (not just the first), with alt text for screen readers and SEO
|
|
17
|
+
* Add your **social profiles** easily in `_config.yml`. Only the social profiles buttons you enter in `config.yml` will show up on the site footer.
|
|
18
|
+
* Search engine optimization (SEO) meta tags based on info you provide in `_config.yml` and frontmatter
|
|
19
|
+
* Google Analytics built-in; just put your [Tracking ID](https://support.google.com/analytics/answer/1008080?hl=en) in `_config.yml` as `google_analytics`
|
|
20
|
+
* Custom 404 page (called 404.html; to activate, move it to your project directory).
|
|
21
|
+
|
|
12
22
|
# How to Use
|
|
13
23
|
|
|
14
24
|
There are two ways to get started:
|
|
@@ -16,33 +26,30 @@ There are two ways to get started:
|
|
|
16
26
|
1. **Install the [jekyll-theme-prologue gem](https://rubygems.org/gems/jekyll-theme-prologue).** Instructions are in the [Jekyll docs](https://jekyllrb.com/docs/themes/#installing-a-theme). After running `bundle install`, you can find the theme files by running `open $(bundle show jekyll-theme-prologue)`. A sample working `_config.yml` file ships with the gem; if you want to activate it, move it to your project's root directory. It will do nothing until you move it there, replacing the default `_config.yml` file.
|
|
17
27
|
2. **Fork the [GitHub repository](https://github.com/chrisbobbe/jekyll-theme-prologue).** If you want to use [GitHub Pages](https://pages.github.com/), create a branch named `gh-pages`, and replace `theme: jekyll-theme-prologue` with `remote_theme: chrisbobbe/jekyll-theme-prologue` in the provided `_config.yml` ([GitHub Pages now supports open-source themes on GitHub](https://github.com/blog/2464-use-any-theme-with-github-pages)).
|
|
18
28
|
|
|
19
|
-
Make sure that `url` and `base_url` are set
|
|
29
|
+
Make sure that `url` and `base_url` are set for your own website in `_config.yml`. For local testing, make them both blank.
|
|
20
30
|
|
|
21
|
-
|
|
31
|
+
Add a photo avatar to your project, then set `avatar: path/to/your/avatar.jpg` in _config.yml; for example, `avatar: assets/images/avatar.jpg`. 48x48 pixels works best.
|
|
22
32
|
|
|
23
|
-
|
|
33
|
+
Set a cover photo in any of the sections by adding `cover-photo: path/to/photo.jpg` and `cover-photo-alt: some alt text` to the section's frontmatter. (Don't forget the alt text for screen readers; it won't work without it.)
|
|
24
34
|
|
|
25
|
-
|
|
35
|
+
## Special instructions
|
|
36
|
+
Jekyll does not support multiple layout-formatted content sections per page, and this theme is a good workaround. **Bear with me for a few instructions unique to jekyll-theme-prologue.**
|
|
26
37
|
|
|
27
|
-
|
|
38
|
+
You don't need to use Jekyll's hardcoded support for `_pages` or `_posts`, and layouts aren't provided for them. If you want to customize the templates, go to `_layouts/home.html` and `_includes/section.html` provided with the theme, but this isn't necessary.
|
|
28
39
|
|
|
29
|
-
|
|
40
|
+
1. **Your `_config.yml` file must include the following line or it will not work**: `collections: [sections]`. This tells Jekyll to look in the _sections folder (which you will create) for your content and render it all on one page.
|
|
41
|
+
|
|
42
|
+
2. **Create a `_sections` folder** in your project's root directory and start adding content. Sample content is provided in the [GitHub repository](https://github.com/chrisbobbe/jekyll-theme-prologue/tree/master/_sections).
|
|
30
43
|
|
|
31
44
|
All new sections should be added as html or Markdown documents in the `_sections` folder. The following variables can be set with [frontmatter](https://jekyllrb.com/docs/frontmatter/):
|
|
32
45
|
- `title` (required)
|
|
33
|
-
- `order` (required; orders the sequence of sections on the page.
|
|
34
|
-
- `
|
|
46
|
+
- `order` (required; orders the sequence of sections on the page. Example: `1`)
|
|
47
|
+
- `cover-photo` (optional; sets a background image for the section. Example: `assets/images/banner.jpg`)
|
|
48
|
+
- `cover-photo-alt` (required if using a cover photo. Describes the photo for screen readers; e.g., "Dome of Light art installation, Kaohsiung, Taiwan")
|
|
49
|
+
- `icon` (optional; see [Font Awesome](http://fontawesome.io/icons/) for icon codes. Example: `fa-github`)
|
|
35
50
|
- `auto-header` (optional; "use-title" is default, "none" for no header, or custom header text)
|
|
36
51
|
|
|
37
|
-
There shouldn't be a need to set `permalink`
|
|
38
|
-
|
|
39
|
-
# Added Features
|
|
40
|
-
|
|
41
|
-
* **[Formspree.io](https://formspree.io/) contact form integration** - just add your email to the `_config.yml` and it works!
|
|
42
|
-
* Add your **social profiles** easily in `_config.yml`. Only the social profiles buttons you enter in `config.yml` will show up on the site footer.
|
|
43
|
-
* Custom 404 page (called 404.html; to activate, move to your project directory).
|
|
44
|
-
* Comprehensive search engine optimization (SEO) tags based on info you provide in _config.yml
|
|
45
|
-
* Google Analytics built-in; just put your [Tracking ID](https://support.google.com/analytics/answer/1008080?hl=en) in _config.yml
|
|
52
|
+
There shouldn't be a need to set `permalink` because all content displays together in `index.html`.
|
|
46
53
|
|
|
47
54
|
# Credits
|
|
48
55
|
|
data/_config.yml
CHANGED
|
@@ -2,15 +2,15 @@
|
|
|
2
2
|
# jekyll-theme-prologue for your convenience. To use it, move it to your
|
|
3
3
|
# project's root directory. Please note that the following lines are
|
|
4
4
|
# NECESSARY for Prologue to work correctly:
|
|
5
|
-
#
|
|
5
|
+
#
|
|
6
6
|
# theme: jekyll-theme-prologue
|
|
7
7
|
# collections: [sections]
|
|
8
8
|
#
|
|
9
9
|
# They activate the theme and tell Jekyll to find your content
|
|
10
10
|
# in /_sections. Note where "sections" starts with an underscore
|
|
11
|
-
# and where it doesn't. The social settings will make links to
|
|
11
|
+
# and where it doesn't. The social settings will make links to
|
|
12
12
|
# Twitter, etc.
|
|
13
|
-
#
|
|
13
|
+
#
|
|
14
14
|
# Also, be sure to customize url and baseurl for your site.
|
|
15
15
|
#
|
|
16
16
|
# ---------------------------------------------------------------
|
|
@@ -33,15 +33,16 @@
|
|
|
33
33
|
title: Your awesome title
|
|
34
34
|
subtitle: Your awesome subtitle
|
|
35
35
|
description: >- # this means to ignore newlines until "baseurl:"
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
author: Your Incredible
|
|
36
|
+
This is the demo site for the Jekyll theme version of
|
|
37
|
+
HTML5 UP's site template Prologue. Content is all on one page
|
|
38
|
+
and it's mobile-friendly.
|
|
39
|
+
author: Your Incredible Name
|
|
40
40
|
email: your-email@example.com
|
|
41
|
+
avatar: assets/images/avatar.jpg
|
|
41
42
|
|
|
42
43
|
# You'll want to customize baseurl for your own site:
|
|
43
44
|
baseurl: "/jekyll-theme-prologue" # the subpath of your site, e.g. /blog
|
|
44
|
-
url: "" # the base hostname & protocol for your site
|
|
45
|
+
url: "https://chrisbobbe.github.io" # the base hostname & protocol for your site
|
|
45
46
|
|
|
46
47
|
# Social settings
|
|
47
48
|
facebook_url:
|
data/_includes/header.html
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
|
|
6
6
|
<!-- Logo -->
|
|
7
7
|
<div id="logo">
|
|
8
|
-
<span class="image avatar48"><img src="{{
|
|
8
|
+
<span class="image avatar48"><img src="{{ site.avatar | relative_url }}" alt="{{ site.author | default: 'unknown author' | prepend: 'Avatar of ' }}" /></span>
|
|
9
9
|
<h1 id="title">{{ site.title }}</h1>
|
|
10
10
|
<p>{{ site.subtitle }}</p>
|
|
11
11
|
</div>
|
data/_includes/section.html
CHANGED
data/_layouts/home.html
CHANGED
|
@@ -10,36 +10,40 @@
|
|
|
10
10
|
{% include head.html %}
|
|
11
11
|
|
|
12
12
|
<body>
|
|
13
|
-
|
|
13
|
+
|
|
14
14
|
{% include header.html %}
|
|
15
|
-
|
|
15
|
+
|
|
16
16
|
<!-- Main -->
|
|
17
17
|
<div id="main">
|
|
18
18
|
{% assign sections = site.sections | where_exp: 'section','section.order >= 1' %}
|
|
19
|
-
|
|
19
|
+
|
|
20
20
|
{% if page.permalink %}
|
|
21
21
|
<!-- This enables the 404 page, the only page that should
|
|
22
22
|
have a permalink declared in its frontmatter. -->
|
|
23
23
|
{% assign sections = sections | push: page %}
|
|
24
24
|
{% endif %}
|
|
25
|
-
|
|
25
|
+
|
|
26
26
|
{% unless sections == null %}
|
|
27
27
|
{% assign sections = sections | sort: 'order' %}
|
|
28
|
-
|
|
28
|
+
|
|
29
29
|
<!-- Sections -->
|
|
30
30
|
{% for section in sections %}
|
|
31
|
-
|
|
31
|
+
|
|
32
32
|
{% assign title = section.title | default: 'Untitled' %}
|
|
33
33
|
{% assign slug = section.title | slugify | default: 'untitled' %}
|
|
34
|
-
|
|
35
|
-
{% if section.
|
|
34
|
+
|
|
35
|
+
{% if section.cover-photo and section.cover-photo-alt %}
|
|
36
|
+
{% capture photo %}
|
|
37
|
+
<img src="{{ section.cover-photo | relative_url }}" alt="{{ section.cover-photo-alt }}" class="back">
|
|
38
|
+
{% endcapture %}
|
|
36
39
|
{% assign class = 'shade-one cover dark' %}
|
|
37
40
|
{% else %}
|
|
41
|
+
{% assign photo = '' %}
|
|
38
42
|
{% capture class %}
|
|
39
43
|
shade-{% cycle 'two', 'three', 'four', 'three' %}
|
|
40
44
|
{% endcapture %}
|
|
41
45
|
{% endif %}
|
|
42
|
-
|
|
46
|
+
|
|
43
47
|
{% if section.auto-header == 'none' %}
|
|
44
48
|
{% assign heading = "" %}
|
|
45
49
|
{% elsif section.auto-header == null or section.auto-header == 'use-title' %}
|
|
@@ -55,16 +59,14 @@
|
|
|
55
59
|
</header>
|
|
56
60
|
{% endcapture %}
|
|
57
61
|
{% endif %}
|
|
58
|
-
|
|
59
|
-
{% include section.html id=slug class=class heading=heading content=section.content %}
|
|
60
|
-
|
|
62
|
+
{% include section.html id=slug class=class photo=photo heading=heading content=section.content %}
|
|
61
63
|
{% endfor %}
|
|
62
|
-
|
|
64
|
+
|
|
63
65
|
{% endunless %}
|
|
64
66
|
</div>
|
|
65
|
-
|
|
67
|
+
|
|
66
68
|
{% include footer.html %}
|
|
67
|
-
|
|
69
|
+
|
|
68
70
|
</body>
|
|
69
71
|
|
|
70
|
-
</html>
|
|
72
|
+
</html>
|
|
@@ -186,7 +186,8 @@
|
|
|
186
186
|
|
|
187
187
|
> :last-child,
|
|
188
188
|
> .container,
|
|
189
|
-
&:last-child
|
|
189
|
+
&:last-child,
|
|
190
|
+
> .container > :last-child {
|
|
190
191
|
margin-bottom: 0;
|
|
191
192
|
}
|
|
192
193
|
|
|
@@ -429,6 +430,7 @@
|
|
|
429
430
|
margin-bottom: 40px;
|
|
430
431
|
|
|
431
432
|
header {
|
|
433
|
+
color: #666;
|
|
432
434
|
background: #fff;
|
|
433
435
|
margin: 0;
|
|
434
436
|
padding: 1em 0 1em 0;
|
|
@@ -648,13 +650,21 @@
|
|
|
648
650
|
|
|
649
651
|
&.cover {
|
|
650
652
|
padding: 6em 0;
|
|
651
|
-
|
|
652
|
-
|
|
653
|
+
position: relative;
|
|
654
|
+
z-index: 0;
|
|
655
|
+
img.back {
|
|
656
|
+
position: absolute;
|
|
657
|
+
object-fit: cover;
|
|
658
|
+
width: 100%;
|
|
659
|
+
height: 100%;
|
|
660
|
+
left: 0;
|
|
661
|
+
top: 0;
|
|
662
|
+
z-index: -1;
|
|
663
|
+
}
|
|
653
664
|
}
|
|
654
665
|
|
|
655
666
|
&.shade-one {
|
|
656
667
|
background-color: #81918E;
|
|
657
|
-
background-image: url('../images/banner.jpg');
|
|
658
668
|
}
|
|
659
669
|
|
|
660
670
|
&.shade-two {
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: jekyll-theme-prologue
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.2.
|
|
4
|
+
version: 0.2.5
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- HTML5 UP
|
|
@@ -9,7 +9,7 @@ authors:
|
|
|
9
9
|
autorequire:
|
|
10
10
|
bindir: bin
|
|
11
11
|
cert_chain: []
|
|
12
|
-
date: 2018-01-
|
|
12
|
+
date: 2018-01-11 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: jekyll
|