hematite 0.0.11 → 0.0.12
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/_config.yml +3 -3
- data/_includes/settings.html +101 -0
- data/_sass/_nav.scss +1 -1
- data/assets/html/settings.html +1 -92
- data/assets/js/Settings.mjs +5 -3
- metadata +2 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 8ba3735a0bf64aa9c895fc9622e0370b0827c80386469ccb4c5172058f91db97
|
4
|
+
data.tar.gz: e6f824c10b0febde44d427ee0528681f756cc59bff67a3362e256d77d5be3650
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 958067abc2e83cbecc509dc7c31c2eb711c2116ea201a27c28f6a89bc0f0a6658d34532433596b989178ab070d686c2a5de0d26781ff6b92d73fdc6416f9608f
|
7
|
+
data.tar.gz: e01cb8c28899e24135e832ef89543c9266e66db13d9a53f40327d6c32b6d8ed815d5da7247a63fd88ca94dc762180ab752fb8494c2d9e31d3ae2ed13fdda6297
|
data/_config.yml
CHANGED
@@ -1,9 +1,6 @@
|
|
1
1
|
|
2
2
|
# Settings for the demo site.
|
3
3
|
# `jekyll serve` does not auto-reload this file.
|
4
|
-
#
|
5
|
-
# See https://leo3418.github.io/collections/multilingual-jekyll-site/localize-strings
|
6
|
-
# for how localization works.
|
7
4
|
|
8
5
|
title: Hematite Theme
|
9
6
|
description: A Jekyll theme intended for course websites
|
@@ -12,6 +9,9 @@ permalink: pretty
|
|
12
9
|
hematite:
|
13
10
|
auto_invert_imgs: true
|
14
11
|
|
12
|
+
# Set to true to minimize the header by default
|
13
|
+
minimize_header: false
|
14
|
+
|
15
15
|
# Date options are as specified here:
|
16
16
|
# https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat
|
17
17
|
date_format:
|
@@ -0,0 +1,101 @@
|
|
1
|
+
<!--
|
2
|
+
See assets/html/settings.html. This file can be included
|
3
|
+
in your own settings page and add your settings to it!
|
4
|
+
-->
|
5
|
+
|
6
|
+
<!-- So they can be localized, much of this page is filled by JavaScript -->
|
7
|
+
<!-- Organization inspired by https://www.w3.org/WAI/tutorials/forms/grouping/ -->
|
8
|
+
<fieldset>
|
9
|
+
<legend id="font_legend">settings_font_legend</legend>
|
10
|
+
<div>
|
11
|
+
<label id="font_family_lbl" for="font_family">settings_font_family_label</label>
|
12
|
+
<select id="font_family"></select>
|
13
|
+
</div>
|
14
|
+
<div>
|
15
|
+
<label id="font_size_lbl" for="font_size">settings_font_size_label</label>
|
16
|
+
<select id="font_size">
|
17
|
+
</select>
|
18
|
+
</div>
|
19
|
+
</fieldset>
|
20
|
+
|
21
|
+
<fieldset>
|
22
|
+
<legend id="theme_legend">page_theme_legend</legend>
|
23
|
+
<div>
|
24
|
+
<label id="page_theme_lbl" for="page_theme">settings_theme_label</label>
|
25
|
+
<select id="page_theme"></select>
|
26
|
+
</div>
|
27
|
+
<div>
|
28
|
+
<label id="page_minimize_header_lbl" for="minimize_page_hdr">settings_minimize_header</label>
|
29
|
+
<input type="checkbox" id="minimize_page_hdr"/>
|
30
|
+
</div>
|
31
|
+
</fieldset>
|
32
|
+
|
33
|
+
<script type="module">
|
34
|
+
import Settings from "{{ 'assets/js/Settings.mjs' | relative_url }}";
|
35
|
+
import { stringLookup } from "{{ 'assets/js/strings.mjs' | relative_url }}";
|
36
|
+
|
37
|
+
let settingsTextElemIDs = [
|
38
|
+
`settings_header`, `settings_description`, `font_legend`,
|
39
|
+
`font_family_lbl`, `font_size_lbl`, `theme_legend`,
|
40
|
+
`page_theme_lbl`, `page_minimize_header_lbl`,
|
41
|
+
];
|
42
|
+
|
43
|
+
// Localize all descriptive settings elements (each should contian the
|
44
|
+
// name of its localization key).
|
45
|
+
for (const id of settingsTextElemIDs) {
|
46
|
+
let elem = document.querySelector(`#${id}`);
|
47
|
+
|
48
|
+
if (elem) {
|
49
|
+
elem.innerText = stringLookup(elem.innerText);
|
50
|
+
}
|
51
|
+
}
|
52
|
+
|
53
|
+
let fontSizeSelect = document.querySelector("#font_size");
|
54
|
+
let fontFamilySelect = document.querySelector("#font_family");
|
55
|
+
let pageThemeSelect = document.querySelector("#page_theme");
|
56
|
+
let minimizeHeaderCheckbox = document.querySelector("#minimize_page_hdr");
|
57
|
+
|
58
|
+
pageThemeSelect.innerHTML =
|
59
|
+
`
|
60
|
+
<option value='${Settings.THEME_AUTO}'>${stringLookup('page_theme_auto')}</option>
|
61
|
+
<option value='${Settings.THEME_DARK}'>${stringLookup('page_theme_dark')}</option>
|
62
|
+
<option value='${Settings.THEME_LIGHT}'>${stringLookup('page_theme_light')}</option>
|
63
|
+
`;
|
64
|
+
|
65
|
+
fontFamilySelect.innerHTML =
|
66
|
+
`
|
67
|
+
<option value='${Settings.FONT_DEFAULT}'>${stringLookup('page_font_default')}</option>
|
68
|
+
<option value='${Settings.FONT_SERIF}'>${stringLookup('page_font_serif')}</option>
|
69
|
+
<option value='${Settings.FONT_SANS}'>${stringLookup('page_font_sans')}</option>
|
70
|
+
`;
|
71
|
+
|
72
|
+
fontSizeSelect.innerHTML =
|
73
|
+
`
|
74
|
+
<option value='${Settings.FONT_SIZE_DEFAULT}'>${stringLookup('page_font_default')}</option>
|
75
|
+
<option value='${Settings.FONT_SIZE_SMALL}'>${stringLookup('page_font_small')}</option>
|
76
|
+
<option value='${Settings.FONT_SIZE_MEDIUM}'>${stringLookup('page_font_medium')}</option>
|
77
|
+
<option value='${Settings.FONT_SIZE_LARGE}'>${stringLookup('page_font_large')}</option>
|
78
|
+
`;
|
79
|
+
|
80
|
+
fontSizeSelect.oninput = () => {
|
81
|
+
Settings.setFontSize(fontSizeSelect.value);
|
82
|
+
};
|
83
|
+
|
84
|
+
fontFamilySelect.oninput = () => {
|
85
|
+
Settings.setFontFamily(fontFamilySelect.value);
|
86
|
+
};
|
87
|
+
|
88
|
+
pageThemeSelect.oninput = () => {
|
89
|
+
Settings.setTheme(pageThemeSelect.value);
|
90
|
+
};
|
91
|
+
|
92
|
+
minimizeHeaderCheckbox.oninput = () => {
|
93
|
+
Settings.setHeaderMinimized(minimizeHeaderCheckbox.checked);
|
94
|
+
};
|
95
|
+
|
96
|
+
pageThemeSelect.value = Settings.getTheme();
|
97
|
+
fontFamilySelect.value = Settings.getFontFamily();
|
98
|
+
fontSizeSelect.value = Settings.getFontSize();
|
99
|
+
minimizeHeaderCheckbox.checked = Settings.getHeaderMinimized();
|
100
|
+
|
101
|
+
</script>
|
data/_sass/_nav.scss
CHANGED
data/assets/html/settings.html
CHANGED
@@ -6,98 +6,7 @@ noindex: true
|
|
6
6
|
|
7
7
|
<noscript>JavaScript is required to view this page's content!</noscript>
|
8
8
|
|
9
|
-
<!-- So they can be localized, much of this page is filled by JavaScript -->
|
10
9
|
<h1 id="settings_header">page_settings_header</h1>
|
11
10
|
<p id="settings_description">page_settings_description</p>
|
12
11
|
|
13
|
-
|
14
|
-
<fieldset>
|
15
|
-
<legend id="font_legend">settings_font_legend</legend>
|
16
|
-
<div>
|
17
|
-
<label id="font_family_lbl" for="font_family">settings_font_family_label</label>
|
18
|
-
<select id="font_family"></select>
|
19
|
-
</div>
|
20
|
-
<div>
|
21
|
-
<label id="font_size_lbl" for="font_size">settings_font_size_label</label>
|
22
|
-
<select id="font_size">
|
23
|
-
</select>
|
24
|
-
</div>
|
25
|
-
</fieldset>
|
26
|
-
|
27
|
-
<fieldset>
|
28
|
-
<legend id="theme_legend">page_theme_legend</legend>
|
29
|
-
<div>
|
30
|
-
<label id="page_theme_lbl" for="page_theme">settings_theme_label</label>
|
31
|
-
<select id="page_theme"></select>
|
32
|
-
</div>
|
33
|
-
<div>
|
34
|
-
<label id="page_minimize_header_lbl" for="minimize_page_hdr">settings_minimize_header</label>
|
35
|
-
<input type="checkbox" id="minimize_page_hdr"/>
|
36
|
-
</fieldset>
|
37
|
-
|
38
|
-
<script type="module">
|
39
|
-
import Settings from "{{ 'assets/js/Settings.mjs' | relative_url }}";
|
40
|
-
import { stringLookup } from "{{ 'assets/js/strings.mjs' | relative_url }}";
|
41
|
-
|
42
|
-
let settingsTextElemIDs = [
|
43
|
-
`settings_header`, `settings_description`, `font_legend`,
|
44
|
-
`font_family_lbl`, `font_size_lbl`, `theme_legend`,
|
45
|
-
`page_theme_lbl`, `page_minimize_header_lbl`,
|
46
|
-
];
|
47
|
-
|
48
|
-
// Localize all descriptive settings elements (each should contian the
|
49
|
-
// name of its localization key).
|
50
|
-
for (const id of settingsTextElemIDs) {
|
51
|
-
let elem = document.querySelector(`#${id}`);
|
52
|
-
elem.innerText = stringLookup(elem.innerText);
|
53
|
-
}
|
54
|
-
|
55
|
-
let fontSizeSelect = document.querySelector("#font_size");
|
56
|
-
let fontFamilySelect = document.querySelector("#font_family");
|
57
|
-
let pageThemeSelect = document.querySelector("#page_theme");
|
58
|
-
let minimizeHeaderCheckbox = document.querySelector("#minimize_page_hdr");
|
59
|
-
|
60
|
-
pageThemeSelect.innerHTML =
|
61
|
-
`
|
62
|
-
<option value='${Settings.THEME_AUTO}'>${stringLookup('page_theme_auto')}</option>
|
63
|
-
<option value='${Settings.THEME_DARK}'>${stringLookup('page_theme_dark')}</option>
|
64
|
-
<option value='${Settings.THEME_LIGHT}'>${stringLookup('page_theme_light')}</option>
|
65
|
-
`;
|
66
|
-
|
67
|
-
fontFamilySelect.innerHTML =
|
68
|
-
`
|
69
|
-
<option value='${Settings.FONT_DEFAULT}'>${stringLookup('page_font_default')}</option>
|
70
|
-
<option value='${Settings.FONT_SERIF}'>${stringLookup('page_font_serif')}</option>
|
71
|
-
<option value='${Settings.FONT_SANS}'>${stringLookup('page_font_sans')}</option>
|
72
|
-
`;
|
73
|
-
|
74
|
-
fontSizeSelect.innerHTML =
|
75
|
-
`
|
76
|
-
<option value='${Settings.FONT_SIZE_DEFAULT}'>${stringLookup('page_font_default')}</option>
|
77
|
-
<option value='${Settings.FONT_SIZE_SMALL}'>${stringLookup('page_font_small')}</option>
|
78
|
-
<option value='${Settings.FONT_SIZE_MEDIUM}'>${stringLookup('page_font_medium')}</option>
|
79
|
-
<option value='${Settings.FONT_SIZE_LARGE}'>${stringLookup('page_font_large')}</option>
|
80
|
-
`;
|
81
|
-
|
82
|
-
fontSizeSelect.oninput = () => {
|
83
|
-
Settings.setFontSize(fontSizeSelect.value);
|
84
|
-
};
|
85
|
-
|
86
|
-
fontFamilySelect.oninput = () => {
|
87
|
-
Settings.setFontFamily(fontFamilySelect.value);
|
88
|
-
};
|
89
|
-
|
90
|
-
pageThemeSelect.oninput = () => {
|
91
|
-
Settings.setTheme(pageThemeSelect.value);
|
92
|
-
};
|
93
|
-
|
94
|
-
minimizeHeaderCheckbox.oninput = () => {
|
95
|
-
Settings.setHeaderMinimized(minimizeHeaderCheckbox.checked);
|
96
|
-
};
|
97
|
-
|
98
|
-
pageThemeSelect.value = Settings.getTheme();
|
99
|
-
fontFamilySelect.value = Settings.getFontFamily();
|
100
|
-
fontSizeSelect.value = Settings.getFontSize();
|
101
|
-
minimizeHeaderCheckbox.checked = Settings.getHeaderMinimized();
|
102
|
-
|
103
|
-
</script>
|
12
|
+
{% include settings.html %}
|
data/assets/js/Settings.mjs
CHANGED
@@ -49,7 +49,8 @@ class Settings {
|
|
49
49
|
}
|
50
50
|
|
51
51
|
getHeaderMinimized() {
|
52
|
-
let minimizedStr = this.getSetting_(this.HEADER_MINIMIZED_KEY_)
|
52
|
+
let minimizedStr = this.getSetting_(this.HEADER_MINIMIZED_KEY_)
|
53
|
+
?? {{ site.hematite.user_config.minimize_header | default: site.hematite.minimize_header | default: "false" | jsonify }};
|
53
54
|
return minimizedStr == "true";
|
54
55
|
}
|
55
56
|
|
@@ -163,9 +164,10 @@ class Settings {
|
|
163
164
|
|
164
165
|
document.documentElement.classList.add("minimizedNavHeader");
|
165
166
|
|
166
|
-
// Animate the header.
|
167
167
|
if (header) {
|
168
|
-
|
168
|
+
// Re-show the header
|
169
|
+
// Rely on a CSS animation for animating the header's return.
|
170
|
+
await AnimationUtil.expandInVert(header, 0);
|
169
171
|
}
|
170
172
|
})();
|
171
173
|
}
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: hematite
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.12
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Henry Heino
|
@@ -43,6 +43,7 @@ files:
|
|
43
43
|
- _includes/nav/pages_list.html
|
44
44
|
- _includes/nav/pinned_page.html
|
45
45
|
- _includes/nav/sidebar.html
|
46
|
+
- _includes/settings.html
|
46
47
|
- _layouts/calendar.html
|
47
48
|
- _layouts/default.html
|
48
49
|
- _layouts/home.html
|