x/web-app-template
Archived
Template
2
0
Fork 0
Code Issues 13 Pull Requests 4 Actions Packages Activity

fix(deps): remove daisyui classes
All checks were successful
Build Docker Image / Build-Docker-Image (push) Successful in 2m45s
Details

Browse Source
This commit is contained in:
Tim Wundenberg
2025-02-03 22:14:56 +01:00
parent 4a7551a7f7
commit 2f94cdda0f
9 changed files with 167 additions and 179 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
input.css
View File

@@ -1,6 +1,7 @@
@import 'tailwindcss';
@source './static/**/*.js';
@source './template/**/*.templ';
@theme {
--animate-fade: fadeOut 0.25s ease-in;
@@ -15,20 +16,3 @@
}
}
/*
The default border color has changed to `currentColor` in Tailwind CSS v4,
so we've added these compatibility styles to make sure everything still
looks the same as it did with Tailwind CSS v3.
If we ever want to remove these styles, we need to add an explicit border
color utility to any element that depends on these defaults.
*/
@layer base {
*,
::after,
::before,
::backdrop,
::file-selector-button {
border-color: var(--color-gray-200, currentColor);
}
}

4
template/auth/delete_account.templ
View File

@@ -12,7 +12,7 @@ templ DeleteAccountComp() {
<p class="text-xl text-red-500 mb-4">
Are you sure you want to delete your account? This action is irreversible.
</p>
<label class="input input-bordered flex items-center gap-2">
<label class="flex items-center gap-2">
<input
type="password"
class="grow"
@@ -24,7 +24,7 @@ templ DeleteAccountComp() {
autocapitalize="off"
/>
</label>
<button class="btn btn-error self-end">
<button class="self-end">
Delete Account
</button>
</form>

14
template/auth/user.templ
View File

@@ -1,9 +1,9 @@
package auth
templ UserComp(user string) {
<div id="user-info" class="flex gap-5 items-center">
<div id="user-info" class="flex gap-5 items-center">
if user != "" {
<div class="group inline-block relative">
<div class="inline-block relative">
<button class="font-semibold py-2 px-4 inline-flex items-center">
<span class="mr-1">{ user }</span>
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
@@ -11,20 +11,20 @@ templ UserComp(user string) {
</svg>
</button>
<div class="absolute hidden group-hover:block w-full">
<ul class="menu bg-base-300 rounded-box w-fit float-right mr-4 p-3">
<ul class="w-fit float-right mr-4 p-3">
<li class="mb-1">
<a hx-post="/api/auth/signout" hx-target="#user-info">Sign Out</a>
</li>
<li class="mb-1">
<a href="/auth/change-password">Change Password</a>
</li>
<li><a href="/auth/delete-account" class="text-error">Delete Account</a></li>
<li><a href="/auth/delete-account" class="">Delete Account</a></li>
</ul>
</div>
</div>
} else {
<a href="/auth/signup" class="btn btn-sm">Sign Up</a>
<a href="/auth/signin" class="btn btn-sm">Sign In</a>
<a href="/auth/signup" class="">Sign Up</a>
<a href="/auth/signin" class="">Sign In</a>
}
</div>
</div>
}

2
template/auth/verify.templ
View File

@@ -12,7 +12,7 @@ templ VerifyComp() {
<p class="text-lg text-center">
Please check your inbox/spam and click on the link to verify your account.
</p>
<button class="btn mt-8" hx-get="/api/auth/verify-resend" hx-sync="this:drop" hx-swap="outerHTML">
<button class="mt-8" hx-get="/api/auth/verify-resend" hx-sync="this:drop" hx-swap="outerHTML">
resend verification email
</button>
</div>

8
template/auth/verify_response.templ
View File

@@ -1,7 +1,7 @@
package auth
templ VerifyResponseComp(isVerified bool) {
<main>
<main>
<div class="flex flex-col items-center justify-center h-screen">
if isVerified {
<h2 class="text-6xl mb-10">
@@ -10,7 +10,7 @@ templ VerifyResponseComp(isVerified bool) {
<p class="text-lg text-center">
You have completed the verification process. Thank you!
</p>
<a class="btn btn-primary mt-8" href="/">
<a class="mt-8" href="/">
Go Home
</a>
} else {
@@ -20,10 +20,10 @@ templ VerifyResponseComp(isVerified bool) {
<p class="text-lg text-center">
Please try again by sign up process
</p>
<a class="btn btn-primary mt-8" href="/auth/signup">
<a class="mt-8" href="/auth/signup">
Sign Up
</a>
}
</div>
</main>
</main>
}

8
template/index.templ
View File

@@ -1,16 +1,16 @@
package template
templ Index() {
<div class="hero bg-base-200 h-full">
<div class="hero-content text-center">
<div class="h-full">
<div class="text-center">
<div class="max-w-md">
<h1 class="text-5xl font-bold">Next Level Workout Tracker</h1>
<p class="py-6">
Ever wanted to track your workouts and see your progress over time? web-app-template is the perfect
solution for you.
</p>
<a href="/workout" class="btn btn-primary">Get Started</a>
<a href="/workout" class="">Get Started</a>
</div>
</div>
</div>
</div>
}

38
template/layout.templ
View File

@@ -1,29 +1,30 @@
package template
templ Layout(slot templ.Component, user templ.Component) {
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>web-app-template</title>
<link rel="icon" href="/static/favicon.svg" />
<link rel="stylesheet" href="/static/css/tailwind.css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="htmx-config" content='{
<link rel="icon" href="/static/favicon.svg"/>
<link rel="stylesheet" href="/static/css/tailwind.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta
name="htmx-config"
content='{
"includeIndicatorStyles": false,
"selfRequestsOnly": true,
"allowScriptTags": false
}' />
}'
/>
<script src="/static/js/htmx.min.js"></script>
<script src="/static/js/toast.js"></script>
</head>
<body hx-headers='{"csrf-token": "CSRF_TOKEN"}'>
</head>
<body hx-headers='{"csrf-token": "CSRF_TOKEN"}'>
<div class="h-screen flex flex-col">
<div class="flex justify-end items-center gap-2 py-1 px-2 h-12 md:gap-10 md:px-10 md:py-2 shadow-sm">
<a href="/" class="flex-1 flex gap-2">
<img src="/static/favicon.svg" alt="web-app-template logo" />
<img src="/static/favicon.svg" alt="web-app-template logo"/>
<span>web-app-template</span>
</a>
@user
@@ -34,12 +35,11 @@ templ Layout(slot templ.Component, user templ.Component) {
}
</div>
</div>
<div class="toast" id="toasts">
<div class="hidden alert" id="toast">
<div class="" id="toasts">
<div class="hidden" id="toast">
New message arrived.
</div>
</div>
</body>
</html>
</body>
</html>
}

10
template/not_found.templ
View File

@@ -1,11 +1,11 @@
package template
templ NotFound() {
<main class="flex h-full justify-center items-center ">
<div class="bg-error p-16 rounded-lg">
<h1 class="text-4xl text-error-content mb-5">Not Found</h1>
<p class="text-lg text-error-content mb-5">The page you are looking for does not exist.</p>
<a href="/" class="btn btn-lg btn-primary">Go back to home</a>
<main class="flex h-full justify-center items-center">
<div class="p-16 rounded-lg">
<h1 class="text-4xl mb-5">Not Found</h1>
<p class="text-lg mb-5">The page you are looking for does not exist.</p>
<a href="/" class="">Go back to home</a>
</div>
</main>
}

46
template/workout/workout.templ
View File

@@ -1,33 +1,37 @@
package workout
templ WorkoutComp(currentDate string) {
<main class="mx-2">
<form class="max-w-xl mx-auto flex flex-col gap-4 justify-center mt-10" hx-post="/api/workout"
hx-target="#workout-placeholder" hx-swap="outerHTML">
<main class="mx-2">
<form
class="max-w-xl mx-auto flex flex-col gap-4 justify-center mt-10"
hx-post="/api/workout"
hx-target="#workout-placeholder"
hx-swap="outerHTML"
>
<h2 class="text-4xl mb-8">Track your workout</h2>
<input id="date" type="date" class="input input-bordered" value={ currentDate } name="date" />
<select class="select select-bordered w-full" name="type">
<input id="date" type="date" class="" value={ currentDate } name="date"/>
<select class="w-full" name="type">
<option>Push Ups</option>
<option>Pull Ups</option>
</select>
<input type="number" class="input input-bordered" placeholder="Sets" name="sets" />
<input type="number" class="input input-bordered" placeholder="Reps" name="reps" />
<button class="btn btn-primary self-end">Save</button>
<input type="number" class="" placeholder="Sets" name="sets"/>
<input type="number" class="" placeholder="Reps" name="reps"/>
<button class="self-end">Save</button>
</form>
<div hx-get="/api/workout" hx-trigger="load"></div>
</main>
</main>
}
type Workout struct {
Id string
Date string
Type string
Sets string
Reps string
Id string
Date string
Type string
Sets string
Reps string
}
templ WorkoutListComp(workouts []Workout) {
<div class="overflow-x-auto mx-auto max-w-(--breakpoint-lg)">
<div class="overflow-x-auto mx-auto max-w-lg">
<h2 class="text-4xl mt-14 mb-8">Workout history</h2>
<table class="table table-auto max-w-full">
<thead>
@@ -46,14 +50,14 @@ templ WorkoutListComp(workouts []Workout) {
}
</tbody>
</table>
</div>
</div>
}
templ WorkoutItemComp(w Workout, includePlaceholder bool) {
if includePlaceholder {
<tr class="hidden" id="workout-placeholder"></tr>
}
<tr>
if includePlaceholder {
<tr class="hidden" id="workout-placeholder"></tr>
}
<tr>
<th>{ w.Date }</th>
<th>{ w.Type }</th>
<th>{ w.Sets }</th>
@@ -65,5 +69,5 @@ if includePlaceholder {
</button>
</div>
</th>
</tr>
</tr>
}