Compare commits

...

2 Commits

Author SHA1 Message Date
ekzyis 64e5478c5f Fix error pages 2024-07-12 07:13:01 +02:00
ekzyis 79c6302af3 Use hx-* attributes 2024-07-12 07:13:01 +02:00
7 changed files with 93 additions and 77 deletions

View File

@ -29,17 +29,23 @@
@apply pb-1; @apply pb-1;
} }
a { a,
button[hx-get],
button[hx-post] {
text-decoration: underline; text-decoration: underline;
transition: background-color 150ms ease-in, color 150ms ease-in; transition: background-color 150ms ease-in, color 150ms ease-in;
} }
a:hover { a:hover,
button[hx-get]:hover,
button[hx-post]:hover {
background-color: var(--color); background-color: var(--color);
color: var(--background-color); color: var(--background-color);
} }
nav a { nav a,
button[hx-get],
button[hx-post] {
padding: 0 0.25em; padding: 0 0.25em;
} }

View File

@ -7,9 +7,8 @@ templ About() {
@components.Head() @components.Head()
<body class="container"> <body class="container">
@components.Header() @components.Header()
<div class="flex flex-col text-center"> <div id="content" class="flex flex-col text-center">
@components.Figlet("random", "about") @components.Figlet("random", "about")
</div>
<div class="flex flex-col mb-3"> <div class="flex flex-col mb-3">
<h1>📈 Prediction market?</h1> <h1>📈 Prediction market?</h1>
<p>Here is an animated corgi that explains everything you need to know about prediction markets in 7 minutes:</p> <p>Here is an animated corgi that explains everything you need to know about prediction markets in 7 minutes:</p>
@ -69,6 +68,7 @@ templ About() {
>nostr</a> >nostr</a>
</div> </div>
</div> </div>
</div>
@components.Footer() @components.Footer()
</body> </body>
</html> </html>

View File

@ -13,6 +13,16 @@ templ Head() {
<link rel="stylesheet" href="/css/tailwind.css"/> <link rel="stylesheet" href="/css/tailwind.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/> <meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta name="theme-color" content="#091833"/> <meta name="theme-color" content="#091833"/>
<meta
name="htmx-config"
content='{
"responseHandling": [
{ "code": "204", "swap": false },
{ "code": "[23]..", "swap": true },
{ "code": "[45]..", "swap": true, "error": true }
]
}'
/>
<script src="/js/htmx.js" integrity="sha384-Xh+GLLi0SMFPwtHQjT72aPG19QvKB8grnyRbYBNIdHWc2NkCrz65jlU7YrzO6qRp" crossorigin="anonymous"></script> <script src="/js/htmx.js" integrity="sha384-Xh+GLLi0SMFPwtHQjT72aPG19QvKB8grnyRbYBNIdHWc2NkCrz65jlU7YrzO6qRp" crossorigin="anonymous"></script>
if ctx.Value(c.EnvContextKey) == "development" { if ctx.Value(c.EnvContextKey) == "development" {
<script defer src="/js/hotreload.js"></script> <script defer src="/js/hotreload.js"></script>

View File

@ -4,16 +4,16 @@ import c "git.ekzyis.com/ekzyis/delphi.market/server/router/context"
templ Header() { templ Header() {
<header class="mt-3"> <header class="mt-3">
<nav class="flex flex-row"> <nav class="flex flex-row" hx-target="#content" hx-swap="outerHTML" hx-select="#content" hx-push-url="true">
<div> <div>
<a href="/">home</a> <button hx-get="/">home</button>
</div> </div>
<div class="ms-auto"> <div class="ms-auto">
<a href="/about">about</a> <button hx-get="/about">about</button>
if ctx.Value(c.SessionContextKey) != nil { if ctx.Value(c.SessionContextKey) != nil {
<a href="/user">user</a> <button hx-get="/user">user</button>
} else { } else {
<a href="/login">login</a> <button hx-get="/signup">signup</button>
} }
</div> </div>
</nav> </nav>

View File

@ -11,7 +11,7 @@ templ Error(code int) {
@components.Head() @components.Head()
<body class="container"> <body class="container">
@components.Header() @components.Header()
<div class="flex flex-col text-center"> <div id="content" class="flex flex-col text-center">
@components.Figlet("random", strconv.Itoa(code)) @components.Figlet("random", strconv.Itoa(code))
<div class="font-mono mb-3">{ http.StatusText(code) }</div> <div class="font-mono mb-3">{ http.StatusText(code) }</div>
</div> </div>

View File

@ -7,7 +7,7 @@ templ Index() {
@components.Head() @components.Head()
<body class="container"> <body class="container">
@components.Header() @components.Header()
<div class="flex flex-col text-center"> <div id="content" class="flex flex-col text-center">
@components.Figlet("random", "delphi") @components.Figlet("random", "delphi")
<div class="font-mono my-3">A prediction market using the lightning network</div> <div class="font-mono my-3">A prediction market using the lightning network</div>
</div> </div>

View File

@ -7,9 +7,8 @@ templ Login() {
@components.Head() @components.Head()
<body class="container"> <body class="container">
@components.Header() @components.Header()
<div class="flex flex-col text-center"> <div id="content" class="flex flex-col text-center">
@components.Figlet("random", "login") @components.Figlet("random", "login")
</div>
<div class="flex flex-col mb-3 text-center"> <div class="flex flex-col mb-3 text-center">
<button class="login lightning my-3">login with lightning</button> <button class="login lightning my-3">login with lightning</button>
<button class="login nostr my-3">login with nostr</button> <button class="login nostr my-3">login with nostr</button>
@ -17,6 +16,7 @@ templ Login() {
<div class="flex flex-col mb-3 text-center"> <div class="flex flex-col mb-3 text-center">
<small><a class="text-muted" href="/signup">new here?</a></small> <small><a class="text-muted" href="/signup">new here?</a></small>
</div> </div>
</div>
@components.Footer() @components.Footer()
</body> </body>
</html> </html>