mirror of
https://github.com/superseriousbusiness/gotosocial.git
synced 2024-11-24 18:25:57 +03:00
[chore/frontend] refactor header templating, add apple-touch-icon (#1850)
This commit is contained in:
parent
9da20eeecb
commit
23705b31e4
1 changed files with 79 additions and 38 deletions
|
@ -17,64 +17,105 @@
|
||||||
// along with this program. If not, see <http://www.gnu.org/licenses/>.
|
// along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
*/ -}}
|
*/ -}}
|
||||||
|
|
||||||
<!DOCTYPE html>
|
|
||||||
|
|
||||||
|
{{- /*
|
||||||
|
NESTED TEMPLATE DECLARATIONS
|
||||||
|
If some if/else macro is used multiple times, declare it once here instead.
|
||||||
|
When invoking these nested templates, remember to pass in the values passed
|
||||||
|
to the executing template, ie., use '{{ template "example" . }}' not
|
||||||
|
'{{ template "example" }}', otherwise you'll end up with empty variables.
|
||||||
|
*/ -}}
|
||||||
|
{{ define "thumbnailType" }}{{ if .instance.ThumbnailType }}{{ .instance.ThumbnailType }}{{ else }}image/png{{ end }}{{ end }}
|
||||||
|
{{ define "instanceTitle" }}{{ if .ogMeta }}{{ .ogMeta.Title }}{{ else }}{{ .instance.Title }} - GoToSocial{{ end }}{{ end }}
|
||||||
|
|
||||||
|
{{- /*
|
||||||
|
BOILERPLATE GOES HERE
|
||||||
|
*/ -}}
|
||||||
|
<!DOCTYPE html>
|
||||||
<!-- header.tmpl -->
|
<!-- header.tmpl -->
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
|
||||||
|
{{- /*
|
||||||
|
ROBOTS META TAGS
|
||||||
|
If this template was provided with a specific robots meta policy, use that.
|
||||||
|
Otherwise, fall back to a default restrictive policy.
|
||||||
|
See: https://developers.google.com/search/docs/crawling-indexing/robots-meta-tag
|
||||||
|
*/ -}}
|
||||||
<meta name="robots" content="{{ if .robotsMeta }}{{ .robotsMeta }}{{ else }}noindex, nofollow{{ end }}">
|
<meta name="robots" content="{{ if .robotsMeta }}{{ .robotsMeta }}{{ else }}noindex, nofollow{{ end }}">
|
||||||
{{ if .ogMeta }}{{ if .ogMeta.Locale }}
|
|
||||||
<meta name="og:locale" content="{{ .ogMeta.Locale }}">
|
{{- /*
|
||||||
{{ end }}
|
OPEN GRAPH META TAGS
|
||||||
<meta property="og:type" content="{{ .ogMeta.Type }}">
|
To enable fancy previews of links to GtS posts/profiles shared via instant
|
||||||
<meta property="og:title" content="{{ .ogMeta.Title }}">
|
messaging, or other social media, parse out provided Open Graph meta tags.
|
||||||
<meta property="og:url" content="{{ .ogMeta.URL }}">
|
*/ -}}
|
||||||
<meta property="og:site_name" content="{{ .ogMeta.SiteName }}">
|
{{ if .ogMeta -}}
|
||||||
<meta property="og:description" {{ .ogMeta.Description | noescapeAttr }}>
|
{{ if .ogMeta.Locale }}<meta name="og:locale" content="{{ .ogMeta.Locale }}">{{ end }}
|
||||||
{{ if .ogMeta.ArticlePublisher }}
|
<meta property="og:type" content="{{ .ogMeta.Type }}">
|
||||||
<meta property="og:article:publisher" content="{{ .ogMeta.ArticlePublisher }}">
|
<meta property="og:title" content="{{ .ogMeta.Title }}">
|
||||||
<meta property="og:article:author" content="{{ .ogMeta.ArticleAuthor }}">
|
<meta property="og:url" content="{{ .ogMeta.URL }}">
|
||||||
<meta property="og:article:modified_time" content="{{ .ogMeta.ArticleModifiedTime }}">
|
<meta property="og:site_name" content="{{ .ogMeta.SiteName }}">
|
||||||
<meta property="og:article:published_time" content="{{ .ogMeta.ArticlePublishedTime }}">
|
<meta property="og:description" {{ .ogMeta.Description | noescapeAttr }}>
|
||||||
{{ end }}{{ if .ogMeta.ProfileUsername }}
|
{{ if .ogMeta.ArticlePublisher }}
|
||||||
<meta property="og:profile:username" content="{{ .ogMeta.ProfileUsername }}">
|
<meta property="og:article:publisher" content="{{ .ogMeta.ArticlePublisher }}">
|
||||||
{{ end }}
|
<meta property="og:article:author" content="{{ .ogMeta.ArticleAuthor }}">
|
||||||
<meta property="og:image" content="{{ .ogMeta.Image }}">
|
<meta property="og:article:modified_time" content="{{ .ogMeta.ArticleModifiedTime }}">
|
||||||
{{ if .ogMeta.ImageAlt }}
|
<meta property="og:article:published_time" content="{{ .ogMeta.ArticlePublishedTime }}">
|
||||||
<meta property="og:image:alt" content="{{ .ogMeta.ImageAlt }}">
|
{{ end }}
|
||||||
{{ end }}{{ if .ogMeta.ImageWidth }}
|
{{ if .ogMeta.ProfileUsername }}<meta property="og:profile:username" content="{{ .ogMeta.ProfileUsername }}">{{ end }}
|
||||||
<meta property="og:image:width" content="{{ .ogMeta.ImageWidth }}">
|
<meta property="og:image" content="{{ .ogMeta.Image }}">
|
||||||
<meta property="og:image:height" content="{{ .ogMeta.ImageHeight }}">
|
{{ if .ogMeta.ImageAlt }}<meta property="og:image:alt" content="{{ .ogMeta.ImageAlt }}">{{ end }}
|
||||||
{{ end }}{{ end }}
|
{{ if .ogMeta.ImageWidth }}
|
||||||
<link rel="shortcut icon" href="{{ .instance.Thumbnail }}"
|
<meta property="og:image:width" content="{{ .ogMeta.ImageWidth }}">
|
||||||
type="{{ if .instance.ThumbnailType }}{{ .instance.ThumbnailType }}{{ else }}image/png{{ end }}">
|
<meta property="og:image:height" content="{{ .ogMeta.ImageHeight }}">
|
||||||
{{ if .rssFeed }}
|
{{ end }}
|
||||||
<link rel="alternate" type="application/rss+xml" href="{{ .rssFeed }}"
|
{{- end }}
|
||||||
title="{{ if .ogMeta }}{{ .ogMeta.Title }}{{ else }}{{.instance.Title}}{{ end }}">{{ end }}
|
|
||||||
|
{{- /*
|
||||||
|
ICON
|
||||||
|
For icon, provide a link to the instance thumbnail. If the instance admin has
|
||||||
|
set a custom thumbnail, use the type they uploaded, else assume image/png.
|
||||||
|
See: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel#icon
|
||||||
|
*/ -}}
|
||||||
|
<link rel="icon" href="{{ .instance.Thumbnail }}" type="{{ template "thumbnailType" . }}">
|
||||||
|
<link rel="apple-touch-icon" href="{{ .instance.Thumbnail }}" type="{{ template "thumbnailType" . }}">
|
||||||
|
<link rel="apple-touch-startup-image" href="{{ .instance.Thumbnail }}" type="{{ template "thumbnailType" . }}">
|
||||||
|
|
||||||
|
{{- /*
|
||||||
|
RSS FEED
|
||||||
|
To enable automatic rss feed discovery for feed readers, provide the 'alternate'
|
||||||
|
link only if rss is enabled.
|
||||||
|
See: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel#alternate
|
||||||
|
*/ -}}
|
||||||
|
{{ if .rssFeed -}}
|
||||||
|
<link rel="alternate" type="application/rss+xml" href="{{ .rssFeed }}" title="{{ template "instanceTitle" . }}">
|
||||||
|
{{- end }}
|
||||||
|
|
||||||
|
{{- /*
|
||||||
|
STYLESHEET STUFF
|
||||||
|
To try to speed up rendering a little bit, offer a preload for each stylesheet.
|
||||||
|
See: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload.
|
||||||
|
*/ -}}
|
||||||
<link rel="preload" href="/assets/dist/_colors.css" as="style">
|
<link rel="preload" href="/assets/dist/_colors.css" as="style">
|
||||||
<link rel="preload" href="/assets/dist/base.css" as="style">
|
<link rel="preload" href="/assets/dist/base.css" as="style">
|
||||||
{{range .stylesheets}}
|
{{ range .stylesheets }}<link rel="preload" href="{{ . }}" as="style">{{ end }}
|
||||||
<link rel="preload" href="{{.}}" as="style">
|
|
||||||
{{end}}
|
|
||||||
<link rel="stylesheet" href="/assets/dist/_colors.css">
|
<link rel="stylesheet" href="/assets/dist/_colors.css">
|
||||||
<link rel="stylesheet" href="/assets/dist/base.css">
|
<link rel="stylesheet" href="/assets/dist/base.css">
|
||||||
{{range .stylesheets}}
|
{{ range .stylesheets }}<link rel="stylesheet" href="{{ . }}">{{ end }}
|
||||||
<link rel="stylesheet" href="{{.}}">
|
<title>{{ template "instanceTitle" . }}</title>
|
||||||
{{end}}<title>{{ if .ogMeta }}{{ .ogMeta.Title }}{{ else }}{{.instance.Title}} - GoToSocial{{ end }}</title>
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="page">
|
<div class="page">
|
||||||
<header>
|
<header>
|
||||||
<a aria-label="{{.instance.Title}}. Go to instance homepage" href="/" class="nounderline header">
|
<a aria-label="{{ .instance.Title }}. Go to instance homepage" href="/" class="nounderline header">
|
||||||
<img src="{{ .instance.Thumbnail }}"
|
<img src="{{ .instance.Thumbnail }}"
|
||||||
alt="{{ if .instance.ThumbnailDescription }}{{ .instance.ThumbnailDescription }}{{ else }}Instance Logo{{ end }}" />
|
alt="{{ if .instance.ThumbnailDescription }}{{ .instance.ThumbnailDescription }}{{ else }}Instance Logo{{ end }}" />
|
||||||
<h1>
|
<h1>
|
||||||
{{.instance.Title}}
|
{{ .instance.Title }}
|
||||||
</h1>
|
</h1>
|
||||||
</a>
|
</a>
|
||||||
</header>
|
</header>
|
||||||
|
|
Loading…
Reference in a new issue