diff options
-rw-r--r-- | main.go | 1 | ||||
-rw-r--r-- | templates/coins_index.templ | 53 | ||||
-rw-r--r-- | templates/navbar.templ | 4 |
3 files changed, 55 insertions, 3 deletions
@@ -20,6 +20,7 @@ import ( var components = map[string]templ.Component{ "/": templates.Index(), "/about": templates.About(), + "/coins": templates.CoinsIndex(), "/language": templates.Language(), } diff --git a/templates/coins_index.templ b/templates/coins_index.templ new file mode 100644 index 0000000..346cc04 --- /dev/null +++ b/templates/coins_index.templ @@ -0,0 +1,53 @@ +package templates + +import "git.thomasvoss.com/euro-cash.eu/i18n" + +const newsLinkStart = `<a href="/news">` + +templ CoinsIndex() { + {{ p := ctx.Value("printer").(i18n.Printer) }} + <header> + @navbar() + <h1>{ p.T("Euro Coins") }</h1> + </header> + <main> + <p> + @templ.Raw(p.T("On this section of the site you can find everything there is to know about the coins of the Eurozone. For the latest news on coin- and design releases, check out the %snews%s tab!", newsLinkStart, linkEnd)) + </p> + <hr/> + <section> + <div class="grid"> + <a class="no-deco" href="/coins/designs"> + <article> + <header> + <h3>{ p.T("Designs") }</h3> + </header> + <main> + { p.T("View the 600+ different Euro-coin designs!") } + </main> + </article> + </a> + <a class="no-deco" href="#TODO"> + <article> + <header> + <h3>{ p.T("Mintages") }</h3> + </header> + <main> + { p.T("View the mintage figures of all the Euro coins!") } + </main> + </article> + </a> + <a class="no-deco" href="#TODO"> + <article> + <header> + <h3>{ p.T("Varieties") }</h3> + </header> + <main> + { p.T("View all the known Euro varieties!") } + </main> + </article> + </a> + </div> + </section> + </main> +} diff --git a/templates/navbar.templ b/templates/navbar.templ index 4e1d104..384e1de 100644 --- a/templates/navbar.templ +++ b/templates/navbar.templ @@ -4,17 +4,15 @@ import "git.thomasvoss.com/euro-cash.eu/i18n" templ navbar() { {{ p := ctx.Value("printer").(i18n.Printer) }} - <nav> <menu> <li><a href="/">{ p.T("Home") }</a></li> <li><a href="#TODO">{ p.T("News") }</a></li> <li><a href="#TODO">{ p.T("Coin Collecting") }</a></li> - <li><a href="#TODO">{ p.T("Coins") }</a></li> + <li><a href="/coins">{ p.T("Coins") }</a></li> <li><a href="#TODO">{ p.T("Banknotes") }</a></li> <li><a href="#TODO">{ p.T("Jargon") }</a></li> </menu> - <menu> <li> <a |