New genre overview

pages/genres/genres.go

@@ -0,0 +1,11 @@
+package genres
+
+import (
+	"github.com/aerogo/aero"
+	"github.com/animenotifier/notify.moe/components"
+)
+
+// Get ...
+func Get(ctx *aero.Context) string {
+	return ctx.HTML(components.Genres())
+}

pages/genres/genres.pixy

@@ -1,15 +1,9 @@
-component GenreOverview
+component Genres
 	h2.genre-header Genres
 	
-	div
+	.grid
 		each genre in arn.Genres
-			a.light-button.ajax(href="/genres/" + arn.FixGenre(genre))
-				Icon(arn.GetGenreIcon(genre))
-				span= genre
-
-component AnimeInGenre(genre string, animeList []*arn.Anime)
-	h2.genre-header= arn.Capitalize(genre)
-	.genre-anime-list
-		each anime in animeList
-			a.genre-anime-link.ajax(href="/anime/" + toString(anime.ID))
-				img.anime-image.genre-anime-image(src=anime.Image, alt=anime.Title.Romaji, title=anime.Title.Romaji + " (" + toString(anime.Watching) + ")")
+			a.grid-cell.light-button.ajax(href="/genres/" + arn.FixGenre(genre))
+				.genre.grid-cell-content.grid-cell-text
+					Icon(arn.GetGenreIcon(genre))
+					span= genre

pages/genres/genres.styl

@@ -1,22 +1,9 @@
 .genre-header
 	text-align center
 
-.genre-anime-list
-	display flex
-	flex-flow row wrap
-	float none !important
-	justify-content center
-
-.genre-anime-image
-	width 16vw
-	height 9vw
-	min-width 90px
-	min-height 127px
-	max-width 200px
-	max-height 282px
-	object-fit cover
-
-.genre-anime-link
-	margin 0.5em
-	flex-grow 0
-	flex-shrink 0
+.genre
+	font-size 1rem
+	.fa
+		font-size 2rem
+		margin-right 0
+		margin-bottom 1rem