New genre overview

pages/genre/genre.go

@@ -0,0 +1,21 @@
+package genre
+
+import (
+	"github.com/aerogo/aero"
+	"github.com/animenotifier/arn"
+	"github.com/animenotifier/notify.moe/components"
+)
+
+// Get ...
+func Get(ctx *aero.Context) string {
+	genreName := ctx.Get("name")
+	genreInfo := new(arn.Genre)
+
+	err := arn.GetObject("Genres", genreName, genreInfo)
+
+	if err != nil {
+		return err.Error()
+	}
+
+	return ctx.HTML(components.Genre(genreInfo.Genre, genreInfo.AnimeList))
+}

pages/genre/genre.pixy

@@ -0,0 +1,6 @@
+component Genre(genre string, animeList []*arn.Anime)
+	h2.genre-header= arn.Capitalize(genre)
+	.grid
+		each anime in animeList
+			a.grid-cell.ajax(href="/anime/" + toString(anime.ID))
+				img.anime-image.grid-cell-content.grid-cell-image(src=anime.Image, alt=anime.Title.Romaji, title=anime.Title.Romaji + " (" + toString(anime.Watching) + ")")

pages/genre/genre.styl

@@ -0,0 +1,28 @@
+.grid
+	display flex
+	flex-flow row wrap
+	float none !important
+	justify-content center
+
+.grid-cell
+	margin 0.5em
+	flex-grow 0
+	flex-shrink 0
+
+.grid-cell-content
+	width 16vw
+	height 9vw
+	min-width 90px
+	min-height 127px
+	max-width 200px
+	max-height 282px
+
+.grid-cell-image
+	object-fit cover
+
+.grid-cell-text
+	display flex
+	flex-flow column
+	align-items center
+	justify-content center
+	padding 0.75em