Tim Wundenberg
96e9b4b036
Some checks failed
Build Docker Image / Build-Docker-Image (push) Has been cancelled
70 lines
2.4 KiB
Plaintext
70 lines
2.4 KiB
Plaintext
package template
|
|
|
|
func layoutLinkClass(isActive bool) string {
|
|
if isActive {
|
|
return "text-xl hover:bg-gray-100 p-1 duration-100 rounded-xl transition-colors text-gray-900"
|
|
}
|
|
return "text-xl hover:bg-gray-100 hover:text-gray-900 p-1 duration-200 rounded-xl transition-colors text-gray-400"
|
|
}
|
|
|
|
templ Layout(slot templ.Component, user templ.Component, loggedIn bool, path string) {
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<title>SpendSparrow</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='{
|
|
"includeIndicatorStyles": false,
|
|
"selfRequestsOnly": true,
|
|
"allowScriptTags": false
|
|
}'
|
|
/>
|
|
<script src="/static/js/htmx.min.js"></script>
|
|
<script src="/static/js/toast.js"></script>
|
|
<script src="/static/js/time.js"></script>
|
|
<script src="/static/js/echarts.min.js"></script>
|
|
<script src="/static/js/dashboard.js" defer></script>
|
|
</head>
|
|
<body class="h-screen flex flex-col" hx-headers='{"Csrf-Token": "CSRF_TOKEN"}'>
|
|
// Header
|
|
<nav class="flex bg-white items-center gap-2 py-1 px-2 h-12 md:gap-10 md:px-10 md:py-2">
|
|
<a href="/" class="flex gap-2 mr-20">
|
|
<img class="w-6" src="/static/favicon.svg" alt="SpendSparrow logo"/>
|
|
<span class="text-4xl font-bold font-pirata">SpendSparrow</span>
|
|
</a>
|
|
if loggedIn {
|
|
<a class={ layoutLinkClass(path == "/dashboard") } href="/dashboard">Dashboard</a>
|
|
<a class={ layoutLinkClass(path == "/transaction") } href="/transaction">Transaction</a>
|
|
<a class={ layoutLinkClass(path == "/treasurechest") } href="/treasurechest">Treasure Chest</a>
|
|
<a class={ layoutLinkClass(path == "/account") } href="/account">Account</a>
|
|
}
|
|
<div class="ml-auto">
|
|
@user
|
|
</div>
|
|
</nav>
|
|
<div class="h-12 fixed top-12 mr-4 inset-0 bg-linear-0 from-transparent to-white"></div>
|
|
// Content
|
|
<main class="flex-1 overflow-auto">
|
|
if slot != nil {
|
|
@slot
|
|
}
|
|
</main>
|
|
// Footer
|
|
<!-- </div> -->
|
|
<div id="toasts" class="fixed bottom-4 right-4 ml-4 max-w-96 flex flex-col gap-2 z-50">
|
|
<div
|
|
id="toast"
|
|
class="transition-all duration-300 opacity-0 px-4 py-2 text-lg hidden text-bold rounded bg-amber-900 text-white"
|
|
>
|
|
M
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
}
|