Improved meta data

layout/layout.pixy

@@ -1,7 +1,10 @@
 component Layout(app *aero.Application, ctx *aero.Context, user *arn.User, openGraph *arn.OpenGraph, content string)
 	html(lang="en")
 		head
-			title= app.Config.Title
+			if openGraph != nil
+				title= openGraph.Tags["og:title"]
+			else
+				title= app.Config.Title
 
 			meta(name="viewport", content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes")
 			meta(name="theme-color", content=app.Config.Manifest.ThemeColor)

pages/anime/anime.go

@@ -11,6 +11,7 @@ import (
 
 const maxEpisodes = 26
 const maxEpisodesLongSeries = 5
+const maxDescriptionLength = 170
 
 // Get anime page.
 func Get(ctx *aero.Context) string {
@@ -40,16 +41,23 @@ func Get(ctx *aero.Context) string {
 	}
 
 	// Open Graph
+	description := anime.Summary
+
+	if len(description) > maxDescriptionLength {
+		description = description[:maxDescriptionLength-3] + "..."
+	}
+
 	openGraph := &arn.OpenGraph{
 		Tags: map[string]string{
 			"og:title":       anime.Title.Canonical,
 			"og:image":       anime.Image.Large,
 			"og:url":         "https://" + ctx.App.Config.Domain + anime.Link(),
 			"og:site_name":   "notify.moe",
-			"og:description": anime.Summary,
+			"og:description": description,
 		},
 		Meta: map[string]string{
-			"description": anime.Summary,
+			"description": description,
+			"keywords":    anime.Title.Canonical + ",anime",
 		},
 	}
 

pages/anime/anime.pixy

@@ -7,13 +7,13 @@ component Anime(anime *arn.Anime, tracks []*arn.SoundTrack, user *arn.User, epis
 		.space
 
 		.anime-info
-			h2.anime-title(title=anime.Type)= anime.Title.Canonical
+			h1.anime-title(title=anime.Type)= anime.Title.Canonical
 
 			//- if user && user.titleLanguage === "japanese"
 			//- 	span.second-title(title=anime.Title.English !== anime.Title.Romaji ? anime.Title.English : null)= anime.Title.Romaji
 			//- else
 			if anime.Title.Japanese != anime.Title.Canonical
-				.anime-alternative-title
+				h2.anime-alternative-title
 					a(href="http://jisho.org/search/" + anime.Title.Japanese, target="_blank", title="Look up reading on jisho.org", rel="nofollow")= anime.Title.Japanese
 
 			//- h3.anime-section-name.anime-summary-header Summary

pages/anime/anime.scarlet

@@ -38,7 +38,11 @@
 
 .anime-alternative-title
 	font-size 0.9em
+	margin-top 0
 	margin-bottom 0.5rem
+	text-align left
+	font-weight normal
+	line-height content-line-height
 	a
 		color rgba(60, 60, 60, 0.5) !important
 

pages/frontpage/frontpage.go

@@ -2,10 +2,27 @@ package frontpage
 
 import (
 	"github.com/aerogo/aero"
+	"github.com/animenotifier/arn"
 	"github.com/animenotifier/notify.moe/components"
 )
 
 // Get ...
 func Get(ctx *aero.Context) string {
+	description := "Anime list and notifier for new anime episodes. Create your own anime list and keep track of your progress as you watch."
+
+	ctx.Data = &arn.OpenGraph{
+		Tags: map[string]string{
+			"og:title":       ctx.App.Config.Title,
+			"og:description": description,
+			"og:type":        "website",
+			"og:url":         "https://" + ctx.App.Config.Domain,
+			"og:image":       "https://" + ctx.App.Config.Domain + "/images/brand/600",
+		},
+		Meta: map[string]string{
+			"description": description,
+			"keywords":    "anime,list,tracker,notifier",
+		},
+	}
+
 	return ctx.HTML(components.FrontPage())
 }

pages/frontpage/frontpage.pixy

@@ -1,8 +1,8 @@
 component FrontPage
 	.frontpage.mountable
-		h2 notify.moe
+		h1 notify.moe
 
-		p Your home for everything about anime.
+		h2 Your home for everything about anime.
 
 		//- img.action.screenshot(src="/images/elements/extension-screenshot.png", alt="Screenshot of the browser extension", title="Click to install the Chrome Extension", data-action="installExtension", data-trigger="click")
 		

pages/frontpage/frontpage.scarlet

@@ -6,19 +6,21 @@
 	left 50%
 	transform translateX(-50%) translateY(-50%)
 	
-	a, h2, p
+	a, h1, h2
 		color white !important
 		text-shadow 0px 0px 4px rgb(0, 0, 0, 0.75)
 
-	h2
+	h1
 		font-size 2.5rem
 		font-weight normal
 		letter-spacing 5px
 		text-transform uppercase
 		line-height 1.2em
 
-	p
+	h2
 		font-size 2rem
+		font-weight normal
+		margin-top 0
 		margin-bottom 1em
 		line-height 1.2em
 		text-align center

styles/content.scarlet

@@ -2,4 +2,4 @@
 	vertical
 	padding content-padding
 	padding-top content-padding-top
-	line-height 1.7em
+	line-height content-line-height

styles/forum.scarlet

@@ -26,16 +26,21 @@ post-content-padding-y = 0.75rem
 	h1
 		font-size 1.5rem
 		line-height 1.5em
+		text-align left
+		margin typography-margin 0
 
 	h2
 		font-size 1.3rem
 		line-height 1.5em
 		font-weight normal
+		text-align left
+		margin typography-margin 0
 
 	h3
 		font-size 1.1rem
 		line-height 1.5em
 		font-weight normal
+		text-align left
 	
 	:hover
 		.post-toolbar

styles/headers.scarlet

@@ -1,7 +1,4 @@
-h1
+h1, h2
-	font-size 3em
-
-h2
 	font-size 2em
 	font-weight bold
 	text-align center
@@ -13,7 +10,7 @@ h3
 	text-align left
 	margin-top 0.6em
 
-h2, h3
+h1, h2, h3
 	a
 		color text-color
 

styles/include/config.scarlet

@@ -59,8 +59,10 @@ outline-shadow-heavy = 0 0 6px rgba(0, 0, 0, 0.6)
 // Distances
 content-padding = 1.6rem
 content-padding-top = 1.6rem
+content-line-height = 1.7em
 hover-line-size = 3px
 nav-height = 3.11rem
+typography-margin = 0.4rem
 
 // Timings
 fade-speed = 200ms

styles/typography.scarlet

@@ -1,5 +1,5 @@
 p, h1, h2, h3, h4, h5, h6
-	margin 0.4rem 0
+	margin typography-margin 0
 
 	:first-child
 		margin-top 0
@@ -7,7 +7,7 @@ p, h1, h2, h3, h4, h5, h6
 	:last-child
 		margin-bottom 0
 
-h2
+h1, h2
 	margin-top content-padding
 	margin-bottom content-padding