diff options
Diffstat (limited to 'template/base.templ')
| -rw-r--r-- | template/base.templ | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/template/base.templ b/template/base.templ new file mode 100644 index 0000000..bd8c082 --- /dev/null +++ b/template/base.templ @@ -0,0 +1,51 @@ +package template + +import "git.thomasvoss.com/euro-cash.eu/lib" + +templ Base(body templ.Component) { + {{ p := ctx.Value("printer").(lib.Printer) }} + <!DOCTYPE html> + <html lang={ p.Locale.Bcp }> + <head> + <meta charset="UTF-8"/> + <meta name="viewport" content="width=device-width, initial-scale=1.0"/> + <link rel="stylesheet" type="text/css" href="/style.css"/> + <title>Euro Cash</title> + <script type="text/javascript"> + const $ = q => document.querySelector(q); + const $$ = q => document.querySelectorAll(q); + + const validate = theme => + ["light", "dark"].includes(theme) ? theme : "light"; + const toggle = theme => + theme == "light" ? "dark" : "light"; + + const setTheme = theme => { + localStorage.setItem("theme", theme); + $("html").setAttribute("data-theme", theme); + $(`#nav-icon-theme-${theme}`) + .style.display = ""; + $(`#nav-icon-theme-${toggle(theme)}`) + .style.display = "none"; + }; + + document.addEventListener('DOMContentLoaded', _ => { + $("#theme-button").onclick = () => + setTheme(toggle(validate(localStorage.getItem("theme")))); + setTheme(validate(localStorage.getItem("theme"))); + }); + </script> + </head> + <body> + @body + <footer> + <p> + <small> + { p.T("Found a mistake or want to contribute missing information?") } + <a href="/">{ p.T("Feel free to contact us!") }</a> + </small> + </p> + </footer> + </body> + </html> +} |