refactor(kanban): render shell from hemplate
Move the kanban full-page shell into a checked .heml unit so page assembly uses slhx render/SafeHtml composition instead of hand-built trusted HTML strings. req: html_safety/001 req: html_safety/002 req: component/003
This commit is contained in:
@@ -35,6 +35,11 @@ struct Card {
|
|||||||
column: usize,
|
column: usize,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Hemplate)]
|
||||||
|
struct AppShell {
|
||||||
|
body: SafeHtml,
|
||||||
|
}
|
||||||
|
|
||||||
#[derive(Hemplate)]
|
#[derive(Hemplate)]
|
||||||
#[hemplate = "partials"]
|
#[hemplate = "partials"]
|
||||||
struct BoardColumns {
|
struct BoardColumns {
|
||||||
@@ -232,32 +237,8 @@ fn page_html(board: &BoardState) -> SafeHtml {
|
|||||||
}
|
}
|
||||||
|
|
||||||
fn shell(body: SafeHtml) -> SafeHtml {
|
fn shell(body: SafeHtml) -> SafeHtml {
|
||||||
// Explicit full-page composition boundary for already-rendered hemplate fragments.
|
|
||||||
// req: html_safety/001 req: html_safety/002 req: axum_integration/001
|
// req: html_safety/001 req: html_safety/002 req: axum_integration/001
|
||||||
SafeHtml::trusted(format!(
|
slhx::render(&AppShell { body })
|
||||||
r#"<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
<title>slhx Kanban</title>
|
|
||||||
<script src="/slhx.js" defer></script>
|
|
||||||
<style>
|
|
||||||
body {{ font-family: system-ui, sans-serif; margin: 2rem; }}
|
|
||||||
form {{ display: flex; gap: .5rem; flex-wrap: wrap; margin: 1rem 0; }}
|
|
||||||
.columns {{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }}
|
|
||||||
.column {{ border: 1px solid #ddd; border-radius: .5rem; padding: 1rem; background: #fafafa; }}
|
|
||||||
.card {{ background: white; border: 1px solid #ccc; border-radius: .5rem; margin: .75rem 0; padding: .75rem; }}
|
|
||||||
.card menu {{ display: flex; gap: .35rem; padding: 0; margin: .5rem 0 0; }}
|
|
||||||
.presence {{ color: #376; }}
|
|
||||||
button, input, select {{ font: inherit; }}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
{body}
|
|
||||||
</body>
|
|
||||||
</html>"#
|
|
||||||
))
|
|
||||||
}
|
}
|
||||||
|
|
||||||
fn render_options() -> SafeHtml {
|
fn render_options() -> SafeHtml {
|
||||||
|
|||||||
@@ -0,0 +1,20 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title>slhx Kanban</title>
|
||||||
|
<script src="/slhx.js" defer></script>
|
||||||
|
<style>
|
||||||
|
body { font-family: system-ui, sans-serif; margin: 2rem; }
|
||||||
|
form { display: flex; gap: .5rem; flex-wrap: wrap; margin: 1rem 0; }
|
||||||
|
.columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
|
||||||
|
.column { border: 1px solid #ddd; border-radius: .5rem; padding: 1rem; background: #fafafa; }
|
||||||
|
.card { background: white; border: 1px solid #ccc; border-radius: .5rem; margin: .75rem 0; padding: .75rem; }
|
||||||
|
.card menu { display: flex; gap: .35rem; padding: 0; margin: .5rem 0 0; }
|
||||||
|
.presence { color: #376; }
|
||||||
|
button, input, select { font: inherit; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>{+= self.body =+}</body>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user