Browse Source

feat(feature/custom-homepage): add custom homepage and docs in english

close #41
Josh Habdas 4 months ago
parent
commit
87d207652e
Signed by: Josh Habdas <jhabdas@protonmail.com> GPG Key ID: B148B31154C75A74

+ 43
- 0
assets/css/conditional/layout/home.css View File

@@ -0,0 +1,43 @@
1
+/*!
2
+ * Copyright (C) 2019  Josh Habdas <jhabdas@protonmail.com>
3
+ *
4
+ * This file is part of After Dark.
5
+ *
6
+ * After Dark is free software: you can redistribute it and/or modify
7
+ * it under the terms of the GNU Affero General Public License as published
8
+ * by the Free Software Foundation, either version 3 of the License, or
9
+ * (at your option) any later version.
10
+ *
11
+ * After Dark is distributed in the hope that it will be useful,
12
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
13
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
14
+ * GNU Affero General Public License for more details.
15
+ *
16
+ * You should have received a copy of the GNU Affero General Public License
17
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
18
+ */
19
+
20
+section ul.grid {
21
+  margin: 10px -10px;
22
+}
23
+section ul.grid li {
24
+  padding: 10px;
25
+}
26
+section ul.grid li h2 {
27
+  margin-bottom: 1rem;
28
+}
29
+section ul.grid li a figure:hover {
30
+  filter: brightness(1.1);
31
+}
32
+.hack section ul.grid li h2::before {
33
+  content: initial;
34
+}
35
+.hack section ul.grid li::after {
36
+  content: initial;
37
+}
38
+.standard section ol.grid,
39
+.standard section ul.grid {
40
+  padding-left: 0px;
41
+  list-style-type: none;
42
+  display: flex;
43
+}

+ 16
- 0
assets/css/conditional/layout/post/single.css View File

@@ -0,0 +1,16 @@
1
+.hack header figure[itemtype*="ImageObject"] {
2
+  position: relative;
3
+}
4
+.hack header figure[itemtype*="ImageObject"] figcaption {
5
+  position: absolute;
6
+  bottom: 0;
7
+  right: 0;
8
+  text-align: right;
9
+  padding: 15px;
10
+  font-style: oblique;
11
+  font-size: smaller;
12
+  mix-blend-mode: soft-light;
13
+}
14
+.hack header figure[itemtype*="ImageObject"] [itemprop="headline"] {
15
+  font-weight: bold;
16
+}

+ 2
- 5
assets/css/theme.css View File

