TheMathWizard/views/main.templ.go

package views

import (
	"github.com/chasefleming/elem-go"
	"github.com/chasefleming/elem-go/attrs"
)

func RenderMain() elem.Node {
	mainContent := elem.Main(nil,
		elem.Section(attrs.Props{attrs.Class: "hero"},
			elem.Div(attrs.Props{attrs.Class: "container"},
				elem.Div(attrs.Props{attrs.Class: "hero-inner"},
					elem.Div(attrs.Props{attrs.Class: "hero-copy"},
						elem.H1(attrs.Props{attrs.Class: "hero-title"}, elem.Text("Automatisiere spielerisch das 1x1")),
						elem.P(attrs.Props{attrs.Class: "hero-paragraph"}, elem.Text("Zeige was du kannst und kämpfe dich durch den Dungeon.")),
						elem.Div(attrs.Props{attrs.Class: "hero-cta"},
							elem.A(attrs.Props{attrs.Class: "nes-btn is-primary", attrs.Href: "/login"}, elem.Text("Starte Jetzt!")),
						),
					),
				),
			),
		),
		elem.Section(attrs.Props{attrs.Class: "features section"},
			elem.Div(attrs.Props{attrs.Class: "container"},
				elem.Div(attrs.Props{attrs.Class: "features-inner section-inner has-bottom-divider"},
					elem.Div(attrs.Props{attrs.Class: "features-header text-center"},
						elem.Div(attrs.Props{attrs.Class: "container-sm"},
							elem.H2(attrs.Props{attrs.Class: "section-title"}, elem.Text("The Math Wizard")),
							elem.P(attrs.Props{attrs.Class: "section-paragraph"}, elem.Text("Ohne es zu bemerken lernst du das 1x1.")),
						),
					),

					elem.Div(attrs.Props{attrs.Class: "features-wrap"},
						elem.Div(attrs.Props{attrs.Class: "feature is-revealing"},
							elem.Div(attrs.Props{attrs.Class: "feature-inner"},
								elem.Div(attrs.Props{attrs.Class: "feature-icon"},
									elem.Img(attrs.Props{attrs.Src: "/static/images/weapon_sword_ruby.png", attrs.Alt: "Feature 01"})),
								elem.Div(attrs.Props{attrs.Class: "feature-content"},
									elem.H3(attrs.Props{attrs.Class: "feature-title"}, elem.Text("Immer neue Level")),
									elem.P(attrs.Props{attrs.Class: "text-sm mb-0"}, elem.Text("Spannende, zufallsgeneriete Level im Dungeon-Crawler-Stil.")),
								),
							),
						),
						elem.Div(attrs.Props{attrs.Class: "feature is-revealing"},
							elem.Div(attrs.Props{attrs.Class: "feature-inner"},
								elem.Div(attrs.Props{attrs.Class: "feature-icon"},
									elem.Img(attrs.Props{attrs.Src: "/static/images/monster_imp.png", attrs.Alt: "Feature 02"})),
								elem.Div(attrs.Props{attrs.Class: "feature-content"},
									elem.H3(attrs.Props{attrs.Class: "feature-title"}, elem.Text("Angepasste Schwierigkeit")),
									elem.P(attrs.Props{attrs.Class: "text-sm mb-0"}, elem.Text("Die Aufgaben passen sich deinen aktuellen Fähigkeiten an.")),
								),
							),
						),
						elem.Div(attrs.Props{attrs.Class: "feature is-revealing"},
							elem.Div(attrs.Props{attrs.Class: "feature-inner"},
								elem.Div(attrs.Props{attrs.Class: "feature-icon"},
									elem.Img(attrs.Props{attrs.Src: "/static/images/npc_knight_green.png", attrs.Alt: "Feature 03"})),
								elem.Div(attrs.Props{attrs.Class: "feature-content"},
									elem.H3(attrs.Props{attrs.Class: "feature-title"}, elem.Text("Fokus auf das was zählt")),
									elem.P(attrs.Props{attrs.Class: "text-sm mb-0"}, elem.Text("Fokus auf das Automatisieren der Multiplikation im Zahlenraum von 1 bis 10.")),
								),
							),
						),
						elem.Div(attrs.Props{attrs.Class: "feature is-revealing"},
							elem.Div(attrs.Props{attrs.Class: "feature-inner"},
								elem.Div(attrs.Props{attrs.Class: "feature-icon"},
									elem.Img(attrs.Props{attrs.Src: "/static/images/monster_necromancer.png", attrs.Alt: "Feature 04"})),
								elem.Div(attrs.Props{attrs.Class: "feature-content"},
									elem.H3(attrs.Props{attrs.Class: "feature-title"}, elem.Text("Lernfortschritt immer im Blick")),
									elem.P(attrs.Props{attrs.Class: "text-sm mb-0"}, elem.Text("Lernziel und Fortschrittskontrolle, um deinen Fortschritt zu verfolgen.")),
								),
							),
						),
					),
				),
			),
		),
		elem.Section(attrs.Props{attrs.Class: "cta section"},
			elem.Div(attrs.Props{attrs.Class: "container-sm"},
				elem.Div(attrs.Props{attrs.Class: "cta-inner section-inner"},
					elem.Div(attrs.Props{attrs.Class: "cta-header text-center"},
						elem.H2(attrs.Props{attrs.Class: "section-title"}, elem.Text("Bereit los zu legen?")),
						elem.P(attrs.Props{attrs.Class: "section-paragraph"}, elem.Text("Fange noch heute an zu lernen.")),
						elem.Div(attrs.Props{attrs.Class: "cta-cta"},
							elem.A(attrs.Props{attrs.Class: "nes-btn is-primary", attrs.Href: "/login"},
								elem.Text("Los geht's")),
						),
					),
				),
			),
		),
	)
	return mainContent
}