mirror of
				https://github.com/superseriousbusiness/gotosocial.git
				synced 2025-10-31 08:12:26 -05: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,19 +17,43 @@ | ||||||
| // 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 | ||||||
|  | 			To enable fancy previews of links to GtS posts/profiles shared via instant | ||||||
|  | 			messaging, or other social media, parse out provided Open Graph meta tags. | ||||||
|  | 	*/ -}} | ||||||
|  | 	{{ if .ogMeta -}} | ||||||
|  | 		{{ if .ogMeta.Locale }}<meta name="og:locale" content="{{ .ogMeta.Locale }}">{{ end }} | ||||||
| 		<meta property="og:type" content="{{ .ogMeta.Type }}"> | 		<meta property="og:type" content="{{ .ogMeta.Type }}"> | ||||||
| 		<meta property="og:title" content="{{ .ogMeta.Title }}"> | 		<meta property="og:title" content="{{ .ogMeta.Title }}"> | ||||||
| 		<meta property="og:url" content="{{ .ogMeta.URL }}"> | 		<meta property="og:url" content="{{ .ogMeta.URL }}"> | ||||||
|  | @ -40,41 +64,58 @@ | ||||||
| 			<meta property="og:article:author" content="{{ .ogMeta.ArticleAuthor }}"> | 			<meta property="og:article:author" content="{{ .ogMeta.ArticleAuthor }}"> | ||||||
| 			<meta property="og:article:modified_time" content="{{ .ogMeta.ArticleModifiedTime }}"> | 			<meta property="og:article:modified_time" content="{{ .ogMeta.ArticleModifiedTime }}"> | ||||||
| 			<meta property="og:article:published_time" content="{{ .ogMeta.ArticlePublishedTime }}"> | 			<meta property="og:article:published_time" content="{{ .ogMeta.ArticlePublishedTime }}"> | ||||||
| 	{{ end }}{{ if .ogMeta.ProfileUsername }} |  | ||||||
| 	<meta property="og:profile:username" content="{{ .ogMeta.ProfileUsername }}"> |  | ||||||
| 		{{ end }} | 		{{ end }} | ||||||
|  | 		{{ if .ogMeta.ProfileUsername }}<meta property="og:profile:username" content="{{ .ogMeta.ProfileUsername }}">{{ end }} | ||||||
| 		<meta property="og:image" content="{{ .ogMeta.Image }}"> | 		<meta property="og:image" content="{{ .ogMeta.Image }}"> | ||||||
| 	{{ if .ogMeta.ImageAlt }} | 		{{ if .ogMeta.ImageAlt }}<meta property="og:image:alt" content="{{ .ogMeta.ImageAlt }}">{{ end }} | ||||||
| 	<meta property="og:image:alt" content="{{ .ogMeta.ImageAlt }}"> | 		{{ if .ogMeta.ImageWidth }} | ||||||
| 	{{ end }}{{ if .ogMeta.ImageWidth }} |  | ||||||
| 			<meta property="og:image:width" content="{{ .ogMeta.ImageWidth }}"> | 			<meta property="og:image:width" content="{{ .ogMeta.ImageWidth }}"> | ||||||
| 			<meta property="og:image:height" content="{{ .ogMeta.ImageHeight }}"> | 			<meta property="og:image:height" content="{{ .ogMeta.ImageHeight }}"> | ||||||
| 	{{ end }}{{ end }} | 		{{ end }} | ||||||
| 	<link rel="shortcut icon" href="{{ .instance.Thumbnail }}" | 	{{- end }} | ||||||
| 		type="{{ if .instance.ThumbnailType }}{{ .instance.ThumbnailType }}{{ else }}image/png{{ end }}"> | 
 | ||||||
| 	{{ if .rssFeed }} | 	{{- /* | ||||||
| 	<link rel="alternate" type="application/rss+xml" href="{{ .rssFeed }}" | 			ICON | ||||||
| 		title="{{ if .ogMeta }}{{ .ogMeta.Title }}{{ else }}{{.instance.Title}}{{ end }}">{{ end }} | 			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…
	
	Add table
		Add a link
		
	
		Reference in a new issue