@@ -134,7 +134,8 @@ html {
134 134
 .hack blockquote:after {
135 135
   line-height: 1.5;
136 136
 }
137
-.hack figure {
137
+.hack figure,
138
+.standard figure {
138 139
   margin: unset;
139 140
 }
140 141
 .hack figure a {
@@ -143,10 +144,6 @@ html {
143 144
 .hack figure a:hover {
144 145
   background-color: inherit;
145 146
 }
146
-article [itemprop="description"] {
147
-  margin-bottom: 20px;
148
-  margin-top: 20px;
149
-}
150 147
 article header img {
151 148
   width: 100%;
152 149
   border-radius: 3px;

+ 1
- 0
data/schema.toml View File

@@ -0,0 +1 @@
1
+article_types = ["Article", "AdvertiserContentArticle", "NewsArticle", "AnalysisNewsArticle", "AskPublicNewsArticle", "BackgroundNewsArticle", "OpinionNewsArticle", "ReportageNewsArticle", "ReviewNewsArticle", "Report", "SatiricalArticle", "ScholarlyArticle", "MedicalScholarlyArticle", "SocialMediaPosting", "BlogPosting", "LiveBlogPosting", "DiscussionForumPosting", "TechArticle", "APIReference"]

+ 1
- 1
docs/config.toml View File

@@ -19,7 +19,7 @@
19 19
 
20 20
 baseurl = "https://after-dark.habd.as/" # Controls base URL sitewide
21 21
 title = "After Dark" # Homepage title and page title suffix
22
-paginate = 36 # Number of items to show before paginating
22
+paginate = 37 # Number of items to show before paginating
23 23
 copyright = "Copyright &copy; Josh Habdas. Licensed under <a target=\"_blank\" rel=\"external noopener license\" href=\"https://www.gnu.org/licenses/agpl.html\">AGPL-3.0-or-later</a>."
24 24
 
25 25
 # Controls default theme and theme components

+ 25
- 25
docs/content/_index.md View File

@@ -55,7 +55,7 @@ images = [
55 55
       <th scope="col" width="25%">Extras</th>
56 56
     </tr>
57 57
     <tr>
58
-      <td><a href="./feature/">36</a></td>
58
+      <td><a href="./feature/">37</a></td>
59 59
       <td><a href="./module/">4</a></td>
60 60
       <td><a href="./shortcode/">26+</a></td>
61 61
       <td><a href="./extra/">2</a></td>
@@ -63,6 +63,20 @@ images = [
63 63
   </table>
64 64
 </section>
65 65
 
66
+<section id="feature-customize" class="feature">
67
+  <svg class="i-compose" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
68
+    <path d="M27 15 L27 30 2 30 2 5 17 5 M30 6 L26 2 9 19 7 25 13 23 Z M22 6 L26 10 Z M9 19 L13 23 Z" />
69
+  </svg>
70
+  <h2>Easily Customized</h2>
71
+  <p>Toggle between 1 of 8 <strong><i>customizable</i> skin styles</strong> or disable them entirely and use custom layouts and styles to take complete design control.</p>
72
+  <nav><p>
73
+    <a href="/feature/skin-styles/">Skins</a> |
74
+    <a href="/feature/custom-homepage/">Homepage</a> |
75
+    <a href="/feature/custom-styles/">Styles</a> |
76
+    <a href="/feature/#customizing">See All</a>
77
+  </p></nav>
78
+</section>
79
+
66 80
 <section id="feature-speed" class="feature">
67 81
   <svg class="i-lightning" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
68 82
     <path d="M18 13 L26 2 8 13 14 19 6 30 24 19 Z" />
@@ -91,21 +105,6 @@ images = [
91 105
   </p></nav>
92 106
 </section>
93 107
 
94
-<section id="feature-rewards" class="feature">
95
-  <svg class="i-creditcard" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
96
-    <path d="M2 7 L2 25 30 25 30 7 Z M5 18 L9 18 M5 21 L11 21" />
97
-    <path d="M2 11 L2 13 30 13 30 11 Z" fill="currentColor" />
98
-  </svg>
99
-  <h2 style="margin-bottom:0.2rem">Rewards System</h2>
100
-  <small><i style="color:lime">(Now in Beta!)</i></small>
101
-  <p>Earn rewards for keeping your software up-to-date and <strong>monetize attention</strong> to generate a <strong><i>borderless</i></strong>, low-maintenance & passive income.</p>
102
-  <nav><p>
103
-    <a href="/module/toxic-swamp/#installation">Installation</a> |
104
-    <a href="/module/toxic-swamp/#earning-rewards">Earning Rewards</a> |
105
-    <a href="/module/toxic-swamp/">Learn More</a>
106
-  </p></nav>
107
-</section>
108
-
109 108
 <section id="feature-search" class="feature">
110 109
   <svg class="i-search" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
111 110
     <circle cx="14" cy="14" r="12" />
@@ -119,17 +118,18 @@ images = [
119 118
   </p></nav>
120 119
 </section>
121 120
 
122
-<section id="feature-customize" class="feature">
123
-  <svg class="i-compose" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
124
-    <path d="M27 15 L27 30 2 30 2 5 17 5 M30 6 L26 2 9 19 7 25 13 23 Z M22 6 L26 10 Z M9 19 L13 23 Z" />
121
+<section id="feature-rewards" class="feature">
122
+  <svg class="i-creditcard" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
123
+    <path d="M2 7 L2 25 30 25 30 7 Z M5 18 L9 18 M5 21 L11 21" />
124
+    <path d="M2 11 L2 13 30 13 30 11 Z" fill="currentColor" />
125 125
   </svg>
126
-  <h2>Easily Customized</h2>
127
-  <p>Toggle between 1 of 8 <strong><i>customizable</i> skin styles</strong> or disable them entirely and use custom layouts and styles to take complete design control.</p>
126
+  <h2 style="margin-bottom:0.2rem">Rewards System</h2>
127
+  <small><i style="color:lime">(Now in Beta!)</i></small>
128
+  <p>Earn rewards for keeping your software up-to-date and <strong>monetize attention</strong> to generate a <strong><i>borderless</i></strong>, low-maintenance & passive income.</p>
128 129
   <nav><p>
129
-    <a href="/feature/skin-styles/">Skins</a> |
130
-    <a href="/feature/custom-layouts/">Layouts</a> |
131
-    <a href="/feature/custom-styles/">Styles</a> |
132
-    <a href="/feature/svg-favicon/">Favicons</a>
130
+    <a href="/module/toxic-swamp/#installation">Installation</a> |
131
+    <a href="/module/toxic-swamp/#earning-rewards">Earning Rewards</a> |
132
+    <a href="/module/toxic-swamp/">Learn More</a>
133 133
   </p></nav>
134 134
 </section>
135 135
 

+ 161
- 0
docs/content/feature/custom-homepage.md View File

@@ -0,0 +1,161 @@
1
++++
2
+title = "Custom Homepage"
3
+description = "Hide the blog and specify the content shown."
4
+categories = ["customizing"]
5
+tags = ["layout", "templating", "style"]
6
+features = ["code highlighter", "snippets", "related content"]
7
+[[copyright]]
8
+  owner = "Josh Habdas"
9
+  date = "2019"
10
+  license = "agpl-3.0-or-later"
11
++++
12
+
13
+After Dark provides a configurable way to customize the content shown on your homepage without the need for creating a [Custom Layout](../custom-layouts). Use it to hide the blog and display recent content from various sections of your site.
14
+
15
+{{< hackcss-alert >}}
16
+{{< figure
17
+  src="/images/screenshots/feature-homepage-fs8.png"
18
+>}}
19
+{{< /hackcss-alert >}}
20
+
21
+{{< hackcss-card header="Quick Example" >}}
22
+{{< highlight toml "linenos=inline" >}}
23
+[params.layout.home]
24
+  hide_blog = true
25
+
26
+[[params.layout.home.section]]
27
+  type = "about"
28
+  weight = 1
29
+
30
+[[params.layout.home.section]]
31
+  type = "code" # Required, name of section to show on homepage
32
+  limit = 4 # Optional, set number of items to show from section
33
+  weight = 2 # Optional, choose layout order for section
34
+  thumbs = ["fill", "400x400"] # Optional, thumbnail image processing
35
+
36
+[[params.layout.home.section]]
37
+  type = "site"
38
+  limit = 2
39
+  weight = 3
40
+
41
+[[params.layout.home.section]]
42
+  type = "post"
43
+  limit = 3
44
+  weight = 4
45
+{{< /highlight >}}
46
+{{< /hackcss-card >}}
47
+
48
+Start by adding a section to display:
49
+
50
+```toml
51
+[[params.layout.home.section]]
52
+  type = "post"
53
+```
54
+
55
+Limit the number of items shown:
56
+
57
+```toml
58
+[[params.layout.home.section]]
59
+  type = "post"
60
+  limit = 3
61
+```
62
+
63
+Then hide the blog if you like:
64
+
65
+```toml
66
+[params.layout.home]
67
+  hide_blog = true
68
+```
69
+
70
+And use the space to add more sections:
71
+
72
+```toml
73
+[[params.layout.home.section]]
74
+  type = "post"
75
+
76
+[[params.layout.home.section]]
77
+  type = "podcast"
78
+```
79
+
80
+Or even add stand-alone pages too:
81
+
82
+```toml
83
+[[params.layout.home.section]]
84
+  type = "about"
85
+```
86
+
87
+And display sections in order by weight:
88
+
89
+```toml
90
+[[params.layout.home.section]]
91
+  type = "about"
92
+  weight = 1
93
+
94
+[[params.layout.home.section]]
95
+  type = "podcast"
96
+  weight = 2
97
+```
98
+
99
+Each section is output using generic [Structured Data](../structured-data):
100
+
101
+```
102
+Homepage
103
+├── Thing
104
+└── ItemList
105
+    ├── Thing
106
+    ├── Thing
107
+    └── Thing
108
+```
109
+
110
+And may be enhanced using front matter:
111
+
112
+```
113
+├── archetypes
114
+├── content
115
+│   └── about.md
116
+│   └── podcast
117
+│       ├── _index.md
118
+│       ├── secrets-of-silicon-valley
119
+│       ├── the-5g-dragnet
120
+│       └── language-is-a-weapon
121
+├── layouts
122
+```
123
+
124
+```toml
125
+[schema]
126
+  type = "AboutPage" # inside about.md
127
+```
128
+
129
+```toml
130
+[schema]
131
+  type = "Audiobook" # inside _index.md
132
+```
133
+
134
+Resulting in machine-readable structure:
135
+
136
+```
137
+Homepage
138
+├── AboutPage
139
+└── ItemList
140
+    ├── Audiobook
141
+    ├── Audiobook
142
+    └── Audiobook
143
+```
144
+
145
+Which can be further enhanced using thumbnail images, which are output automatically for any list item in any section using a [Post Images](../post-images) formatted resource bundle and containing the string `thumbnail`:
146
+
147
+```toml
148
+[[resources]]
149
+  src = "**hyperdrive-logo.png"
150
+  name = "header thumbnail"
151
+```
152
+
153
+Thumbnails output automatically when described in front-matter for any resource type in any section, and may be manipulated using {{< external "https://gohugo.io/content-management/image-processing/#readout" "Hugo Image Processing" />}} using the `thumbs` setting in any section:
154
+
155
+```toml
156
+[[params.layout.home.section]]
157
+  type = "code"
158
+  thumbs = ["fill", "400x400"]
159
+```
160
+
161
+Valid options are `fit`, `resize` and `fill`, and image dimensions may be omitted for a 4x3 aspect ratio thumbnail.

BIN
docs/static/images/screenshots/feature-homepage-fs8.png View File


+ 0
- 1
docs/themes/toxic-swamp View File

@@ -1 +0,0 @@
1
-../../../toxic-swamp

+ 2
- 2
layouts/_default/baseof.html View File

@@ -17,11 +17,11 @@ You should have received a copy of the GNU Affero General Public License
17 17
 along with this program.  If not, see <https://www.gnu.org/licenses/>.
18 18
 */ -}}
19 19
 
20
-<!DOCTYPE html>
20
+<!doctype html>
21 21
 <html lang="{{ .Site.LanguageCode }}">
22 22
   <head>
23 23
     {{ partial "meta/content-security-policy.html" . }}
24
-    <meta name="generator" content="Hugo">
24
+    <meta name="generator" content="After Dark Hugo">
25 25
     <meta charset="utf-8">
26 26
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
27 27
     <title>{{ block "title" . }}{{ .Title }} | {{ .Site.Title }}{{ end }}</title>

+ 94
- 0
layouts/_default/home.html View File

@@ -0,0 +1,94 @@
1
+{{/*
2
+Copyright (C) 2019  Josh Habdas <jhabdas@protonmail.com>
3
+
4
+This file is part of After Dark.
5
+
6
+After Dark is free software: you can redistribute it and/or modify
7
+it under the terms of the GNU Affero General Public License as published by
8
+the Free Software Foundation, either version 3 of the License, or
9
+(at your option) any later version.
10
+
11
+After Dark is distributed in the hope that it will be useful,
12
+but WITHOUT ANY WARRANTY; without even the implied warranty of
13
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
14
+GNU Affero General Public License for more details.
15
+
16
+You should have received a copy of the GNU Affero General Public License
17
+along with this program.  If not, see <https://www.gnu.org/licenses/>.
18
+*/}}
19
+
20
+{{ define "title" -}}
21
+  {{ .Site.Title }}
22
+{{- end }}
23
+{{ define "header" }}
24
+  {{ partial "masthead.html" . }}
25
+{{ end }}
26
+{{ define "main" }}
27
+  {{ if ne .Site.Params.hackcss.disabled true }}
28
+    {{ with resources.Get "css/conditional/layout/home.css" | minify }}
29
+      <style>{{ .Content | safeCSS }}</style>
30
+    {{ end }}
31
+  {{ end }}
32
+  <header>
33
+    <h1 itemprop="name">{{ .Title }}</h1>
34
+  </header>
35
+  {{ with .Site.Params.layout.home.section }}
36
+    {{ range sort . "weight" "asc" }}
37
+      <section>
38
+        {{ $index := site.GetPage "section" .type }}
39
+        {{ $pages := where site.RegularPages "Type" .type }}
40
+        {{ $page_count := (default 1 (len $pages)) }}
41
+        {{ if eq $page_count 1 }}
42
+          {{ partial "page-summary.html" $index }}
43
+        {{ else if gt $page_count 1 }}
44
+          <header>
45
+            <h1 itemprop="name">
46
+              <a href="{{ $index.RelPermalink }}">Recent {{ $index.Title }}</a>
47
+            </h1>
48
+            <blockquote itemprop="description">{{ $index.Description }}</blockquote>
49
+          </header>
50
+          <ul class="grid" itemscope itemtype="https://schema.org/ItemList">
51
+            <meta itemprop="itemListOrder" content="Unordered">
52
+            <meta itemprop="name" content="{{ $index.Title }}">
53
+            <meta itemprop="numberOfItems" content="{{ (default $page_count .limit) }}">
54
+            {{ $thumbnail_options := .thumbs }}
55
+            {{ range first (default $page_count .limit) $pages }}
56
+              {{ $page_schema := .Params.schema }}
57
+              {{ $section_schema := (.Site.GetPage "section" .Page.Type).Params.schema }}
58
+              {{ $schema_type := (default $section_schema.type $page_schema.type) | default "Thing" }}
59
+              <li class="cell" itemprop="itemListElement" itemscope itemtype="https://schema.org/{{ $schema_type }}">
60
+                <a itemprop="url" href="{{ .RelPermalink }}">
61
+                  {{ partial "image/thumbnail.html" (dict "node" . "options" $thumbnail_options) }}
62
+                  <h2 itemprop="name">{{ .Title }}</h2>
63
+                </a>
64
+                <small itemprop="description">{{ .Description }}</small>
65
+              </li>
66
+            {{ end }}
67
+          </ul>
68
+        {{ end }}
69
+        {{ if and (lt .limit $page_count) (ne 1 $page_count) }}
70
+          <nav class="readmore">
71
+            <a itemprop="url" href="{{ $index.RelPermalink }}">
72
+              View more {{ $index.Title }}
73
+            </a>
74
+          </nav>
75
+        {{ end }}
76
+      </section>
77
+    {{ end }}
78
+  {{ end }}
79
+  {{ if not .Site.Params.layout.home.hide_blog }}
80
+    <section itemscope itemtype="https://schema.org/Blog">
81
+      {{ range (.Paginate (where .Data.Pages "Type" "in" (site.Params.layout.homepage.sections | default (slice "post")))).Pages }}
82
+        {{ partial "page-summary.html" . }}
83
+      {{ end }}
84
+    </section>
85
+  {{ end }}
86
+{{ end }}
87
+{{ define "footer" }}
88
+  {{ if not .Site.Params.layout.home.hide_blog }}
89
+    <p>{{ partial "pagination.html" . }}</p>
90
+  {{ end }}
91
+  <small class="muted">
92
+    {{ partial "copyright-notice.html" . }}
93
+  </small>
94
+{{ end }}

+ 0
- 39
layouts/index.html View File

@@ -1,39 +0,0 @@
1
-{{/*
2
-Copyright (C) 2019  Josh Habdas <jhabdas@protonmail.com>
3
-
4
-This file is part of After Dark.
5
-
6
-After Dark is free software: you can redistribute it and/or modify
7
-it under the terms of the GNU Affero General Public License as published by
8
-the Free Software Foundation, either version 3 of the License, or
9
-(at your option) any later version.
10
-
11
-After Dark is distributed in the hope that it will be useful,
12
-but WITHOUT ANY WARRANTY; without even the implied warranty of
13
-MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
14
-GNU Affero General Public License for more details.
15
-
16
-You should have received a copy of the GNU Affero General Public License
17
-along with this program.  If not, see <https://www.gnu.org/licenses/>.
18
-*/}}
19
-
20
-{{ define "title" -}}
21
-  {{ .Site.Title }}
22
-{{- end }}
23
-{{ define "header" }}
24
-  {{ partial "masthead.html" . }}
25
-{{ end }}
26
-{{ define "main" }}
27
-  <header>
28
-    <h1>{{ .Title }}</h1>
29
-  </header>
30
-  {{ range (.Paginate (where .Data.Pages "Type" "post")).Pages }}
31
-    {{ partial "page-summary.html" . }}
32
-  {{ end }}
33
-{{ end }}
34
-{{ define "footer" }}
35
-  <p>{{ partial "pagination.html" . }}</p>
36
-  <small class="muted">
37
-    {{ partial "copyright-notice.html" . }}
38
-  </small>
39
-{{ end }}

+ 80
- 0
layouts/partials/image/header.html View File

@@ -0,0 +1,80 @@
1
+{{/*
2
+Copyright (C) 2019  Josh Habdas <jhabdas@protonmail.com>
3
+
4
+This file is part of After Dark.
5
+
6
+After Dark is free software: you can redistribute it and/or modify
7
+it under the terms of the GNU Affero General Public License as published by
8
+the Free Software Foundation, either version 3 of the License, or
9
+(at your option) any later version.
10
+
11
+After Dark is distributed in the hope that it will be useful,
12
+but WITHOUT ANY WARRANTY; without even the implied warranty of
13
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
14
+GNU Affero General Public License for more details.
15
+
16
+You should have received a copy of the GNU Affero General Public License
17
+along with this program.  If not, see <https://www.gnu.org/licenses/>.
18
+*/}}
19
+
20
+{{ with $.Resources.GetMatch "*header*" }}
21
+  {{ $meta_sameas := .Params.meta.sameas }}
22
+  {{ $meta_license := .Params.meta.license }}
23
+  {{ $meta_creator := .Params.meta.creator }}
24
+  {{ $meta_description := .Params.meta.description }}
25
+  {{ $meta_keywords := .Params.meta.keywords }}
26
+  {{ $meta_contentlocation := .Params.meta.contentlocation }}
27
+  {{ $image600 := .Fill "600x338 q60 Center" }}
28
+  {{ $image900 := .Fill "900x506 q70 Center" }}
29
+  {{ $image1200 := .Fill "1200x675 q80 Center" }}
30
+  {{ $image1600 := .Fill "1600x900 q90 Center" }}
31
+  <figure aria-hidden="true" itemscope itemtype="https://schema.org/ImageObject">
32
+    <link itemprop="contentUrl" href="{{ .RelPermalink }}">
33
+    <meta itemprop="encodingFormat" content="{{ .MediaType }}">
34
+    <meta itemprop="name" content="{{ .Name | plainify }}">
35
+    {{ if (urls.Parse $meta_sameas).Host }}
36
+      <link itemprop="sameAs" href="{{ $meta_sameas }}">
37
+    {{ end }}
38
+    {{ if (urls.Parse $meta_license).Host }}
39
+      <link itemprop="license" href="{{ $meta_license }}">
40
+    {{ end }}
41
+    {{ with $meta_keywords }}
42
+      <meta itemprop="keywords" content="{{ delimit . ", " }}">
43
+    {{ end }}
44
+    {{ with $meta_contentlocation }}
45
+      <meta itemprop="contentLocation" content="{{ . | plainify }}">
46
+    {{ end }}
47
+    {{ with $meta_description }}
48
+      <meta itemprop="description" content="{{ . | plainify }}">
49
+    {{ end }}
50
+    <img
51
+      itemprop="thumbnailUrl"
52
+      alt="{{ with $meta_description }}{{ . }}{{ else }}{{ .Name | plainify }}{{ end }}"
53
+      class="lazyload blur-up"
54
+      src="{{ $image600.RelPermalink }}"
55
+      data-sizes="auto"
56
+      data-src="{{ $image1200.RelPermalink }}"
57
+      data-srcset="{{ $image600.RelPermalink }} 600w, {{ $image900.RelPermalink }} 900w, {{ $image1200.RelPermalink }} 1200w, {{ $image1600.RelPermalink }} 1600w"
58
+    >
59
+    {{ if or (not (path.Ext .Title)) (or $meta_creator $meta_sameas) }}
60
+      <figcaption itemprop="caption">
61
+        {{ if not (path.Ext .Title) }}
62
+          <span itemprop="headline">{{ .Title | plainify }}</span>.
63
+        {{ end }}
64
+        {{ if or $meta_creator $meta_sameas }}
65
+          Photo
66
+          {{ if $meta_creator }}
67
+            by
68
+            <span itemprop="creator">
69
+              {{ $meta_creator | plainify -}}
70
+            </span>
71
+          {{- end }}
72
+          {{- with (urls.Parse $meta_sameas).Host }}
73
+            on
74
+            {{ (strings.TrimSuffix (path.Ext .) .) | title }}
75
+          {{- end }}.
76
+        {{ end }}
77
+      </figcaption>
78
+    {{ end }}
79
+  </figure>
80
+{{ end }}

+ 79
- 0
layouts/partials/image/thumbnail.html View File

@@ -0,0 +1,79 @@
1
+{{/*
2
+Copyright (C) 2019  Josh Habdas <jhabdas@protonmail.com>
3
+
4
+This file is part of After Dark.
5
+
6
+After Dark is free software: you can redistribute it and/or modify
7
+it under the terms of the GNU Affero General Public License as published by
8
+the Free Software Foundation, either version 3 of the License, or
9
+(at your option) any later version.
10
+
11
+After Dark is distributed in the hope that it will be useful,
12
+but WITHOUT ANY WARRANTY; without even the implied warranty of
13
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
14
+GNU Affero General Public License for more details.
15
+
16
+You should have received a copy of the GNU Affero General Public License
17
+along with this program.  If not, see <https://www.gnu.org/licenses/>.
18
+*/}}
19
+
20
+{{ $valid_processing_methods := (slice "resize" "fit" "fill") }}
21
+{{ $options := .options | default slice }}
22
+{{ $image_processing_method := default "fill" (index $options 0) }}
23
+{{ $image_processing_options := index $options 1 }}
24
+{{ if not (in $valid_processing_methods $image_processing_method) }}
25
+  {{ errorf "Invalid thumbnail processing method: Must be one of 'fit', 'fill' or 'resize'." }}
26
+{{ else }}
27
+  {{ $scratch := newScratch }}
28
+  {{ with .node.Resources.GetMatch "*thumbnail*" }}
29
+    {{ $meta_sameas := .Params.meta.sameas }}
30
+    {{ $meta_license := .Params.meta.license }}
31
+    {{ $meta_creator := .Params.meta.creator }}
32
+    {{ $meta_description := .Params.meta.description }}
33
+    {{ $meta_keywords := .Params.meta.keywords }}
34
+    {{ $meta_contentlocation := .Params.meta.contentlocation }}
35
+    {{ if (eq $image_processing_method "resize") }}
36
+      {{ $scratch.Set "lodpi" (.Resize (default "400x300 q60 Gaussian" $image_processing_options)) }}
37
+      {{ $scratch.Set "hidpi" (.Resize (printf "%dx%d q90 Gaussian" (mul ($scratch.Get "lodpi").Width 2) (mul ($scratch.Get "lodpi").Height 2))) }}
38
+    {{ else if (eq $image_processing_method "fit") }}
39
+      {{ $scratch.Set "lodpi" (.Fit (default "400x300" $image_processing_options)) }}
40
+      {{ $scratch.Set "hidpi" (.Fit (printf "%dx%d" (mul ($scratch.Get "lodpi").Width 2) (mul ($scratch.Get "lodpi").Height 2))) }}
41
+    {{ else }}
42
+      {{ $scratch.Set "lodpi" (.Fill (default "400x300 Center" $image_processing_options)) }}
43
+      {{ $scratch.Set "hidpi" (.Fill (printf "%dx%d Center" (mul ($scratch.Get "lodpi").Width 2) (mul ($scratch.Get "lodpi").Height 2))) }}
44
+    {{ end }}
45
+    <figure aria-hidden="true" itemscope itemtype="https://schema.org/ImageObject">
46
+      <link itemprop="contentUrl" href="{{ .RelPermalink }}">
47
+      <meta itemprop="encodingFormat" content="{{ .MediaType }}">
48
+      <meta itemprop="name" content="{{ .Name | plainify }}">
49
+      {{ with .Title }}
50
+        <meta itemprop="headline" content="{{ . }}">
51
+      {{ end }}
52
+      {{ with $meta_creator }}
53
+        <meta itemprop="creator" content="{{ . | plainify -}}">
54
+      {{ end }}
55
+      {{ if (urls.Parse $meta_sameas).Host }}
56
+        <link itemprop="sameAs" href="{{ $meta_sameas }}">
57
+      {{ end }}
58
+      {{ if (urls.Parse $meta_license).Host }}
59
+        <link itemprop="license" href="{{ $meta_license }}">
60
+      {{ end }}
61
+      {{ with $meta_keywords }}
62
+        <meta itemprop="keywords" content="{{ delimit . ", " }}">
63
+      {{ end }}
64
+      {{ with $meta_contentlocation }}
65
+        <meta itemprop="contentLocation" content="{{ . | plainify }}">
66
+      {{ end }}
67
+      {{ with $meta_description }}
68
+        <meta itemprop="description" content="{{ . | plainify }}">
69
+      {{ end }}
70
+      <img
71
+        itemprop="thumbnailUrl"
72
+        alt="{{ with $meta_description }}{{ . }}{{ else }}{{ .Name | plainify }}{{ end }}"
73
+        class="lazyload blur-up"
74
+        src="{{ ($scratch.Get "lodpi").RelPermalink }}"
75
+        data-src="{{ ($scratch.Get "hidpi").RelPermalink }}"
76
+      >
77
+    </figure>
78
+  {{ end }}
79
+{{ end }}

+ 19
- 14
layouts/partials/page-summary.html View File

@@ -17,26 +17,26 @@ You should have received a copy of the GNU Affero General Public License
17 17
 along with this program.  If not, see <https://www.gnu.org/licenses/>.
18 18
 */ -}}
19 19
 
20
-<article itemprop="citation" itemscope itemtype="https://schema.org/CreativeWork">
20
+{{ $page_schema := .Params.schema }}
21
+{{ $section_schema := (.Site.GetPage "section" .Page.Type).Params.schema }}
22
+{{ $schema_type := (default $section_schema.type $page_schema.type) | default "Thing" }}
23
+{{ $article_types := .Site.Data.schema.article_types }}
24
+{{ $is_typeof_article := in $article_types $schema_type }}
25
+<article itemprop="citation{{ if eq $schema_type "BlogPosting" }} blogPost{{ end }}" itemscope itemtype="https://schema.org/{{ $schema_type }}" id="{{ .Title | anchorize }}">
21 26
   <header>
22
-    <h2 itemprop="name">
23
-      <a href="{{ .RelPermalink }}" rel="bookmark">{{ .Title }}</a>
24
-    </h2>
27
+    <h1 itemprop="{{ if $is_typeof_article }}headline{{ else }}name{{ end }}">
28
+      <a href="{{ .RelPermalink }}">{{ .Title }}</a>
29
+    </h1>
25 30
     {{ if eq .Type "post" }}
26 31
       <p class="muted">{{ partial "post/meta.html" . }}</p>
27 32
     {{ end }}
33
+    {{ if .Description }}
34
+      <blockquote itemprop="headline">{{ .Description }}</blockquote>
35
+    {{ end }}
28 36
   </header>
29
-  {{ if .Description }}
30
-    <blockquote itemprop="headline">{{ .Description }}</blockquote>
31
-  {{ end }}
32
-  <div itemprop="description">
33
-    {{ .Summary }}
37
+  <div itemprop="{{ if $is_typeof_article }}articleBody mainEntityOfPage{{ end }}">
38
+    {{- .Summary -}}
34 39
   </div>
35
-  {{ if .Truncated }}
36
-    <nav class="readmore"><p>
37
-      <a itemprop="url" href="{{ .RelPermalink }}" rel="bookmark">Read More&nbsp;&raquo;</a>
38
-    </p></nav>
39
-  {{ end }}
40 40
   <meta itemprop="inLanguage" content="{{ .Site.LanguageCode }}">
41 41
   <meta itemprop="datePublished" content="{{ dateFormat "2006-01-02T15:04:05-07:00" (default .Date (.PublishDate)) }}">
42 42
   <meta itemprop="dateModified" content="{{ .Lastmod.Format "2006-01-02T15:04:05-07:00" }}">
@@ -44,3 +44,8 @@ along with this program.  If not, see <https://www.gnu.org/licenses/>.
44 44
     <meta itemprop="image" content="{{ index . 0 }}">
45 45
   {{ end }}
46 46
 </article>
47
+{{ if .Truncated }}
48
+  <nav class="readmore">
49
+    <a itemprop="url" href="{{ .RelPermalink }}">Read More&nbsp;&raquo;</a>
50
+  </nav>
51
+{{ end }}

+ 6
- 79
layouts/post/single.html View File

@@ -21,6 +21,11 @@ along with this program.  If not, see <https://www.gnu.org/licenses/>.
21 21
   {{ partial "masthead.html" . }}
22 22
 {{ end }}
23 23
 {{ define "main" }}
24
+  {{ if ne $.Site.Params.hackcss.disabled true }}
25
+    {{ with resources.Get "css/conditional/layout/post/single.css" | minify }}
26
+      <style>{{ .Content | safeCSS }}</style>
27
+    {{ end }}
28
+  {{ end }}
24 29
   <article itemscope itemtype="https://schema.org/BlogPosting">
25 30
     {{ template "_internal/schema.html" . }}
26 31
     <header>
@@ -31,85 +36,7 @@ along with this program.  If not, see <https://www.gnu.org/licenses/>.
31 36
       {{ if .Description }}
32 37
         <blockquote itemprop="description">{{ .Description }}</blockquote>
33 38
       {{ end }}
34
-      {{ with $.Resources.GetMatch "header" }}
35
-        {{ $meta_sameas := .Params.meta.sameas }}
36
-        {{ $meta_license := .Params.meta.license }}
37
-        {{ $meta_creator := .Params.meta.creator }}
38
-        {{ $meta_description := .Params.meta.description }}
39
-        {{ $meta_keywords := .Params.meta.keywords }}
40
-        {{ $meta_contentlocation := .Params.meta.contentlocation }}
41
-        {{ $image600 := .Fill "600x338 q60 Center" }}
42
-        {{ $image900 := .Fill "900x506 q70 Center" }}
43
-        {{ $image1200 := .Fill "1200x675 q80 Center" }}
44
-        {{ $image1600 := .Fill "1600x900 q90 Center" }}
45
-        <figure aria-hidden="true" itemscope itemtype="https://schema.org/ImageObject">
46
-          <link itemprop="contentUrl" href="{{ .RelPermalink }}">
47
-          <meta itemprop="encodingFormat" content="{{ .MediaType }}">
48
-          <meta itemprop="name" content="{{ .Name | plainify }}">
49
-          {{ if (urls.Parse $meta_sameas).Host }}
50
-            <link itemprop="sameAs" href="{{ $meta_sameas }}">
51
-          {{ end }}
52
-          {{ if (urls.Parse $meta_license).Host }}
53
-            <link itemprop="license" href="{{ $meta_license }}">
54
-          {{ end }}
55
-          {{ with $meta_keywords }}
56
-            <meta itemprop="keywords" content="{{ delimit . ", " }}">
57
-          {{ end }}
58
-          {{ with $meta_contentlocation }}
59
-            <meta itemprop="contentLocation" content="{{ . | plainify }}">
60
-          {{ end }}
61
-          {{ with $meta_description }}
62
-            <meta itemprop="description" content="{{ . | plainify }}">
63
-          {{ end }}
64
-          <img
65
-            itemprop="thumbnailUrl"
66
-            alt="{{ with $meta_description }}{{ . }}{{ else }}{{ .Name | plainify }}{{ end }}"
67
-            class="lazyload blur-up"
68
-            src="{{ $image600.RelPermalink }}"
69
-            data-sizes="auto"
70
-            data-src="{{ $image1200.RelPermalink }}"
71
-            data-srcset="{{ $image600.RelPermalink }} 600w, {{ $image900.RelPermalink }} 900w, {{ $image1200.RelPermalink }} 1200w, {{ $image1600.RelPermalink }} 1600w"
72
-          >
73
-          {{ if or (not (path.Ext .Title)) (or $meta_creator $meta_sameas) }}
74
-            <style>
75
-              .hack header figure[itemtype*="ImageObject"] {
76
-                position: relative;
77
-              }
78
-              .hack header figure[itemtype*="ImageObject"] figcaption {
79
-                position: absolute;
80
-                bottom: 0;
81
-                right: 0;
82
-                text-align: right;
83
-                padding: 15px;
84
-                font-style: oblique;
85
-                font-size: smaller;
86
-                mix-blend-mode: soft-light;
87
-              }
88
-              .hack header figure[itemtype*="ImageObject"] [itemprop="headline"] {
89
-                font-weight: bold;
90
-              }
91
-            </style>
92
-            <figcaption itemprop="caption">
93
-              {{ if not (path.Ext .Title) }}
94
-                <span itemprop="headline">{{ .Title | plainify }}</span>.
95
-              {{ end }}
96
-              {{ if or $meta_creator $meta_sameas }}
97
-                Photo
98
-                {{ if $meta_creator }}
99
-                  by
100
-                  <span itemprop="creator">
101
-                    {{ $meta_creator | plainify -}}
102
-                  </span>
103
-                {{- end }}
104
-                {{- with (urls.Parse $meta_sameas).Host }}
105
-                  on
106
-                  {{ (strings.TrimSuffix (path.Ext .) .) | title }}
107
-                {{- end }}.
108
-              {{ end }}
109
-            </figcaption>
110
-          {{ end }}
111
-        </figure>
112
-      {{ end }}
39
+      {{ partial "image/header.html" . }}
113 40
     </header>
114 41
     {{ partial "toc-maybe.html" . }}
115 42
     <div itemprop="articleBody">

Loading…
Cancel
Save