chore: add display text

This commit is contained in:
E44
2025-11-21 22:08:27 +01:00
parent 94bad9a72f
commit 5b891ae64c
10 changed files with 1887 additions and 84 deletions
+19 -10
View File
@@ -13,7 +13,8 @@ templ indexTemplate() {
<style>
:root {
--background-color: black;
--foreground-color: oklch(92.3% 0.003 48.717)
--foreground-color: oklch(92.3% 0.003 48.717);
--font-size: 5rem;
}
body {
@@ -44,13 +45,19 @@ templ indexTemplate() {
object-fit: contain;
}
p {
font-size: 6rem;
line-height: 1;
p,
li {
font-size: var(--font-size);
line-height: 1.2;
text-wrap: balance;
max-width: 90vw;
word-break: break-word;
display: block;
margin: 0 0 calc(var(--font-size) * 0.4) 0;
}
ul,
ol {
padding-left: calc(var(--font-size)*1.5);
}
</style>
<script>
@@ -89,16 +96,18 @@ templ imageTemplate(path string) {
templ deviceInfoTemplate(ip string, mac string, showQR bool) {
<div style="width: 100vw; height: 100vh; display: flex; flex-direction: row; justify-content: space-between;">
<div style="display: flex; flex-direction: column; gap: 1rem; justify-content: end; padding: 2rem; font-size: 4rem;">
<div
style="display: flex; flex-direction: column; gap: 1rem; justify-content: end; padding: 2rem; font-size: 4rem;">
{ ip }
<span style="text-transform: uppercase;">{ mac }</span>
</div>
if showQR {
<div style="display: flex; justify-content: end; align-items: end; padding: 2rem;">
<div style="padding: 1rem; background-color: var(--foreground-color); border-radius: 1rem;">
<img style="height: 30vh; width: auto; image-rendering: pixelated; image-rendering: crisp-edges;" src={"/qr?data=http://" + ip + ":8080" } alt="QR-Code" />
</div>
<div style="display: flex; justify-content: end; align-items: end; padding: 2rem;">
<div style="padding: 1rem; background-color: var(--foreground-color); border-radius: 1rem;">
<img style="height: 30vh; width: auto; image-rendering: pixelated; image-rendering: crisp-edges;"
src={ "/qr?data=http://" + ip + ":8080" } alt="QR-Code" />
</div>
</div>
}
</div>
<style>