109 lines
3.2 KiB
Swift
109 lines
3.2 KiB
Swift
import Elementary
|
|
import ElementaryHTMX
|
|
import Routes
|
|
import Styleguide
|
|
|
|
struct MainPage<Inner: HTML>: SendableHTMLDocument where Inner: Sendable {
|
|
let title = "HVAC-Toolbox"
|
|
let lang = "en-US"
|
|
let inner: @Sendable () -> Inner
|
|
|
|
var head: some HTML {
|
|
meta(.charset(.utf8))
|
|
meta(.name("viewport"), .content("width=device-width, initial-scale=1.0"))
|
|
link(.rel(.stylesheet), .href("/output.css"))
|
|
link(
|
|
.rel(.icon),
|
|
.href("/favicon-32x32.png"),
|
|
.init(name: "type", value: "image/png"),
|
|
.init(name: "sizes", value: "32x32")
|
|
)
|
|
link(
|
|
.rel(.icon),
|
|
.href("/favicon-16x16.png"),
|
|
.init(name: "type", value: "image/png"),
|
|
.init(name: "sizes", value: "16x16")
|
|
)
|
|
link(
|
|
.rel(.init(rawValue: "apple-touch-icon")),
|
|
.href("/apple-touch-icon.png"),
|
|
.init(name: "sizes", value: "180x180")
|
|
)
|
|
link(.rel(.init(rawValue: "mainifest")), .href("/site.webmanifest"))
|
|
script(.src("https://unpkg.com/htmx.org@2.0.4")) {}
|
|
}
|
|
|
|
var body: some HTML {
|
|
main(.class("bg-slate-100 dark:bg-gray-800")) {
|
|
div(.class("min-h-screen")) {
|
|
Header()
|
|
PageContent(body: inner)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
private struct Header: HTML {
|
|
|
|
var content: some HTML {
|
|
header(.class("\(bg: .blue) mb-8 flex flex-row gap-2 border \(border: .yellow)")) {
|
|
a(
|
|
.href(route: .index),
|
|
.class("group flex flex-row gap-2 \(bg: .yellow) pe-2 rounded-e-lg \(text: .blue) hover:text-blue-600")
|
|
) {
|
|
img(.src("/images/toolbox.svg"), .width(40), .height(40), .class("py-1"))
|
|
div(.class("flex flex-row mt-2")) {
|
|
h2(.class("text-2xl font-extrabold pe-3")) { "HVAC-Toolbox" }
|
|
SVG(.wind, color: .blue)
|
|
.attributes(.class("group-hover:text-blue-600"))
|
|
}
|
|
}
|
|
nav(.class("flex flex-row gap-2 p-2 mt-2")) {
|
|
// TODO: Add class active, to button that is the active route.
|
|
ul(.class("flex flex-wrap gap-x-2 lg:gap-x-5 \(text: .yellow) font-bold")) {
|
|
li {
|
|
a(
|
|
.class("hover:border-b \(border: .yellow)"),
|
|
.hx.get(route: .moldRisk(.index)), .hx.target("#content"), .hx.pushURL(true)
|
|
) {
|
|
"Mold-Risk"
|
|
}
|
|
}
|
|
li {
|
|
a(
|
|
.class("[&:hover]:border-b \(border: .yellow)"),
|
|
.hx.get(route: .dehumidifierSize(.index)), .hx.target("#content"), .hx.pushURL(true)
|
|
) {
|
|
"Dehumidifier-Sizing"
|
|
}
|
|
}
|
|
li {
|
|
a(
|
|
.class("hover:border-b \(border: .yellow)"),
|
|
.hx.get(route: .hvacSystemPerformance(.index)), .hx.target("#content"), .hx.pushURL(true)
|
|
) {
|
|
"HVAC-System-Performance"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
private struct PageContent<Body: HTML>: HTML where Body: Sendable {
|
|
let body: () -> Body
|
|
|
|
var content: some HTML {
|
|
div(.class("mx-5 lg:mx-20")) {
|
|
div(.class("rounded-xl shadow-lg bg-white dark:bg-slate-700 p-8 text-gray-600 dark:text-slate-200")) {
|
|
div(.id("content")) {
|
|
body()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
protocol SendableHTMLDocument: HTMLDocument, Sendable {}
|