features/cookies-maybe #2

Merged
jtom38 merged 4 commits from features/cookies-maybe into main 2024-04-13 11:53:29 -07:00
9 changed files with 84 additions and 59 deletions
Showing only changes of commit bdd9c8d963 - Show all commits

View File

@ -1,10 +1,10 @@
package auth package auth
import "templ-test/views"
import "templ-test/models" import "templ-test/models"
import "templ-test/views/layout"
templ ShowCookie(m models.AllCookies) { templ ShowCookie(m models.AllCookies) {
@views.WithLayout("Cookie Explorer", true) { @layout.Testing("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

@ -1,9 +1,9 @@
package auth package auth
import "templ-test/views" import "templ-test/views/layout"
templ AuthLogin() { templ AuthLogin() {
@views.WithLayout("Login", true) { @layout.WithLayout("Login", true) {
<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>
@ -20,4 +20,4 @@ templ AuthLogin() {
<button type="submit" class="btn btn-primary">Submit</button> <button type="submit" class="btn btn-primary">Submit</button>
</form> </form>
} }
} }

10
views/home/error.templ Normal file
View File

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

View File

@ -1,9 +1,10 @@
package views package home
import "templ-test/views/components/bootstrap" import "templ-test/views/components/bootstrap"
import "templ-test/views/layout"
templ Home() { templ Home() {
@Testing("Home", true) { @layout.WithLayout("Home", true) {
<p> <p>
this should be above the alert this should be above the alert
</p> </p>
@ -14,9 +15,3 @@ templ Home() {
} }
} }
templ List() {
@Testing("Lists", true) {
}
}

View File

@ -0,0 +1,9 @@
package home
import "templ-test/views/layout"
templ UserSettings() {
@layout.Testing("Settings") {
<h2>This is not ready yet</h2>
}
}

27
views/layout/body.templ Normal file
View File

@ -0,0 +1,27 @@
package layout
templ WithLayout(pageName string, useDarkMode bool) {
<html>
@getHtmlHead()
<body>
@bootstrapNavBar()
@getBodyHeader(pageName)
<div class="container-fluid">
{ children... }
</div>
</body>
</html>
}
templ Testing(pageName string) {
<html>
@getHtmlHead()
<body>
@bootstrapNavBar()
@getBodyHeader(pageName)
<div class="container-fluid">
{ children... }
</div>
</body>
</html>
}

19
views/layout/header.templ Normal file
View File

@ -0,0 +1,19 @@
package layout
templ getHtmlHead() {
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"/>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@1.9.11" integrity="sha384-0gxUXCCR8yv9FM2b+U3FDbsKthCI66oH5IA9fHppQq9DDMHuMauqq1ZHBpJxQ0J0" crossorigin="anonymous"></script>
<meta charset="utf-8"/>
<meta name="twitter:card" content="fill in later"/>
<meta name="twitter:image" content=""/>
<meta name="og:image" content=""/>
</head>
}
templ getBodyHeader(pageName string) {
<header>
<h1>{ pageName }</h1>
</header>
}

View File

@ -1,51 +1,7 @@
package views package layout
templ WithLayout(pageName string, useDarkMode bool) {
<html>
@getHtmlHead()
<body>
@bootstrapNavBar()
@getBodyHeader(pageName)
<div class="container-fluid">
{ children... }
</div>
</body>
</html>
}
templ Testing(pageName string, useDarkMode bool) {
<html>
@getHtmlHead()
<body>
@bootstrapNavBar()
@getBodyHeader(pageName)
<div class="container-fluid">
{ children... }
</div>
</body>
</html>
}
templ getHtmlHead() {
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"/>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@1.9.11" integrity="sha384-0gxUXCCR8yv9FM2b+U3FDbsKthCI66oH5IA9fHppQq9DDMHuMauqq1ZHBpJxQ0J0" crossorigin="anonymous"></script>
<meta charset="utf-8"/>
<meta name="twitter:card" content="fill in later"/>
<meta name="twitter:image" content=""/>
<meta name="og:image" content=""/>
</head>
}
templ getBodyHeader(pageName string) {
<header>
<h1>{ pageName }</h1>
</header>
}
templ bootstrapNavBar() { templ bootstrapNavBar() {
<nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme="dark"> <nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme={ useLightOrDarkTheme(ctx)}>
<div class="container-fluid"> <div class="container-fluid">
<a class="navbar-brand" href="#">Navbar</a> <a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">

9
views/layout/util.go Normal file
View File

@ -0,0 +1,9 @@
package layout
import (
"context"
)
func useLightOrDarkTheme(ctx context.Context) string {
return "dark"
}