Change permalink

archetypes/gallery.md

@@ -0,0 +1,10 @@
+---
+title: "{{ replace .Name "-" " " | title }}"
+date: {{ .Date }}
+lastmod: {{ .Date }}
+location:
+shot_on:
+description:
+draft: true
+images:
+---

assets/scss/partials/_footer.scss

@@ -1,8 +1,9 @@
 #site-footer {
   font-size: 0.8em;
   padding-top: 1em;
-  margin-top: 1em;
+  margin-top: 2em;
   background-color: var(--c-bg-alt);
+  letter-spacing: normal;
 }
 
 p.site-copy {

assets/scss/partials/_home.scss

@@ -17,11 +17,12 @@
 }
 #home-nav {
   margin: 1em 0;
-  a {
+  letter-spacing: normal;
+  > a {
     display: inline-block;
     border: 1px solid;
     border-radius: 4px;
-    padding: .2em .4em;
+    padding: .1em .4em;
     font-size: .8em;
     margin-top: .5em;
   }
@@ -47,4 +48,5 @@
 #home-footer {
   padding: 0 10vw;
   font-size: .8em;
+  letter-spacing: normal;
 }

assets/scss/partials/_list.scss

@@ -34,3 +34,47 @@
     color: var(--c-txt-alt);
   }
 }
+
+// Gallery Page
+//
+.album {
+  margin-top: 1em;
+  margin-bottom: 2.5em;
+}
+
+.album-title {
+  margin-bottom: 0;
+  font-weight: normal;
+  > a {
+    border: none;
+  }
+}
+
+.album-date {
+  margin-top: .5em;
+  margin-bottom: .8em;
+  font-size: .8em;
+  color: var(--c-txt-alt);
+}
+
+.album-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 1em;
+  border: none;
+  &::after {
+    content: '';
+    display: block;
+    flex-grow: 10;
+  }
+}
+.img-tile {
+  height: 100px;
+  flex: 1;
+  & > img {
+    max-height: 100%;
+    min-width: 100%;
+    object-fit: cover;
+    vertical-align: bottom;
+  }
+}

assets/scss/partials/_single.scss

@@ -235,3 +235,20 @@ hr.post-end {
     text-transform: uppercase;
   }
 }
+
+// Gallery Page
+//
+.album-meta {
+  color: var(--c-txt-alt);
+  font-size: .8em;
+  > p {
+    margin: 0;
+    &.album-desc {
+      margin-top: 1em;
+      line-height: normal;
+    }
+    > .feather {
+      margin-right: 1em;
+    }
+  }
+}

assets/scss/style.scss

@@ -234,6 +234,9 @@ h1#page-title {
   .recent-posts-list a {
     display: inline;
   }
