Add frontend JS and improve post styling

Frontend is built with Bun. It uses Stimulus to progressively enhance
the server-built HTML. Currently, it only replaces UTC timestamps from
the server with the time in the browser's timezone.
This commit is contained in:
2023-06-27 14:03:52 -04:00
parent 7e06d23bba
commit 76cc87631f
15 changed files with 331 additions and 4 deletions

View File

@@ -15,9 +15,18 @@ pub async fn get(
) -> Result<Response> {
let entry = get_entry(&pool, id.as_uuid()).await?;
Ok(layout.render(html! {
@let title = entry.title.unwrap_or_else(|| "Untitled".to_string());
h1 { a href=(entry.url) { (title) } }
@let content = entry.html_content.unwrap_or_else(|| "No content".to_string());
(PreEscaped(content))
article {
@let title = entry.title.unwrap_or_else(|| "Untitled".to_string());
h1 { a href=(entry.url) { (title) } }
@let published_at = entry.published_at.to_rfc3339_opts(chrono::SecondsFormat::Millis, true);
span class="published" {
strong { "Published: " }
time datetime=(published_at) data-controller="local-time" {
(published_at)
}
}
@let content = entry.html_content.unwrap_or_else(|| "No content".to_string());
(PreEscaped(content))
}
}))
}

View File

@@ -8,3 +8,5 @@ pub mod partials;
pub mod state;
pub mod utils;
pub mod uuid;
pub const JS_BUNDLES: &'static str = include_str!("../static/js/js_bundles.txt");

View File

@@ -6,6 +6,7 @@ use axum::{
};
use maud::{html, Markup, DOCTYPE};
use crate::JS_BUNDLES;
use crate::config::Config;
use crate::partials::header::header;
@@ -42,6 +43,9 @@ impl Layout {
script type="module" {
r#"import * as Turbo from 'https://cdn.skypack.dev/@hotwired/turbo';"#
}
@for js_bundle in JS_BUNDLES.lines() {
script type="module" src=(js_bundle) {}
}
link rel="stylesheet" href="/static/styles.css";
}
body {