tijl/tijl.dev-core
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

general page updates
Some checks failed
build / build (push) Successful in 28s
Details
release-tag / release-image (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Tijl 2024-08-31 17:42:51 +02:00
parent b8d23ee68f
commit 1d072c6cc6
Signed by: tijl
GPG Key ID: DAE24BFCD722F053
24 changed files with 282 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
internal/handlers/routes.go
View File

@ -6,7 +6,6 @@ import (
"git.tijl.dev/tijl/tijl.dev-core/internal/config"
"git.tijl.dev/tijl/tijl.dev-core/internal/oidc"
"git.tijl.dev/tijl/tijl.dev-core/internal/user"
"git.tijl.dev/tijl/tijl.dev-core/modules/i18n"
"git.tijl.dev/tijl/tijl.dev-core/modules/web"
webf "git.tijl.dev/tijl/tijl.dev-core/web"
@ -39,15 +38,9 @@ func routes(app *fiber.App) {
data["Title"] = i18n.Translate(c, "about")
return c.Render("about", data, "layouts/base")
})
app.Get("/services", func(c *fiber.Ctx) error {
_, err := user.GetSession(c)
if err != nil {
return c.Next()
}
data := *web.Common(c)
data["Title"] = i18n.Translate(c, "services")
return c.Render("services", data, "layouts/base")
})
app.Get("/services", servicesHandler)
app.Get("/service/:service", serviceHandler)
app.Get("/service/:service/info", serviceInfoHandler)
app.Get("/login", loginHandler)
app.Get("/loggedin", loggedinHandler)
app.Get("/account", accountHandler)

66
internal/handlers/services.go Normal file
View File

@ -0,0 +1,66 @@
package handlers
import (
"git.tijl.dev/tijl/tijl.dev-core/modules/i18n"
"git.tijl.dev/tijl/tijl.dev-core/modules/web"
"github.com/gofiber/fiber/v2"
)
type Service struct {
Name string
Description string
Url string
InfoUrl string
Color string
Scale float64
}
var services = map[string]Service{
"immich": {
Name: "Immich",
Description: "...",
Url: "https://fotos.tijl.dev/photos",
InfoUrl: "https://immich.app",
Color: "white",
Scale: 0,
},
"element": {
Name: "Element",
Description: "...",
Url: "https://element.tijl.dev",
InfoUrl: "https://matrix.org",
Color: "#0DBD8B",
Scale: 0.1,
},
"nextcloud": {
Name: "Nextcloud",
Description: "...",
Url: "https://cloud.tijl.dev",
InfoUrl: "https://nextcloud.com",
Color: "#00679e",
Scale: -0.2,
},
}
func servicesHandler(c *fiber.Ctx) error {
data := *web.Common(c)
data["Title"] = i18n.Translate(c, "services")
data["Services"] = services
return c.Render("services", data, "layouts/base")
}
func serviceHandler(c *fiber.Ctx) error {
if services[c.Params("service")].Url != "" {
return c.Redirect(services[c.Params("service")].Url)
}
return c.Next()
}
func serviceInfoHandler(c *fiber.Ctx) error {
if services[c.Params("service")].Url != "" {
return c.Redirect(services[c.Params("service")].InfoUrl)
}
return c.Next()
}

2
internal/queries/app_flags.sql.go
View File

@ -1,6 +1,6 @@
// Code generated by sqlc. DO NOT EDIT.
// versions:
// sqlc v1.25.0
// sqlc v1.27.0
// source: app_flags.sql
package queries

2
internal/queries/app_uploader.sql.go
View File

@ -1,6 +1,6 @@
// Code generated by sqlc. DO NOT EDIT.
// versions:
// sqlc v1.25.0
// sqlc v1.27.0
// source: app_uploader.sql
package queries

2
internal/queries/db.go
View File

@ -1,6 +1,6 @@
// Code generated by sqlc. DO NOT EDIT.
// versions:
// sqlc v1.25.0
// sqlc v1.27.0
package queries

2
internal/queries/models.go
View File

@ -1,6 +1,6 @@
// Code generated by sqlc. DO NOT EDIT.
// versions:
// sqlc v1.25.0
// sqlc v1.27.0
package queries

2
internal/queries/sessions.sql.go
View File

@ -1,6 +1,6 @@
// Code generated by sqlc. DO NOT EDIT.
// versions:
// sqlc v1.25.0
// sqlc v1.27.0
// source: sessions.sql
package queries

2
internal/queries/users.sql.go
View File

@ -1,6 +1,6 @@
// Code generated by sqlc. DO NOT EDIT.
// versions:
// sqlc v1.25.0
// sqlc v1.27.0
// source: users.sql
package queries

2
internal/queries/util.sql.go
View File

@ -1,6 +1,6 @@
// Code generated by sqlc. DO NOT EDIT.
// versions:
// sqlc v1.25.0
// sqlc v1.27.0
// source: util.sql
package queries

8
internal/service/main.go
View File

@ -3,7 +3,9 @@ package service
import (
"context"
"fmt"
"math"
"net/http"
"time"
"git.tijl.dev/tijl/tijl.dev-core/internal/apps/flags"
"git.tijl.dev/tijl/tijl.dev-core/internal/apps/uploader"
@ -55,6 +57,12 @@ func Listen() {
engine := html.NewFileSystem(http.FS(webf.ViewsEmbed), ".html")
engine.Directory = "views"
engine.AddFunc("icon", assets.Svg)
engine.AddFunc("incfloat", func(a, b float64) float64 {
return math.Round((a+b)*1e8) / 1e8
})
engine.AddFunc("formatdate", func(t time.Time) string {
return t.Format("2 Jan 2006")
})
// Init fiber
app := fiber.New(fiber.Config{

2
tailwind.config.ts
View File

@ -1,6 +1,6 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./internal/**/*.html", "./web/views/**/*.html", "./web/**/*.{js,ts,css}"],
content: ["./web/views/**/*.html", "./web/**/*.{js,ts,css}"],
theme: {
extend: {},
},

51
web/lib/main.css
View File

@ -3,8 +3,10 @@
@import "tailwindcss/utilities";
@layer base {
html {
*, html {
font-family: "Cantarell", "CantarellVF", sans-serif;
scroll-margin-top: 96px;
scroll-behavior: smooth;
}
.no-scrollbar::-webkit-scrollbar {
@ -24,3 +26,50 @@
font-display: swap;
}
.posts-item {
cursor: pointer;
user-select: none;
transition-property: color, background-color, border-color,
text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
backdrop-filter;
transition-duration: 200ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
animation: button-pop var(--animation-posts-item, 0.25s) ease-out;
--tw-border-opacity: 1;
--tw-bg-opacity: 1;
--tw-text-opacity: 1;
}
.posts-item-group > input[type="radio"].posts-item {
appearance: none;
}
.posts-item-group > input[type="radio"].posts-item:before {
content: attr(data-title);
}
.posts-item:active:hover,
.posts-item:active:focus {
animation: none;
}
.posts-item:active:hover,
.posts-item:active:focus {
animation: none;
}
.posts-item:not(.no-animation):active:hover,
.posts-item:not(.no-animation):active:focus {
transform: scale(var(--posts-item-focus-scale, 0.95));
}
.posts-item:not(.no-animation):active:hover,
.posts-item:not(.no-animation):active:focus {
transform: scale(var(--posts-item-focus-scale, 0.95));
}
.posts-item:hover,
.posts-item-active {
--tw-border-opacity: 1;
/*border-color: hsl(var(--nf, var(--n)) / var(--tw-border-opacity));*/
--tw-bg-opacity: 1;
background-color: hsl(var(--nf, var(--n)) / var(--tw-bg-opacity));
}
.posts-item:focus-visible {
outline: 2px solid hsl(var(--nf));
outline-offset: 2px;
}

7
web/static/assets/element.svg Normal file
View File

@ -0,0 +1,7 @@
<svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M81.7169 46.5946C81.7169 42.5581 84.9959 39.2859 89.0408 39.2859C116.456 39.2859 138.681 61.4642 138.681 88.8225C138.681 92.859 135.401 96.1312 131.357 96.1312C127.312 96.1312 124.033 92.859 124.033 88.8225C124.033 69.5372 108.366 53.9033 89.0408 53.9033C84.9959 53.9033 81.7169 50.6311 81.7169 46.5946Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M153.39 81.5137C157.435 81.5137 160.714 84.7859 160.714 88.8224C160.714 116.181 138.49 138.359 111.075 138.359C107.03 138.359 103.751 135.087 103.751 131.05C103.751 127.014 107.03 123.742 111.075 123.742C130.4 123.742 146.066 108.108 146.066 88.8224C146.066 84.7859 149.345 81.5137 153.39 81.5137Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M118.398 153.405C118.398 157.442 115.119 160.714 111.074 160.714C83.6592 160.714 61.4347 138.536 61.4347 111.177C61.4347 107.141 64.7138 103.869 68.7587 103.869C72.8035 103.869 76.0826 107.141 76.0826 111.177C76.0826 130.463 91.7489 146.097 111.074 146.097C115.119 146.097 118.398 149.369 118.398 153.405Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M46.6097 118.486C42.5648 118.486 39.2858 115.214 39.2858 111.178C39.2858 83.8193 61.5102 61.6409 88.9255 61.6409C92.9704 61.6409 96.2494 64.9132 96.2494 68.9497C96.2494 72.9862 92.9704 76.2584 88.9255 76.2584C69.6 76.2584 53.9337 91.8922 53.9337 111.178C53.9337 115.214 50.6546 118.486 46.6097 118.486Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

12
web/static/assets/gitea.svg Normal file
View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" id="main_outline" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 640 640" style="enable-background:new 0 0 640 640;" xml:space="preserve">
<g>
<path id="teabag" style="fill:#FFFFFF" d="M395.9,484.2l-126.9-61c-12.5-6-17.9-21.2-11.8-33.8l61-126.9c6-12.5,21.2-17.9,33.8-11.8 c17.2,8.3,27.1,13,27.1,13l-0.1-109.2l16.7-0.1l0.1,117.1c0,0,57.4,24.2,83.1,40.1c3.7,2.3,10.2,6.8,12.9,14.4 c2.1,6.1,2,13.1-1,19.3l-61,126.9C423.6,484.9,408.4,490.3,395.9,484.2z"/>
<g>
<g>
<path style="fill:#609926" d="M622.7,149.8c-4.1-4.1-9.6-4-9.6-4s-117.2,6.6-177.9,8c-13.3,0.3-26.5,0.6-39.6,0.7c0,39.1,0,78.2,0,117.2 c-5.5-2.6-11.1-5.3-16.6-7.9c0-36.4-0.1-109.2-0.1-109.2c-29,0.4-89.2-2.2-89.2-2.2s-141.4-7.1-156.8-8.5 c-9.8-0.6-22.5-2.1-39,1.5c-8.7,1.8-33.5,7.4-53.8,26.9C-4.9,212.4,6.6,276.2,8,285.8c1.7,11.7,6.9,44.2,31.7,72.5 c45.8,56.1,144.4,54.8,144.4,54.8s12.1,28.9,30.6,55.5c25,33.1,50.7,58.9,75.7,62c63,0,188.9-0.1,188.9-0.1s12,0.1,28.3-10.3 c14-8.5,26.5-23.4,26.5-23.4s12.9-13.8,30.9-45.3c5.5-9.7,10.1-19.1,14.1-28c0,0,55.2-117.1,55.2-231.1 C633.2,157.9,624.7,151.8,622.7,149.8z M125.6,353.9c-25.9-8.5-36.9-18.7-36.9-18.7S69.6,321.8,60,295.4 c-16.5-44.2-1.4-71.2-1.4-71.2s8.4-22.5,38.5-30c13.8-3.7,31-3.1,31-3.1s7.1,59.4,15.7,94.2c7.2,29.2,24.8,77.7,24.8,77.7 S142.5,359.9,125.6,353.9z M425.9,461.5c0,0-6.1,14.5-19.6,15.4c-5.8,0.4-10.3-1.2-10.3-1.2s-0.3-0.1-5.3-2.1l-112.9-55 c0,0-10.9-5.7-12.8-15.6c-2.2-8.1,2.7-18.1,2.7-18.1L322,273c0,0,4.8-9.7,12.2-13c0.6-0.3,2.3-1,4.5-1.5c8.1-2.1,18,2.8,18,2.8 l110.7,53.7c0,0,12.6,5.7,15.3,16.2c1.9,7.4-0.5,14-1.8,17.2C474.6,363.8,425.9,461.5,425.9,461.5z"/>
<path style="fill:#609926" d="M326.8,380.1c-8.2,0.1-15.4,5.8-17.3,13.8c-1.9,8,2,16.3,9.1,20c7.7,4,17.5,1.8,22.7-5.4 c5.1-7.1,4.3-16.9-1.8-23.1l24-49.1c1.5,0.1,3.7,0.2,6.2-0.5c4.1-0.9,7.1-3.6,7.1-3.6c4.2,1.8,8.6,3.8,13.2,6.1 c4.8,2.4,9.3,4.9,13.4,7.3c0.9,0.5,1.8,1.1,2.8,1.9c1.6,1.3,3.4,3.1,4.7,5.5c1.9,5.5-1.9,14.9-1.9,14.9 c-2.3,7.6-18.4,40.6-18.4,40.6c-8.1-0.2-15.3,5-17.7,12.5c-2.6,8.1,1.1,17.3,8.9,21.3c7.8,4,17.4,1.7,22.5-5.3 c5-6.8,4.6-16.3-1.1-22.6c1.9-3.7,3.7-7.4,5.6-11.3c5-10.4,13.5-30.4,13.5-30.4c0.9-1.7,5.7-10.3,2.7-21.3 c-2.5-11.4-12.6-16.7-12.6-16.7c-12.2-7.9-29.2-15.2-29.2-15.2s0-4.1-1.1-7.1c-1.1-3.1-2.8-5.1-3.9-6.3c4.7-9.7,9.4-19.3,14.1-29 c-4.1-2-8.1-4-12.2-6.1c-4.8,9.8-9.7,19.7-14.5,29.5c-6.7-0.1-12.9,3.5-16.1,9.4c-3.4,6.3-2.7,14.1,1.9,19.8 C343.2,346.5,335,363.3,326.8,380.1z"/>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

18
web/static/assets/immich.svg Normal file
View File

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generator: Adobe Illustrator 28.3.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Flower" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 792 792" style="enable-background:new 0 0 792 792;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FA2921;}
.st1{fill:#ED79B5;}
.st2{fill:#FFB400;}
.st3{fill:#1E83F7;}
.st4{fill:#18C249;}
</style>
<g id="Flower_00000077325900055813483940000000694823054982625702_">
<path class="st0" d="M375.48,267.63c38.64,34.21,69.78,70.87,89.82,105.42c34.42-61.56,57.42-134.71,57.71-181.3 c0-0.33,0-0.63,0-0.91c0-68.94-68.77-95.77-128.01-95.77s-128.01,26.83-128.01,95.77c0,0.94,0,2.2,0,3.72 C300.01,209.24,339.15,235.47,375.48,267.63z"/>
<path class="st1" d="M164.7,455.63c24.15-26.87,61.2-55.99,103.01-80.61c44.48-26.18,88.97-44.47,128.02-52.84 c-47.91-51.76-110.37-96.24-154.6-110.91c-0.31-0.1-0.6-0.19-0.86-0.28c-65.57-21.3-112.34,35.81-130.64,92.15 c-18.3,56.34-14.04,130.04,51.53,151.34C162.05,454.77,163.25,455.16,164.7,455.63z"/>
<path class="st2" d="M681.07,302.19c-18.3-56.34-65.07-113.45-130.64-92.15c-0.9,0.29-2.1,0.68-3.54,1.15 c-3.75,35.93-16.6,81.27-35.96,125.76c-20.59,47.32-45.84,88.27-72.51,118c69.18,13.72,145.86,12.98,190.26-1.14 c0.31-0.1,0.6-0.2,0.86-0.28C695.11,432.22,699.37,358.52,681.07,302.19z"/>
<path class="st3" d="M336.54,510.71c-11.15-50.39-14.8-98.36-10.7-138.08c-64.03,29.57-125.63,75.23-153.26,112.76 c-0.19,0.26-0.37,0.51-0.53,0.73c-40.52,55.78-0.66,117.91,47.27,152.72c47.92,34.82,119.33,53.54,159.86-2.24 c0.56-0.76,1.3-1.78,2.19-3.01C363.28,602.32,347.02,558.08,336.54,510.71z"/>
<path class="st4" d="M617.57,482.52c-35.33,7.54-82.42,9.33-130.72,4.66c-51.37-4.96-98.11-16.32-134.63-32.5 c8.33,70.03,32.73,142.73,59.88,180.6c0.19,0.26,0.37,0.51,0.53,0.73c40.52,55.78,111.93,37.06,159.86,2.24 c47.92-34.82,87.79-96.95,47.27-152.72C619.2,484.77,618.46,483.75,617.57,482.52z"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

1
web/static/assets/nextcloud.svg Normal file
View File

@ -0,0 +1 @@
<svg width="256" height="128" version="1.1" viewBox="0 0 256 128" xmlns="http://www.w3.org/2000/svg"><path d="m128 7c-25.871 0-47.817 17.485-54.713 41.209-5.9795-12.461-18.642-21.209-33.287-21.209-20.304 0-37 16.696-37 37s16.696 37 37 37c14.645 0 27.308-8.7481 33.287-21.209 6.8957 23.724 28.842 41.209 54.713 41.209s47.817-17.485 54.713-41.209c5.9795 12.461 18.642 21.209 33.287 21.209 20.304 0 37-16.696 37-37s-16.696-37-37-37c-14.645 0-27.308 8.7481-33.287 21.209-6.8957-23.724-28.842-41.209-54.713-41.209zm0 22c19.46 0 35 15.54 35 35s-15.54 35-35 35-35-15.54-35-35 15.54-35 35-35zm-88 20c8.4146 0 15 6.5854 15 15s-6.5854 15-15 15-15-6.5854-15-15 6.5854-15 15-15zm176 0c8.4146 0 15 6.5854 15 15s-6.5854 15-15 15-15-6.5854-15-15 6.5854-15 15-15z" color="#000000" fill="#fff" style="-inkscape-stroke:none"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 815 B

1
web/static/assets/services.js Normal file
View File

@ -0,0 +1 @@
console.log("hi")

2
web/views/about.html
View File

@ -1,4 +1,6 @@
<div>
<a
href="anytype://invite/?cid=bafybeicsbtu64x444v7mkgksv3xef5h37sbrvpde3jmyuyqz5yfmlyuttu&key=2j4RYyT2Yf7vCRP8RByM5ir7F9GeXXRRinnqcqeanY9J">HELLO???</a>
<div>Bitcoin Paynym
PM8TJh8YdsX67AWUFoHjEQUJ5amsBbWq1XqcygbVCPkEnwXw8b61z4JDFTLUaPKcnLwdwE9353f1YaAHgQVtXs8ZZ1SS3GqdsRvduYEUwB385BS7KcfD
</div>

22
web/views/blog.html
View File

@ -1,7 +1,23 @@
<div>Posts</div>
<div hx-boost="true">
<div class="grid gap-4">
{{range .Posts}}
<div><a href="/blog/{{.Meta.Slug}}">{{.Meta.Title}}</a></div>
<a href="/blog/{{.Meta.Slug}}"
class="card posts-item bg-base-300 hover:bg-base-100 border-[2px] border-base-200 shadow-xl cursor-pointer">
<div class="card-body">
<header class="card-title">
<h2 class="card-title text-2xl">{{.Meta.Title}}</h2>
</header>
<article>
<p>{{.Meta.Description}}</p>
</article>
<footer class="!text-[0.8rem] text-sm">
<span class="meta-item">{{.Meta.Author}}</span> •
<span class="meta-item">{{formatdate .Meta.PublishDate}}</span> •
<span class="meta-item">
</span>
</footer>
</div>
</a>
{{end}}
</div>
</div>

0
web/views/donate.html Normal file
View File

2
web/views/layouts/base.html
View File

@ -15,7 +15,7 @@
<header>
{{template "partials/menu" .}}
</header>
<main class="mx-8 pt-24 pb-4">
<main class="mx-6 pt-24 pb-4">
{{embed}}
</main>
</body>

6
web/views/partials/menu.html
View File

@ -1,4 +1,4 @@
<nav hx-boost="true" class="flex fixed mx-auto w-full md:w-[80%] lg:w-[75%]">
<nav hx-boost="true" class="z-[100] flex fixed mx-auto w-full md:w-[80%] lg:w-[75%]">
<div class="mt-4 mx-4 rounded-2xl shadow-xl bg-base-300 navbar">
<div class="flex-1">
<a href="/" class="btn btn-ghost font-mono text-xl">tijl.dev</a>
@ -12,7 +12,7 @@
d="M5 12h.01M12 12h.01M19 12h.01M6 12a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0z" />
</svg>
</summary>
<ul class="mt-3 z-[1] menu dropdown-content bg-base-300 rounded-box w-52 p-3 shadow-xl gap-1">
<ul class="mt-3 z-[101] menu dropdown-content bg-base-300 rounded-box w-52 p-3 shadow-xl gap-1">
<li>
<a class='flex gap-4 {{if eq .Path "/"}}active{{end}}' href="/">
<span class="w-5 text-center">
@ -65,7 +65,7 @@
</a>
</summary>
<ul class="menu dropdown-content z-[12] bg-base-200 rounded-box w-48 p-3 shadow-xl gap-1">
<ul class="menu dropdown-content z-[102] bg-base-200 rounded-box w-48 p-3 shadow-xl gap-1">
<li>
<a class='flex gap-4 {{if eq .Language "en"}}active{{end}}'
href="/settings?lang=en&redirect={{.Path}}">

8
web/views/post.html
View File

@ -1,3 +1,5 @@
<div>{{.Post.Meta.Title}}</div>
<div>{{.Post.Content}}</div>
<article class="prose">
<h1 class="m-auto my-1">{{.Post.Meta.Title}}</h1>
<hr class="p-0 m-0 my-4" />
{{.Post.Content}}
</article>

101
web/views/services.html
View File

@ -1,29 +1,78 @@
<div>
<div>
<a href="https://fotos.tijl.dev">Immich (fotos.tijl.dev)</a>
<div class="prose mb-4">
<h1 class="m-0">Service's</h1>
<hr class="m-0" />
</div>
<div>
<a href="https://speed.tijl.dev">Librespeed (speed.tijl.dev)</a>
</div>
<div>
<a href="https://fotos.tijl.dev">Immich (fotos.tijl.dev)</a>
</div>
<div>
<a href="https://ghostfolio.tijl.dev">Ghostfolio</a>
</div>
<div>
<a href="https://vault.tijl.dev">Vaultwarden (vault.tijl.dev)</a>
</div>
<div>
<a href="https://git.tijl.dev">Gitea (git.tijl.dev)</a>
</div>
<div>
<a>Matrix (tijl.dev)</a>
</div>
<div>
<a href="https://element.tijl.dev">Element (element.tijl.dev)</a>
</div>
<div>
<a href="https://cloud.tijl.dev">Nextcloud (cloud.tijl.dev)</a>
<div class="mt-4 flex justify-center">
<div class="flex gap-2">
{{range $key, $value := .Services}}
<a href="#{{$key}}" id="service-{{$key}}" class="group"
onmouseover="this.querySelector('img').style.transform='scale({{incfloat .Scale 1.1}})';"
onmouseout="this.querySelector('img').style.transform='scale({{incfloat .Scale 1}})';">
<div class="relative w-24 h-24 rounded-3xl shadow-2xl" style="background-color: {{.Color}};">
<div class="absolute inset-0 flex items-center justify-center">
<img alt="{{.Name}} logo"
class="text-white transform transition-transform duration-300 drop-shadow-2xl"
style="transform: scale({{incfloat .Scale 1}});" src="/static/assets/{{$key}}.svg" />
</div>
</div>
<div id="service-{{$key}}-label" class="w-24 text-center my-1 rounded-2xl">
{{.Name}}
</div>
</a>
{{end}}
</div>
</div>
<div class="mt-4 mx-2 card bg-base-300" id="services-info">
{{range $key, $value := .Services}}
<div class="card-body hidden" id="service-{{$key}}-info">
<h2 class="card-title">{{.Name}}</h2>
<p>{{.Description}}</p>
<div class="card-actions justify-end">
<a href="/service/{{$key}}/info" class="btn bg-base-300">Info</a>
<a href="/service/{{$key}}" class="btn btn-primary">Open</a>
</div>
</div>
{{end}}
</div>
<script>
function hashChange() {
if (window.location.hash) {
let button = document.getElementById("service-" + window.location.hash.slice(1))
document.querySelectorAll('div[id^="service-"][id$="-info"]').forEach(element => {
if (element.id == button.id + "-info") {
if (element.classList.contains("hidden")) {
element.classList.remove("hidden")
setTimeout(() => {
document.querySelectorAll('a[id^="service-"]').forEach(button2 => {
document.getElementById("service-" + button2.id.slice(8) + "-label").classList.remove("bg-base-300")
button2.href = "#" + button2.id.slice(8)
})
document.getElementById("service-" + button.id.slice(8) + "-label").classList.add("bg-base-300")
button.href = "/service/" + button.id.slice(8)
}, 0)
} else {
}
} else {
if (!element.classList.contains("hidden")) {
element.classList.add("hidden")
}
}
})
}
}
document.querySelectorAll('a[id^="service-"]').forEach(button => {
button.addEventListener('click', function (event) {
})
})
window.addEventListener('hashchange', function () {
hashChange()
});
hashChange()
</script>