Turn calendar download link into an icon, vendor font awesome for that.

layouts/_partials/calendar-script.html

@@ -0,0 +1,4 @@
+{{- /* Script for the calendar shortcode, included by the base templates on pages that use it. */ -}}
+{{- with resources.Get "js/calendar.js" | minify | fingerprint -}}
+<script src="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous" defer></script>
+{{- end -}}

layouts/_partials/fa-icon.html

@@ -0,0 +1,10 @@
+{{- /*
+A Font Awesome icon as inline SVG, decorative (hidden from screen readers) and drawn in the
+current text colour. Param: the icon as "style/name", e.g. "regular/calendar-plus"; the files
+are in assets/vendor/fontawesome/. The SVG keeps its attribution comment (CC BY 4.0).
+*/ -}}
+{{- with resources.Get (printf "vendor/fontawesome/%s.svg" .) -}}
+  {{- replace .Content "<svg " `<svg class="fa-icon" aria-hidden="true" focusable="false" ` 1 | safeHTML -}}
+{{- else -}}
+  {{- errorf "fa-icon: no icon %q in assets/vendor/fontawesome/" . -}}
+{{- end -}}

layouts/_shortcodes/calendar.html

@@ -1,6 +1,7 @@
 {{- /*
-Calendar links for one date of a tour: an .ics file (iCalendar, for Apple Calendar, Outlook,
-Thunderbird and most other apps) and a link that adds the event in Google Calendar.
+Calendar link for one date of a tour, shown as a calendar icon: an .ics file (iCalendar), which
+Apple Calendar, Outlook, Thunderbird and most other calendar apps can open. On Android,
+assets/js/calendar.js turns it into a link that adds the date in Google Calendar.
 Meant for the list of dates on a tour page:
 
   * Tag 1 (27.12.) **17:30 Uhr** {{< calendar date="2026-12-27" time="17:30" duration="210" >}}
@@ -70,6 +71,9 @@ title of this date in the schedule data, else the page title).
 
 {{- $file := printf "%s-%s-%s.ics" $slug $date (replace $time ":" "") -}}
 {{- $icsFile := resources.FromString (path.Join (strings.TrimPrefix "/" $page.RelPermalink) $file) $ics -}}
+{{- /* The icon is the same for every date, so the link name for screen readers includes the date. */ -}}
+{{- $when := printf "%s %s" ($start | time.Format "Mon 2.1.") $time -}}
+{{- /* Android's Google Calendar app can't open .ics files; there, calendar.js uses this link instead. */ -}}
 {{- $google := printf "https://calendar.google.com/calendar/render?%s" (querify
   "action" "TEMPLATE"
   "text" $title
@@ -78,7 +82,5 @@ title of this date in the schedule data, else the page title).
   "location" $location
   "ctz" "Europe/Berlin"
 ) -}}
-{{- /* The visible link texts repeat for every date; the hidden part says which date it is. */ -}}
-{{- $when := printf "%s %s" ($start | time.Format "Mon 2.1.") $time -}}
-<span class="tour-calendar"><a href="{{ $icsFile.RelPermalink }}" download="{{ $file }}">{{ i18n "calendar_ics" }}<span class="visually-hidden"> {{ $when }}</span></a> · <a href="{{ $google }}">{{ i18n "calendar_google" }}<span class="visually-hidden"> {{ $when }}</span></a></span>
+<a class="tour-calendar" href="{{ $icsFile.RelPermalink }}" download="{{ $file }}" title="{{ i18n "calendar_ics" }}" data-google-href="{{ $google }}" data-google-title="{{ i18n "calendar_google" }}" data-google-label="{{ i18n "calendar_google" }} {{ $when }}">{{ partial "fa-icon.html" "regular/calendar-plus" }}<span class="visually-hidden">{{ i18n "calendar_ics" }} {{ $when }}</span></a>
 {{- /* chomp */ -}}

layouts/baseof.html

@@ -15,6 +15,7 @@
 {{ block "head" . }}{{ end }}
 {{ if .HasShortcode "schedule" }}{{ partial "schedule-script.html" . }}{{ end }}
 {{ if .HasShortcode "tour-map" }}{{ partial "tour-map-script.html" . }}{{ end }}
+{{ if .HasShortcode "calendar" }}{{ partial "calendar-script.html" . }}{{ end }}
 </head>
 
 <body class="{{ if .IsPage }}single-page{{ else }}list-page{{ end }}{{ if .IsHome }} front{{ end }}{{ with .Section }} section-page--{{ . | urlize }}{{ end }}{{ with $.Param "bodyclass" }} {{ . }}{{ end }}">

layouts/home-baseof.html

@@ -15,6 +15,7 @@
 {{ block "head" . }}{{ end }}
 {{ if .HasShortcode "schedule" }}{{ partial "schedule-script.html" . }}{{ end }}
 {{ if .HasShortcode "tour-map" }}{{ partial "tour-map-script.html" . }}{{ end }}
+{{ if .HasShortcode "calendar" }}{{ partial "calendar-script.html" . }}{{ end }}
 </head>
 
 <body class="{{ if .IsPage }}single-page{{ else }}list-page{{ end }}{{ if .IsHome }} front{{ end }}{{ with .Section }} section-page--{{ . | urlize }}{{ end }}{{ with $.Param "bodyclass" }} {{ . }}{{ end }}">