moving things to use WithLayout and push the darkmode theme to a cookie that is pulled on layout render

This commit is contained in:
James Tombleson 2024-04-14 18:38:09 -07:00
parent 68c44812d8
commit a4d5b7ade3
6 changed files with 14 additions and 8 deletions

View File

@ -4,7 +4,7 @@ import "templ-test/models"
import "templ-test/views/layout" import "templ-test/views/layout"
templ ShowCookie(m models.AllCookies) { templ ShowCookie(m models.AllCookies) {
@layout.Testing("Cookie Explorer") { @layout.WithLayout("Cookie Explorer") {
<h2>These are stored as cookies</h2> <h2>These are stored as cookies</h2>
<p>Username: { m.Username }</p> <p>Username: { m.Username }</p>
<p>JWT Token: { m.Token }</p> <p>JWT Token: { m.Token }</p>

View File

@ -3,7 +3,7 @@ package auth
import "templ-test/views/layout" import "templ-test/views/layout"
templ AuthLogin() { templ AuthLogin() {
@layout.WithLayout("Login", true) { @layout.WithLayout("Login") {
<form hx-post="/auth/login"> <form hx-post="/auth/login">
<div class="mb-3"> <div class="mb-3">
<label for="username" class="form-label">Username</label> <label for="username" class="form-label">Username</label>

View File

@ -3,7 +3,7 @@ package home
import "templ-test/views/layout" import "templ-test/views/layout"
templ Error(message error) { templ Error(message error) {
@layout.Testing("Error") { @layout.WithLayout("Error") {
<h1>Oops... :(</h1> <h1>Oops... :(</h1>
<h3>{ message.Error() } </h3> <h3>{ message.Error() } </h3>
} }

View File

@ -4,14 +4,14 @@ import "templ-test/views/components/bootstrap"
import "templ-test/views/layout" import "templ-test/views/layout"
templ Home() { templ Home() {
@layout.WithLayout("Home", true) { @layout.WithLayout("Home") {
<p> <p>
this should be above the alert this should be above the alert
</p> </p>
@bootstrap.BootstrapAlert("Testing!", bootstrap.VariantDark) @bootstrap.BootstrapAlert("Testing!", bootstrap.VariantDark)
<p>you should now see this under the Alert </p> <p>you should now see this under the Alert </p>
@bootstrap.BootstrapButton("I am in danger", bootstrap.VariantDanger) @bootstrap.BootstrapButton("I am in danger", bootstrap.VariantDanger, bootstrap.ButtonTypeDefault)
@bootstrap.BootstrapButton("I am the darkness", bootstrap.VariantDark) @bootstrap.BootstrapButton("I am the darkness", bootstrap.VariantDark, bootstrap.ButtonTypeDefault)
} }
} }

View File

@ -1,6 +1,6 @@
package layout package layout
templ WithLayout(pageName string, useDarkMode bool) { templ WithLayout(pageName string) {
<html> <html>
@getHtmlHead() @getHtmlHead()
<body> <body>

View File

@ -2,8 +2,14 @@ package layout
import ( import (
"context" "context"
"templ-test/domain"
) )
func useLightOrDarkTheme(ctx context.Context) string { func useLightOrDarkTheme(ctx context.Context) string {
return "dark" cookie := ctx.Value(domain.CookieSettingsDarkMode)
if cookie == "on" {
return "dark"
} else {
return "light"
}
} }