alembic-jekyll-theme 2.3.1 → 3.0.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +8 -2
- data/_includes/button.html +1 -1
- data/_includes/figure.html +2 -3
- data/_includes/icon.html +1 -1
- data/_includes/map.html +1 -3
- data/_includes/nav-header.html +2 -2
- data/_includes/nav-share.html +10 -10
- data/_includes/post-meta.html +2 -2
- data/_includes/site-aside.html +1 -1
- data/_includes/site-logo.html +1 -1
- data/_includes/site-sw.html +20 -0
- data/_includes/video.html +1 -1
- data/_layouts/default.html +4 -0
- data/_sass/_settings.scss +5 -5
- data/_sass/_theme.scss +3 -2
- data/assets/default-offline-image.png +0 -0
- data/assets/default-social-image.png +0 -0
- data/assets/logo.svg +6 -1
- data/manifest.json +17 -0
- data/sw.js +84 -0
- metadata +6 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: e8156b76ce598bbfcd7d2507b9795afe4c253fb0
|
4
|
+
data.tar.gz: 292097516426fb9ee05f40e05664520c951a84ba
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 4f0a893d8627cd9a0aa439f12360c7a410e25f2379a14be05ae73e6573d3c59045339f5639b2824172efabb85e89eb2c522099fa61eb5d8da52bfe52a36ddfd4
|
7
|
+
data.tar.gz: ff9b16318ccef1c470d02c78174ec1282bd07c41a7fe52c3ed0ff37f73ebd0818256d76ef1f406a502d2d9890d4ac10b8f701a65e4f5528e9ae9beac5211725f
|
data/README.md
CHANGED
@@ -31,6 +31,7 @@
|
|
31
31
|
- Available as a **theme gem** and **GitHub Pages** theme
|
32
32
|
- Simple and elegant design that can be used out of the box or as solid starting point
|
33
33
|
- Tested in all major browsers, including **IE and Edge**
|
34
|
+
- Built in **Service Worker** so it can work offline and on slow connections
|
34
35
|
- **Configurable colours** and typography in a single settings file
|
35
36
|
- Extensive set of **shortcodes** to include various elements; such as buttons, icons, figure images and more
|
36
37
|
- Solid **typographic framework** from [Sassline](https://sassline.com/)
|
@@ -56,6 +57,7 @@ Here are a few examples of Alembic out in the wild being used in a variety of wa
|
|
56
57
|
- [venuthatikonda.github.io](https://venuthatikonda.github.io/)
|
57
58
|
- [ccs17.bsc.es](https://ccs17.bsc.es/)
|
58
59
|
- [karateca.org](http://www.karateca.org/)
|
60
|
+
- [p-recs.github.io](https://p-recs.github.io/2018/)
|
59
61
|
|
60
62
|
## Installation
|
61
63
|
|
@@ -82,7 +84,7 @@ _(deprecated, not recommended)_
|
|
82
84
|
|
83
85
|
1. [Fork the repo](https://github.com/daviddarnes/alembic#fork-destination-box)
|
84
86
|
2. Replace the `Gemfile` with one stating all the gems used in your project
|
85
|
-
3. Delete the following unnecessary files/folders:
|
87
|
+
3. Delete the following unnecessary files/folders: `.github`, `LICENSE`, `screenshot.png`, `CNAME` and `alembic-jekyll-theme.gemspec`
|
86
88
|
4. Run the command `bundle install` in the root of project to install the jekyll remote theme gem as a dependancy
|
87
89
|
5. Run `bundle exec jekyll serve` to build and serve your site
|
88
90
|
6. Done! Use the [configuration](#configuration) documentation and the example [`_config.yml`](https://github.com/daviddarnes/alembic/blob/master/_config.yml) file to set things like the navigation, contact form and social sharing buttons
|
@@ -107,6 +109,8 @@ There are a number of optional settings for you to configure. Use the example [`
|
|
107
109
|
|
108
110
|
You'll need to change the `description`, `title` and `url` to match with the project. You'll also need to replace the `/assets/logo.svg` and `/assets/default-social-image.png` with the project logo and default social image. Setting the site language can be done with `lang`, the theme will default to `en-US`. The `email` needs to be changed to the email you want to receive contact form enquires with. The `disqus` value can be changed to your project username on [Disqus](https://disqus.com), remove this from the `/_config.yml` file if you don't want comments enabled. Look for the `Site settings` comment within the `/_config.yml` file. The `repo` setting is optional, for now, and can be removed entirely, if you wish.
|
109
111
|
|
112
|
+
By default the built in Service Worker is enabled, and will work on a 'network first' method. That is, if there is no internet connection then the content the Service Worker has cached will be used until the connection comes back. It will always look for a live version of the code first. To disable the Service Worker set an option called `serviceWorker` to false in the `/_config.yml`.
|
113
|
+
|
110
114
|
### Site navigation
|
111
115
|
|
112
116
|
There are a total of 4 different navigation types:
|
@@ -143,7 +147,8 @@ Example usage: `{% include figure.html image="/uploads/feature-image.jpg" captio
|
|
143
147
|
Available options:
|
144
148
|
- `image`: The image shown _required_
|
145
149
|
- `caption`: A caption to explain the image
|
146
|
-
- `position`: The position of the image
|
150
|
+
- `position`: The position of the image; `left`, `right` or `center`
|
151
|
+
- `width` & `height`: Optional width and height attributes of the containing image
|
147
152
|
|
148
153
|
### `icon.html`
|
149
154
|
An icon.
|
@@ -154,6 +159,7 @@ Available options:
|
|
154
159
|
- `id`: The reference for the icon _required_
|
155
160
|
- `title`: The accessible label for the icon
|
156
161
|
- `color`: The desired colour of the icon
|
162
|
+
- `width` & `height`: Width and height attributes for the icon, default is `16`
|
157
163
|
|
158
164
|
### `nav-share.html`
|
159
165
|
A set of buttons that share the current page to various social networks, which is controlled within the `_config.yml` file under the `sharing_links` keyword.
|
data/_includes/button.html
CHANGED
@@ -1 +1 @@
|
|
1
|
-
<a class="button" href="{{ include.link | default:
|
1
|
+
<a class="button" href="{{ include.link | default: '#' }}"{% if include.color %} style="background: {{ include.color }}"{% endif %}>{{ include.text | default: "Button" }}{% if include.icon %} {% include icon.html id=include.icon title=include.icon %}{% endif %}</a>
|
data/_includes/figure.html
CHANGED
@@ -1,5 +1,4 @@
|
|
1
|
-
|
2
|
-
<
|
3
|
-
{% if include.image %}<img class="image" src="{{ include.image }}" {% if altText %}alt="Image - {{ altText }}"{% endif %}>{% else %}<small>Image not found</small>{% endif%}
|
1
|
+
<figure class="figure figure--{{ include.position | default: 'center' }}">
|
2
|
+
<img class="image" src="{{ include.image }}" alt="{{ include.alt | default: include.caption }}" {{ include.width ? include.width | prepend: 'width="' | append: '"' }} {{ include.height ? include.height | prepend: 'height="' | append: '"' }}>
|
4
3
|
{% if include.caption %}<figcaption class="caption">{{ include.caption }}</figcaption>{% endif %}
|
5
4
|
</figure>
|
data/_includes/icon.html
CHANGED
@@ -1 +1 @@
|
|
1
|
-
<svg width="16" height="16" class="icon icon--{{ include.id | default: "link" }}" role="img"
|
1
|
+
<svg width="{{ include.width | default: "16" }}" height="{{ include.height | default: "16" }}" class="icon icon--{{ include.id | default: "link" }}" role="img" alt="{{ include.title | default: include.id }}"><title>{{ include.title | default: include.id }}</title><use xlink:href="#{{ include.id | default: "link" }}" fill="{{ include.color | default: 'CurrentColor' }}"></use></svg>
|
data/_includes/map.html
CHANGED
@@ -1,3 +1 @@
|
|
1
|
-
<div class="map">
|
2
|
-
{% if include.id %}<iframe src="https://www.google.com/maps/d/u/0/embed?mid={{ include.id }}"></iframe>{% else %}<small>Map not found</small>{% endif %}
|
3
|
-
</div>
|
1
|
+
<div class="map"><iframe src="https://www.google.com/maps/d/u/0/embed?mid={{ include.id }}" title="{{ include.title | default: 'Map' }}"></iframe></div>
|
data/_includes/nav-header.html
CHANGED
@@ -20,8 +20,8 @@
|
|
20
20
|
{% endif %}
|
21
21
|
|
22
22
|
<template id="buttontoggle">
|
23
|
-
<button class="button button--nav" aria-label="
|
24
|
-
{% include icon.html id="nav" %}
|
23
|
+
<button class="button button--nav" aria-label="Menu toggle">
|
24
|
+
{% include icon.html id="nav" title="Menu" %}
|
25
25
|
</button>
|
26
26
|
</template>
|
27
27
|
|
data/_includes/nav-share.html
CHANGED
@@ -6,16 +6,16 @@
|
|
6
6
|
{% assign color = network[1] %}
|
7
7
|
|
8
8
|
{% capture share_link %}
|
9
|
-
{
|
10
|
-
{
|
11
|
-
{
|
12
|
-
{
|
13
|
-
{
|
14
|
-
{
|
15
|
-
{
|
16
|
-
{
|
17
|
-
{
|
18
|
-
{
|
9
|
+
{%- if id contains "twitter" %}https://twitter.com/intent/tweet/?url={{ url }}&text={{ page.title | uri_escape }}{% if site.twitter.username %}&via={{ site.twitter.username }}{% endif %}{% endif -%}
|
10
|
+
{%- if id contains "facebook" %}https://facebook.com/sharer/sharer.php?u={{ url }}{% endif -%}
|
11
|
+
{%- if id contains "google+" %}https://plus.google.com/share?url={{ url }}{% endif -%}
|
12
|
+
{%- if id contains "pinterest" %}https://pinterest.com/pin/create/button/?url={{ url }}&description={{ page.title }}&media={{ page.image }}{% endif -%}
|
13
|
+
{%- if id contains "linkedin" %}https://www.linkedin.com/shareArticle?url={{ url }}&title={{ page.title }}&source={{ site.title }}&mini=true{% endif -%}
|
14
|
+
{%- if id contains "tumblr" %}https://tumblr.com/widgets/share/tool?canonicalUrl={{ url }}&tags={{ page.category }}&caption={{ page.title }}{% endif -%}
|
15
|
+
{%- if id contains "reddit" %}https://reddit.com/submit?url={{ url }}&title={{ page.title }}&resubmit=true{% endif -%}
|
16
|
+
{%- if id contains "hackernews" %}https://news.ycombinator.com/submitlink?u={{ url }}&t={{ page.title }}{% endif -%}
|
17
|
+
{%- if id contains "designernews" %}https://www.designernews.co/submit?url={{ url }}&title={{ page.title }}{% endif -%}
|
18
|
+
{%- if id contains "email" %}mailto:?subject={{ page.title }}&body={{ url | prepend: "Hey, check out this: "}}{% endif -%}
|
19
19
|
{% endcapture %}
|
20
20
|
|
21
21
|
{% include button.html text=name icon=id link=share_link color=color %}
|
data/_includes/post-meta.html
CHANGED
@@ -1,12 +1,12 @@
|
|
1
1
|
{% if page.categories %}
|
2
2
|
{% capture categories %}
|
3
3
|
{% for category in page.categories %}
|
4
|
-
<span class="label label--category"><a href="{{ site.baseurl }}/categories
|
4
|
+
<span class="label label--category"><a href="{{ site.baseurl }}/categories/#{{ category | downcase }}">{{ category }}</a></span>{% if forloop.last == false %},{% endif %}
|
5
5
|
{% endfor %}
|
6
6
|
{% endcapture %}
|
7
7
|
{% elsif page.category %}
|
8
8
|
{% capture categories %}
|
9
|
-
<span class="label label--category"><a href="{{ site.baseurl }}/categories
|
9
|
+
<span class="label label--category"><a href="{{ site.baseurl }}/categories/#{{ page.category | downcase }}">{{ page.category }}</a></span>
|
10
10
|
{% endcapture %}
|
11
11
|
{% endif %}
|
12
12
|
|
data/_includes/site-aside.html
CHANGED
data/_includes/site-logo.html
CHANGED
@@ -0,0 +1,20 @@
|
|
1
|
+
<script type="text/javascript">
|
2
|
+
(() => {
|
3
|
+
const registerServiceWorker = () => {
|
4
|
+
if (!navigator.serviceWorker) {
|
5
|
+
return;
|
6
|
+
}
|
7
|
+
|
8
|
+
navigator.serviceWorker
|
9
|
+
.register("{{ "/sw.js" | relative_url }}")
|
10
|
+
.then(registration => {
|
11
|
+
console.log("Service Worker: registered");
|
12
|
+
})
|
13
|
+
.catch(err => {
|
14
|
+
console.log("Service Worker: registration failed ", err);
|
15
|
+
});
|
16
|
+
};
|
17
|
+
|
18
|
+
registerServiceWorker();
|
19
|
+
})();
|
20
|
+
</script>
|
data/_includes/video.html
CHANGED
@@ -1,3 +1,3 @@
|
|
1
1
|
<div class="video">
|
2
|
-
<iframe src="https://www.youtube.com/embed/{{ include.id }}" frameborder="0" allowfullscreen></iframe>
|
2
|
+
<iframe src="https://www.youtube.com/embed/{{ include.id }}" frameborder="0" allowfullscreen title="{{ include.title | default: "Video" }}"></iframe>
|
3
3
|
</div>
|
data/_layouts/default.html
CHANGED
@@ -20,6 +20,9 @@
|
|
20
20
|
{% seo %}
|
21
21
|
{% endif %}
|
22
22
|
|
23
|
+
<link rel="manifest" href="{{ "/manifest.json" | relative_url }}">
|
24
|
+
<meta name="theme-color" content="{{ site.manifest.theme_color | default: '#242e2b' }}"/>
|
25
|
+
|
23
26
|
<link rel="stylesheet" href="{{ "/assets/styles.css" | relative_url }}">
|
24
27
|
|
25
28
|
{% if site.avatarurl %}{% include site-favicons.html %}{% endif %}
|
@@ -29,5 +32,6 @@
|
|
29
32
|
|
30
33
|
{{ content }}
|
31
34
|
|
35
|
+
{% if site.serviceWorker != false %}{% include site-sw.html %}{% endif %}
|
32
36
|
</body>
|
33
37
|
</html>
|
data/_sass/_settings.scss
CHANGED
@@ -1,16 +1,16 @@
|
|
1
1
|
// Background colours
|
2
2
|
$backgroundColour: #ffffff;
|
3
|
-
$codeBackgroundColour: #
|
4
|
-
$featureBackgroundColour: #
|
3
|
+
$codeBackgroundColour: #fafafa;
|
4
|
+
$featureBackgroundColour: #f9fafa;
|
5
5
|
$accentColour: #05bf85;
|
6
6
|
|
7
7
|
// Text colours
|
8
|
-
$headingColour: #
|
9
|
-
$bodyColour: #
|
8
|
+
$headingColour: #242e2b;
|
9
|
+
$bodyColour: #384743;
|
10
10
|
$linkColour: #05bf85;
|
11
11
|
$hoverColour: #008000;
|
12
12
|
$focusColour: #fa407a;
|
13
|
-
$captionColour: #
|
13
|
+
$captionColour: #a8adac;
|
14
14
|
$white: #ffffff;
|
15
15
|
|
16
16
|
// Typography
|
data/_sass/_theme.scss
CHANGED
@@ -63,7 +63,7 @@ body {
|
|
63
63
|
@include flexbox;
|
64
64
|
@include align-items(center);
|
65
65
|
img {
|
66
|
-
max-height:
|
66
|
+
max-height: 5rem;
|
67
67
|
}
|
68
68
|
}
|
69
69
|
|
@@ -196,7 +196,7 @@ body {
|
|
196
196
|
}
|
197
197
|
&--current {
|
198
198
|
a {
|
199
|
-
|
199
|
+
color: $captionColour;
|
200
200
|
}
|
201
201
|
}
|
202
202
|
}
|
@@ -372,6 +372,7 @@ label {
|
|
372
372
|
|
373
373
|
code {
|
374
374
|
padding: .12rem .2rem;
|
375
|
+
color: $headingColour;
|
375
376
|
}
|
376
377
|
|
377
378
|
pre code {
|
Binary file
|
Binary file
|
data/assets/logo.svg
CHANGED
@@ -1 +1,6 @@
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="53" height="52" viewBox="-10 -10 53 52">
|
2
|
+
<g fill="#05BF85" fill-rule="evenodd">
|
3
|
+
<path d="M20.14 2.13L33 10l-1 2-6.65-3.08a12.99 12.99 0 0 1-3 13.1l1.65 9.3c.07.38-.2.68-.57.68h-.74a.86.86 0 0 1-.81-.68l-1.36-7.71A12.93 12.93 0 0 1 14 25.96v5.34a.7.7 0 0 1-.7.7h-.6a.7.7 0 0 1-.7-.7v-5.34a12.93 12.93 0 0 1-6.5-2.35l-1.37 7.71a.86.86 0 0 1-.81.68h-.73a.56.56 0 0 1-.58-.68l1.64-9.29a13 13 0 0 1 16.49-19.9zM13 24a11 11 0 1 0 0-22 11 11 0 0 0 0 22z"/>
|
4
|
+
<path fill-opacity=".44" d="M13 24a11 11 0 0 0 11-11s-22-.1-22 0a11 11 0 0 0 11 11z"/>
|
5
|
+
</g>
|
6
|
+
</svg>
|
data/manifest.json
ADDED
@@ -0,0 +1,17 @@
|
|
1
|
+
---
|
2
|
+
---
|
3
|
+
{
|
4
|
+
"lang": "{{ site.lang | default: "en-US" }}",
|
5
|
+
"name": "{{ site.title }}",
|
6
|
+
"short_name": "{{ site.title | replace: ' ', '' }}",
|
7
|
+
"theme_color": "{{ site.manifest.theme_color | default: '#24292e' }}",
|
8
|
+
"background_color": "{{ site.manifest.background_color | default: '#ffffff' }}",
|
9
|
+
"icons": [
|
10
|
+
{
|
11
|
+
"src": "{{ site.logo }}",
|
12
|
+
"sizes": "512x512"
|
13
|
+
}
|
14
|
+
],
|
15
|
+
"start_url": "/",
|
16
|
+
"display": "standalone"
|
17
|
+
}
|
data/sw.js
ADDED
@@ -0,0 +1,84 @@
|
|
1
|
+
---
|
2
|
+
---
|
3
|
+
const version = '{{ site.time | date: '%Y%m%d%H%M%S' }}';
|
4
|
+
const cacheName = `static::${version}`;
|
5
|
+
|
6
|
+
const buildContentBlob = () => {
|
7
|
+
return [
|
8
|
+
{%- for post in site.posts limit: 10 -%}
|
9
|
+
"{{ post.url }}",
|
10
|
+
{%- endfor -%}
|
11
|
+
{%- for page in site.pages -%}
|
12
|
+
{%- unless page.url contains 'sw.js' or page.url contains '404.html' -%}
|
13
|
+
"{{ page.url }}",
|
14
|
+
{%- endunless -%}
|
15
|
+
{%- endfor -%}
|
16
|
+
"{{ site.logo }}", "/assets/default-offline-image.png", "/assets/scripts/fetch.js"
|
17
|
+
]
|
18
|
+
}
|
19
|
+
|
20
|
+
const updateStaticCache = () => {
|
21
|
+
return caches.open(cacheName).then(cache => {
|
22
|
+
return cache.addAll(buildContentBlob());
|
23
|
+
});
|
24
|
+
};
|
25
|
+
|
26
|
+
const clearOldCache = () => {
|
27
|
+
return caches.keys().then(keys => {
|
28
|
+
// Remove caches whose name is no longer valid.
|
29
|
+
return Promise.all(
|
30
|
+
keys
|
31
|
+
.filter(key => {
|
32
|
+
return key !== cacheName;
|
33
|
+
})
|
34
|
+
.map(key => {
|
35
|
+
console.log(`Service Worker: removing cache ${key}`);
|
36
|
+
return caches.delete(key);
|
37
|
+
})
|
38
|
+
);
|
39
|
+
});
|
40
|
+
};
|
41
|
+
|
42
|
+
self.addEventListener("install", event => {
|
43
|
+
event.waitUntil(
|
44
|
+
updateStaticCache().then(() => {
|
45
|
+
console.log(`Service Worker: cache updated to version: ${cacheName}`);
|
46
|
+
})
|
47
|
+
);
|
48
|
+
});
|
49
|
+
|
50
|
+
self.addEventListener("activate", event => {
|
51
|
+
event.waitUntil(clearOldCache());
|
52
|
+
});
|
53
|
+
|
54
|
+
self.addEventListener("fetch", event => {
|
55
|
+
let request = event.request;
|
56
|
+
let url = new URL(request.url);
|
57
|
+
|
58
|
+
// Only deal with requests from the same domain.
|
59
|
+
if (url.origin !== location.origin) {
|
60
|
+
return;
|
61
|
+
}
|
62
|
+
|
63
|
+
// Always fetch non-GET requests from the network.
|
64
|
+
if (request.method !== "GET") {
|
65
|
+
event.respondWith(fetch(request));
|
66
|
+
return;
|
67
|
+
}
|
68
|
+
|
69
|
+
// Default url returned if page isn't cached
|
70
|
+
let offlineAsset = "/offline/";
|
71
|
+
|
72
|
+
if (request.url.match(/\.(jpe?g|png|gif|svg)$/)) {
|
73
|
+
// If url requested is an image and isn't cached, return default offline image
|
74
|
+
offlineAsset = "/assets/default-offline-image.png";
|
75
|
+
}
|
76
|
+
|
77
|
+
// For all urls request image from network, then fallback to cache, then fallback to offline page
|
78
|
+
event.respondWith(
|
79
|
+
fetch(request).catch(async () => {
|
80
|
+
return (await caches.match(request)) || caches.match(offlineAsset);
|
81
|
+
})
|
82
|
+
);
|
83
|
+
return;
|
84
|
+
});
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: alembic-jekyll-theme
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version:
|
4
|
+
version: 3.0.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- David Darnes
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date:
|
11
|
+
date: 2018-02-12 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: jekyll
|
@@ -186,6 +186,7 @@ files:
|
|
186
186
|
- _includes/site-icons.svg
|
187
187
|
- _includes/site-logo.html
|
188
188
|
- _includes/site-search.html
|
189
|
+
- _includes/site-sw.html
|
189
190
|
- _includes/video.html
|
190
191
|
- _layouts/blog.html
|
191
192
|
- _layouts/categories.html
|
@@ -204,11 +205,14 @@ files:
|
|
204
205
|
- _sass/sassline-base/_reset.scss
|
205
206
|
- _sass/sassline-base/_typography.scss
|
206
207
|
- _sass/sassline-base/_variables.scss
|
208
|
+
- assets/default-offline-image.png
|
207
209
|
- assets/default-social-image.png
|
208
210
|
- assets/logo.svg
|
209
211
|
- assets/scripts/fetch.js
|
210
212
|
- assets/search.json
|
211
213
|
- assets/styles.scss
|
214
|
+
- manifest.json
|
215
|
+
- sw.js
|
212
216
|
homepage: https://alembic.darn.es
|
213
217
|
licenses:
|
214
218
|
- MIT
|