anubis/web/index.templ
Jesús Martínez Novo 9fa1795db7
fix(index.templ) centered-div class usage typo (#812)
* Fix centered-div class usage in index.templ

There was a redundant <center> tag around a div with centered-div class. Well, not so redundant because a typo in the class attribute caused it to not apply.

Removed another <center> tag and replaced by a div.centered-div for consistency.

Signed-off-by: Jesús Martínez Novo <martineznovo@gmail.com>

* Fix centered-div class usage in index.templ (continuation)

Template needed to be compiled into go code...

---------

Signed-off-by: Jesús Martínez Novo <martineznovo@gmail.com>
2025-07-11 14:59:17 -04:00

204 lines
7.0 KiB
Plaintext

package web
import (
"fmt"
"github.com/TecharoHQ/anubis"
"github.com/TecharoHQ/anubis/lib/localization"
"github.com/TecharoHQ/anubis/lib/policy/config"
"github.com/TecharoHQ/anubis/xess"
)
templ base(title string, body templ.Component, impressum *config.Impressum, challenge any, ogTags map[string]string, localizer *localization.SimpleLocalizer) {
<!DOCTYPE html>
<html lang={localizer.GetLang()}>
<head>
<title>{ title }</title>
<link rel="stylesheet" href={ anubis.BasePrefix + xess.URL }/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="robots" content="noindex,nofollow"/>
for key, value := range ogTags {
<meta property={ key } content={ value }/>
}
<style>
body,
html {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
margin-left: auto;
margin-right: auto;
}
.centered-div {
text-align: center;
}
#status {
font-variant-numeric: tabular-nums;
}
#progress {
display: none;
width: 90%;
width: min(20rem, 90%);
height: 2rem;
border-radius: 1rem;
overflow: hidden;
margin: 1rem 0 2rem;
outline-offset: 2px;
outline: #b16286 solid 4px;
}
.bar-inner {
background-color: #b16286;
height: 100%;
width: 0;
transition: width 0.25s ease-in;
}
</style>
@templ.JSONScript("anubis_version", anubis.Version)
if challenge != nil {
@templ.JSONScript("anubis_challenge", challenge)
}
@templ.JSONScript("anubis_base_prefix", anubis.BasePrefix)
</head>
<body id="top">
<main>
<h1 id="title" class="centered-div">{ title }</h1>
@body
<footer>
<div class="centered-div">
<p>
{ localizer.T("protected_by") } <a href="https://github.com/TecharoHQ/anubis">Anubis</a> from <a
href="https://techaro.lol"
>Techaro</a>. { localizer.T("made_with") }.
</p>
<p>{ localizer.T("mascot_design") } <a href="https://bsky.app/profile/celphase.bsky.social">{ localizer.T("celphase") }</a>.</p>
if impressum != nil {
<p>
@templ.Raw(impressum.Footer)
-- <a href={ templ.SafeURL(fmt.Sprintf("%simprint", anubis.APIPrefix)) }>Imprint</a>
</p>
}
</div>
</footer>
</main>
</body>
</html>
}
templ index(localizer *localization.SimpleLocalizer) {
<div class="centered-div">
<img id="image" style="width:100%;max-width:256px;" src={ anubis.BasePrefix + "/.within.website/x/cmd/anubis/static/img/pensive.webp?cacheBuster=" + anubis.Version }/>
<img style="display:none;" style="width:100%;max-width:256px;" src={ anubis.BasePrefix + "/.within.website/x/cmd/anubis/static/img/happy.webp?cacheBuster=" + anubis.Version }/>
<p id="status">{ localizer.T("loading") }</p>
<script async type="module" src={ anubis.BasePrefix + "/.within.website/x/cmd/anubis/static/js/main.mjs?cacheBuster=" + anubis.Version }></script>
<div id="progress" role="progressbar" aria-labelledby="status">
<div class="bar-inner"></div>
</div>
<details>
<summary>{ localizer.T("why_am_i_seeing") }</summary>
<p>
{ localizer.T("ai_companies_explanation") }
</p>
<p>
{ localizer.T("anubis_compromise") }
</p>
<p>
{ localizer.T("hack_purpose") }
</p>
<p>
{ localizer.T("jshelter_note") }
</p>
<p>{ localizer.T("version_info") } <code>{ anubis.Version }</code>.</p>
</details>
<noscript>
<p>
{ localizer.T("javascript_required") }
</p>
</noscript>
<div id="testarea"></div>
</div>
}
templ errorPage(message string, mail string, localizer *localization.SimpleLocalizer) {
<div class="centered-div">
<img id="image" alt="Sad Anubis" style="width:100%;max-width:256px;" src={ anubis.BasePrefix + "/.within.website/x/cmd/anubis/static/img/reject.webp?cacheBuster=" + anubis.Version }/>
<p>{ message }.</p>
<button onClick="window.location.reload();">{ localizer.T("try_again") }</button>
if mail != "" {
<p>
<a href="/">{ localizer.T("go_home") }</a> { localizer.T("contact_webmaster") }
<a href={ "mailto:" + templ.SafeURL(mail) }>
{ mail }
</a>
</p>
} else {
<p><a href="/">{ localizer.T("go_home") }</a></p>
}
</div>
}
templ StaticHappy(localizer *localization.SimpleLocalizer) {
<div class="centered-div">
<img
style="display:none;"
style="width:100%;max-width:256px;"
src={ "/.within.website/x/cmd/anubis/static/img/happy.webp?cacheBuster=" +
anubis.Version }
/>
<p>{ localizer.T("static_check_endpoint") }</p>
</div>
}
templ bench(localizer *localization.SimpleLocalizer) {
<div style="height:20rem;display:flex">
<table style="margin-top:1rem;display:grid;grid-template:auto 1fr/auto auto;gap:0 0.5rem">
<thead
style="border-bottom:1px solid black;padding:0.25rem 0;display:grid;grid-template:1fr/subgrid;grid-column:1/-1"
>
<tr id="table-header" style="display:contents">
<th style="width:4.5rem">{ localizer.T("time") }</th>
<th style="width:4rem">{ localizer.T("iters") }</th>
</tr>
<tr id="table-header-compare" style="display:none">
<th style="width:4.5rem">{ localizer.T("time_a") }</th>
<th style="width:4rem">{ localizer.T("iters_a") }</th>
<th style="width:4.5rem">{ localizer.T("time_b") }</th>
<th style="width:4rem">{ localizer.T("iters_b") }</th>
</tr>
</thead>
<tbody
id="results"
style="padding-top:0.25rem;display:grid;grid-template-columns:subgrid;grid-auto-rows:min-content;grid-column:1/-1;row-gap:0.25rem;overflow-y:auto;font-variant-numeric:tabular-nums"
></tbody>
</table>
<div class="centered-div">
<img id="image" style="width:100%;max-width:256px;" src={ anubis.BasePrefix + "/.within.website/x/cmd/anubis/static/img/pensive.webp?cacheBuster=" + anubis.Version }/>
<p id="status" style="max-width:256px">{ localizer.T("loading") }</p>
<script async type="module" src={ anubis.BasePrefix + "/.within.website/x/cmd/anubis/static/js/bench.mjs?cacheBuster=" + anubis.Version }></script>
<div id="sparkline"></div>
<noscript>
<p>{ localizer.T("benchmark_requires_js") }</p>
</noscript>
</div>
</div>
<form id="controls" style="position:fixed;top:0.5rem;right:0.5rem">
<div style="display:flex;justify-content:end">
<label for="difficulty-input" style="margin-right:0.5rem">{ localizer.T("difficulty") }</label>
<input id="difficulty-input" type="number" name="difficulty" style="width:3rem"/>
</div>
<div style="margin-top:0.25rem;display:flex;justify-content:end">
<label for="algorithm-select" style="margin-right:0.5rem">{ localizer.T("algorithm") }</label>
<select id="algorithm-select" name="algorithm"></select>
</div>
<div style="margin-top:0.25rem;display:flex;justify-content:end">
<label for="compare-select" style="margin-right:0.5rem">{ localizer.T("compare") }</label>
<select id="compare-select" name="compare">
<option value="NONE">-</option>
</select>
</div>
</form>
}