+  .img-tile {
+    height: 150px;
+  }
 }
 
 @media all and (min-width: 810px) {
@@ -260,6 +263,9 @@ h1#page-title {
   .content figure.big {
     margin-left: calc(390px - var(--vw) * 50 - 1em);
   }
+  .img-tile {
+    height: 200px;
+  }
 }
 
 @media all and (min-width: 1250px) {

config.toml

@@ -55,8 +55,13 @@ googleAnalytics = "UA-125057333-1"
 
   [[menu.main]]
     name = "Writing"
-    url = "/posts/"
-    weight = 20
+    url = "/writing/"
+    weight = 10
+
+  # [[menu.main]]
+  #   name = "Gallery"
+  #   url = "/gallery/"
+  #   weight = 20
 
   [[menu.main]]
     name = "Links"

layouts/404.html

@@ -14,7 +14,7 @@
 		<p>Oops, page not found…</p>
 		<p class="btn-404">
 			<a href="{{.Site.BaseURL}}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg>&nbsp;Home</a>
-			<a href="{{ "posts" | absURL }}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-archive"><polyline points="21 8 21 21 3 21 3 8"></polyline><rect x="1" y="3" width="22" height="5"></rect><line x1="10" y1="12" x2="14" y2="12"></line></svg>&nbsp;Archives</a>
+			<a href="{{ "writing" | absURL }}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-archive"><polyline points="21 8 21 21 3 21 3 8"></polyline><rect x="1" y="3" width="22" height="5"></rect><line x1="10" y1="12" x2="14" y2="12"></line></svg>&nbsp;Archives</a>
 		</p>
 	</div>
 {{ end }}

layouts/gallery/list.html

@@ -0,0 +1,35 @@
+{{ define "header" }}
+{{ partialCached "header.html" . }}
+{{ end }}
+
+{{ define "main" }}
+	<main id="site-main" class="wrapper">
+		<div class="title-area">
+			<a id="home-btn" title="{{.Site.Title}}" href="{{.Site.BaseURL}}"><img src="/apple-touch-icon.png" width="180" height="180" alt="Logo"></a>
+			<h1 id="page-title" class="title-area-l">{{ .Title }}</h1>
+		</div>
+		{{- if .Content }}
+		<div class="content">
+			{{ .Content }}
+		</div>
+		{{- end }}
+		{{- range .Pages }}
+		<div class="album">
+			<h2 class="album-title">
+				{{ $abulmLink := .Permalink -}}
+				<a href="{{ $abulmLink }}">{{.Title}}</a>
+			</h2>
+			<p class="album-date">{{ .Date.Format .Site.Params.dateform }}</p>
+			<a href="{{ $abulmLink }}" class="album-row">
+				{{- range .Params.images -}}
+				<div class="img-tile"><img src="{{. | absURL}}" loading="lazy"></div>
+				{{- end -}}
+			</a>
+		</div>
+		{{- end }}
+	</main>
+{{ end }}
+
+{{ define "footer" }}
+{{ partialCached "footer.html" . }}
+{{ end }}

layouts/gallery/single.html

@@ -0,0 +1,50 @@
+{{ define "header" }}
+{{ partialCached "header.html" . }}
+{{ end }}
+
+{{ define "main" }}
+	<main id="site-main" class="wrapper">
+		<article>
+			<header class="post-header">
+				<div class="title-area">
+					<a id="home-btn" title="{{.Site.Title}}" href="{{.Site.BaseURL}}"><img src="/apple-touch-icon.png" width="180" height="180" alt="Logo"></a>
+					<div class="title-area-l">
+						<h1 id="page-title">{{ .Title }}</h1>
+					</div>
+				</div>
+				<div class="album-meta">
+					{{ with .Params.location -}}
+					<p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-map-pin"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path><circle cx="12" cy="10" r="3"></circle></svg>{{ . }}</p>
+					{{ end -}}
+					<p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>{{ dateFormat .Site.Params.dateform .Date }}</p>
+					{{ with .Params.shot_on -}}
+					<p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-camera"><path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"></path><circle cx="12" cy="13" r="4"></circle></svg>{{ . }}</p>
+					{{ end -}}
+					{{ with .Params.description -}}
+					<p class="album-desc">{{ . }}</p>
+					{{ end -}}
+				</div>
+			</header>
+			<div class="content">
+				{{ .Content }}
+			</div>
+		</article>
+		<div class="post-nav">
+			{{- with .NextInSection }}
+			<a class="next-post" href="{{ .Permalink }}">
+				<span class="post-nav-label"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>&nbsp;Newer</span><br><span>{{ .Title }}</span>
+			</a>
+			{{- end }}
+			{{- with .PrevInSection }}
+			<a class="prev-post" href="{{ .Permalink }}">
+				<span class="post-nav-label">Older&nbsp;<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></span><br><span>{{ .Title }}</span>
+			</a>
+			{{- end }}
+		</div>
+		{{ partialCached "comments.html" . }}
+	</main>
+{{ end }}
+
+{{ define "footer" }}
+{{ partialCached "footer.html" . }}
+{{ end }}

layouts/index.html

@@ -21,8 +21,8 @@
 		<div id="recent-posts">
 			<div>Recent Posts</div>
 			<ul class="recent-posts-list">
-				{{ $writingList := (sort ( where site.RegularPages "Type" "in" "posts" ) "Date" "desc") -}}
-				{{ range first 3 $writingList -}}
+				{{ $articleList := (sort ( where site.RegularPages "Type" "in" "writing" ) "Date" "desc") -}}
+				{{ range first 3 $articleList -}}
 				<li>
 					<span>{{ .Date.Format .Site.Params.dateformNum }} </span>
 					<a href="{{.Permalink}}">{{.Title}}</a>
@@ -34,7 +34,7 @@
 	<div id="home-footer">
 		<p>
 			&copy; {{ now.Format "2006" }} <a href="{{ .Site.BaseURL }}">{{ .Site.Author.name }}</a>
-			{{- with (not (in (.Site.Language.Get "disableKinds") "RSS")) }} &#183; <a href="{{ "posts/index.xml" | absURL }}" target="_blank" title="rss"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-rss"><path d="M4 11a9 9 0 0 1 9 9"></path><path d="M4 4a16 16 0 0 1 16 16"></path><circle cx="5" cy="19" r="1"></circle></svg></a>{{ end }}
+			{{- with (not (in (.Site.Language.Get "disableKinds") "RSS")) }} &#183; <a href="{{ "writing/index.xml" | absURL }}" target="_blank" title="rss"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-rss"><path d="M4 11a9 9 0 0 1 9 9"></path><path d="M4 4a16 16 0 0 1 16 16"></path><circle cx="5" cy="19" r="1"></circle></svg></a>{{ end }}
 		</p>
 	</div>
 {{ end }}

layouts/partials/footer.html

@@ -12,7 +12,7 @@
 					<a href="{{ .URL }}">{{ .Name }}</a><span>&#47;</span>
 					{{- end }}
 				</nav>
-				<p class="site-copy">&copy; {{ now.Format "2006" }} <a href="{{ .Site.BaseURL }}">{{ .Site.Author.name }}</a> &#183; <a href="https://creativecommons.org/licenses/by-nc/4.0/deed.zh" target="_blank" rel="noopener">CC BY-NC 4.0</a> &#183; <a href="{{ "posts/index.xml" | absURL }}" target="_blank" title="RSS" class="icon-link"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-rss"><path d="M4 11a9 9 0 0 1 9 9"></path><path d="M4 4a16 16 0 0 1 16 16"></path><circle cx="5" cy="19" r="1"></circle></svg></a></p>
+				<p class="site-copy">&copy; {{ now.Format "2006" }} <a href="{{ .Site.BaseURL }}">{{ .Site.Author.name }}</a> &#183; <a href="https://creativecommons.org/licenses/by-nc/4.0/deed.zh" target="_blank" rel="noopener">CC BY-NC 4.0</a> &#183; <a href="{{ "writing/index.xml" | absURL }}" target="_blank" title="RSS" class="icon-link"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-rss"><path d="M4 11a9 9 0 0 1 9 9"></path><path d="M4 4a16 16 0 0 1 16 16"></path><circle cx="5" cy="19" r="1"></circle></svg></a></p>
 			</div>
 		</div>
 	</footer>

layouts/shortcodes/photo.html

@@ -0,0 +1,26 @@
+{{ $src := .Get "src"}}
+{{ $image := (.Page.Resources.ByType "image").GetMatch (printf "**%s**" $src) -}}
+<figure>
+	<img src="{{$src}}" loading="lazy"
+			 {{- if or (.Get "alt") (.Get "caption") }}
+			 alt="{{ with .Get "alt" }}{{ . }}{{ else }}{{ .Get "caption" | markdownify| plainify }}{{ end }}"
+			 {{- end -}}
+			 {{- with $image.Width }} width="{{ . }}"{{ end -}}
+			 {{- with $image.Height }} height="{{ . }}"{{ end -}}
+	/><!-- Closing img tag -->
+	<figcaption>
+		{{ with (.Get "title") -}}
+		<h4>{{ . }}</h4>
+		{{ end -}}
+		{{- .Get "caption" | markdownify -}}
+		{{ with $image.Exif -}}
+		<div class="image_meta">
+			{{ with .Tags.Model }}{{.}} {{ end -}}
+			{{ with .Tags.FocalLength }}@ {{.}}mm {{ end -}}
+			{{ with .Tags.FNumber }}&mdash; &fnof;/{{.}}{{ end -}}
+			{{ with .Tags.ExposureTime }}, {{ lang.FormatNumber 2 . }} sec{{ end -}}
+			{{ with .Tags.ISOSpeedRatings }}, ISO {{.}} {{ end }}
+		</div>
+		{{ end -}}
+	</figcaption>
+</figure>

layouts/writing/rss.xml

@@ -0,0 +1,27 @@
+<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
+	<channel>
+		<title>{{ if eq  .Title  .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
+		<link>{{ .Permalink }}</link>
+		<description>Recent {{ with .Title }}{{. | humanize}}{{ end }} on {{ .Site.Title }}</description>
+		<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
+		<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
+		<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
+		<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
+		<copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
+		<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
+		{{ with .OutputFormats.Get "RSS" -}}
+				{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
+		{{ end -}}
+		{{ range .Pages }}
+		<item>
+			<title>{{ .Title }}</title>
+			<link>{{ .Permalink }}</link>
+			<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
+			{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
+			<guid>{{ .Permalink }}</guid>
+			<description>{{ .Summary | html }}</description>
+			<content type="html">{{ printf `<![CDATA[%s]]>` .Content | safeHTML }}</content>
+		</item>
+		{{ end }}
+	</channel>
+</rss>

layouts/writing/single.html

@@ -0,0 +1,72 @@
+{{ define "head" }}
+	{{ if .Params.images -}}
+		{{- range first 1 .Params.images -}}
+		<style>:root{ --bg-img: url({{. | absURL}});}</style>
+		{{- end -}}
+	{{- end -}}
+{{ end }}
+
+{{ define "header" }}
+{{ partialCached "header.html" . }}
+{{ end }}
+
+{{ define "main" }}
+	<main id="site-main" class="wrapper">
+		<article>
+			<header class="post-header">
+				<div class="title-area">
+					<a id="home-btn" title="{{.Site.Title}}" href="{{.Site.BaseURL}}"><img src="/apple-touch-icon.png" width="180" height="180" alt="Logo"></a>
+					<div class="title-area-l">
+						<div id="post-header-date">{{ .Date.Format .Site.Params.dateform }}</div>
+						<h1 id="page-title">{{ .Title }}</h1>
+					</div>
+				</div>
+				{{- if .Params.toc }}
+				<button id="toc-btn" title="目录"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-list"><line x1="8" y1="6" x2="21" y2="6"></line><line x1="8" y1="12" x2="21" y2="12"></line><line x1="8" y1="18" x2="21" y2="18"></line><line x1="3" y1="6" x2="3" y2="6"></line><line x1="3" y1="12" x2="3" y2="12"></line><line x1="3" y1="18" x2="3" y2="18"></line></svg> 目录</button>
+				{{- end }}
+			</header>
+			{{- if .Params.toc }}
+			<div id="toc">
+				<p class="toc-title">目录</p>
+				{{ .TableOfContents }}
+			</div>
+			{{- end }}
+			<div class="content">
+				{{ .Content }}
+			</div>
+			<hr class="post-end">
+			<footer class="post-info">
+				{{- with .Params.tags }}
+				<p>
+					<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-tag meta-icon"><path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"></path><line x1="7" y1="7" x2="7" y2="7"></line></svg>
+					{{- range . -}}
+					<span class="tag"><a href="{{ "tags/" | absURL }}{{ . | urlize }}">{{.}}</a></span>
+					{{- end }}
+				</p>
+				{{- end }}
+				<p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file-text"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>{{ .WordCount }} Words</p>
+				<p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-calendar"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>{{ dateFormat .Site.Params.dateformNumTime .Date.Local }}</p>
+				{{- if .GitInfo }}
+				<p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-git-commit"><circle cx="12" cy="12" r="4"></circle><line x1="1.05" y1="12" x2="7" y2="12"></line><line x1="17.01" y1="12" x2="22.96" y2="12"></line></svg><a href="{{ .Site.Params.gitUrl -}}{{ .GitInfo.Hash }}" target="_blank" rel="noopener">{{ .GitInfo.AbbreviatedHash }}</a> @ {{ dateFormat .Site.Params.dateformNum .GitInfo.AuthorDate.Local }}</p>
+				{{- end }}
+			</footer>
+		</article>
+		<div class="post-nav">
+			{{- with .NextInSection }}
+			<a class="next-post" href="{{ .Permalink }}">
+				<span class="post-nav-label"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>&nbsp;Newer</span><br><span>{{ .Title }}</span>
+			</a>
+			{{- end }}
+			{{- with .PrevInSection }}
+			<a class="prev-post" href="{{ .Permalink }}">
+				<span class="post-nav-label">Older&nbsp;<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></span><br><span>{{ .Title }}</span>
+			</a>
+			{{- end }}
+		</div>
+		{{ partialCached "comments.html" . }}
+	</main>
+{{ end }}
+
+{{ define "footer" }}
+{{ partialCached "footer.html" . }}
+{{ end }}

vercel.json

@@ -0,0 +1,19 @@
+{
+  "redirects": [
+    {
+      "source": "/posts/:path",
+      "destination": "/writing/:path",
+      "permanent": true
+    },
+    {
+      "source": "/post/:path",
+      "destination": "/writing/:path",
+      "permanent": true
+    },
+    {
+      "source": "/friends",
+      "destination": "/links",
+      "permanent": true
+    }
+  ]
+}