108 lines
4.2 KiB
Plaintext
108 lines
4.2 KiB
Plaintext
package pages
|
|
|
|
import (
|
|
"net/http"
|
|
|
|
"forge.capytal.company/capytal/www/templates/layouts"
|
|
|
|
"forge.capytal.company/loreddev/x/groute/router/rerrors"
|
|
)
|
|
|
|
type AboutPage struct{}
|
|
|
|
func (p *AboutPage) ServeHTTP(w http.ResponseWriter, r *http.Request) {
|
|
if err := p.Component().Render(r.Context(), w); err != nil {
|
|
rerrors.InternalError(err).ServeHTTP(w, r)
|
|
}
|
|
}
|
|
|
|
templ (p *AboutPage) head() {
|
|
<link rel="modulepreload" href="/assets/lib/about-page.js" as="script" type="text/javascript"/>
|
|
<script defer hx-head="re-eval">
|
|
(async () => {
|
|
console.debug("RELOADED")
|
|
async function event() {
|
|
const { main } = await import("/assets/lib/about-page.js");
|
|
main()
|
|
}
|
|
document.addEventListener("htmx:load", event, { once: true })
|
|
})()
|
|
</script>
|
|
}
|
|
|
|
templ (p *AboutPage) Component() {
|
|
@layouts.Page(layouts.PageInfo{Title: "About", Heading: p.head()}) {
|
|
<main
|
|
class={ "w-screen h-screen bg-background-00 absolute top-0 left-0",
|
|
"flex justify-center items-center flex-col slide-enter" }
|
|
>
|
|
<section class="w-20rem h-20rem md:w-25rem md:h-25rem text-justify relative">
|
|
<div class="overflow-y-scroll w-full h-full">
|
|
<h1>About</h1>
|
|
<p>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget mi metus.
|
|
In hac habitasse platea dictumst. Integer lacinia ornare pellentesque. Nulla facilisis
|
|
sodales justo non elementum. Aliquam sit amet accumsan nulla. Fusce egestas viverra
|
|
items-centertincidunt. Sed sem dolor, suscipit sed elit id, consequat egestas tellus.
|
|
Quisque a tortor velit.
|
|
</p>
|
|
<p>
|
|
Cras sed libero eu velit euismod sagittis. Nunc ante risus, cursus vel leo eget,
|
|
porta iaculis eros. Aliquam sodales dui non augue sodales, sit amet vulputate nisi interdum.
|
|
Mauris convallis velit vitae maximus imperdiet. Suspendisse vulputate ornare semper.
|
|
Cras et venenatis ligula. Nulla nec libero eget neque feugiat cursus.
|
|
</p>
|
|
<h2 id="code">About Code</h2>
|
|
<p>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget mi metus.
|
|
In hac habitasse platea dictumst. Integer lacinia ornare pellentesque. Nulla facilisis
|
|
sodales justo non elementum. Aliquam sit amet accumsan nulla. Fusce egestas viverra
|
|
items-centertincidunt. Sed sem dolor, suscipit sed elit id, consequat egestas tellus.
|
|
Quisque a tortor velit.
|
|
</p>
|
|
<p>
|
|
Cras sed libero eu velit euismod sagittis. Nunc ante risus, cursus vel leo eget,
|
|
porta iaculis eros. Aliquam sodales dui non augue sodales, sit amet vulputate nisi interdum.
|
|
Mauris convallis velit vitae maximus imperdiet. Suspendisse vulputate ornare semper.
|
|
Cras et venenatis ligula. Nulla nec libero eget neque feugiat cursus.
|
|
</p>
|
|
<h2 id="creators">About Creators</h2>
|
|
<p>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget mi metus.
|
|
In hac habitasse platea dictumst. Integer lacinia ornare pellentesque. Nulla facilisis
|
|
sodales justo non elementum. Aliquam sit amet accumsan nulla. Fusce egestas viverra
|
|
items-centertincidunt. Sed sem dolor, suscipit sed elit id, consequat egestas tellus.
|
|
Quisque a tortor velit.
|
|
</p>
|
|
<p>
|
|
Cras sed libero eu velit euismod sagittis. Nunc ante risus, cursus vel leo eget,
|
|
porta iaculis eros. Aliquam sodales dui non augue sodales, sit amet vulputate nisi interdum.
|
|
Mauris convallis velit vitae maximus imperdiet. Suspendisse vulputate ornare semper.
|
|
Cras et venenatis ligula. Nulla nec libero eget neque feugiat cursus.
|
|
</p>
|
|
</div>
|
|
<span
|
|
class={ "absolute block bottom-0 left-0 w-full h-10rem z-2",
|
|
"bg-gradient-to-t from-background-00 to-transparent pointer-events-none" }
|
|
></span>
|
|
</section>
|
|
@p.returnAnchor("return-anchor-root", "/", true)
|
|
@p.returnAnchor("return-anchor-code", "/#code", false)
|
|
@p.returnAnchor("return-anchor-creators", "/#creators", false)
|
|
</main>
|
|
}
|
|
}
|
|
|
|
templ (p *AboutPage) returnAnchor(id string, href string, enabled bool) {
|
|
<a
|
|
href={ templ.SafeURL(href) }
|
|
id={ id }
|
|
class={ "font-display text-white no-underline w-5rem h-5rem text-center leading-[5rem]",
|
|
templ.KV("hidden", !enabled) }
|
|
aria-hidden?={ !enabled }
|
|
aria-disabled?={ !enabled }
|
|
>
|
|
<
|
|
</a>
|
|
}
|