Handle boxes and blocks a bit better in HTML export (#5744)

Co-authored-by: Martin Haug <3874949+reknih@users.noreply.github.com>

1 files changed, 25 insertions, 4 deletions

diff --git a/crates/typst-html/src/lib.rs b/crates/typst-html/src/lib.rs
index ffd8e250..1fa6aa21 100644
--- a/crates/typst-html/src/lib.rs
+++ b/crates/typst-html/src/lib.rs
@@ -14,7 +14,7 @@ use typst_library::html::{
 use typst_library::introspection::{
     Introspector, Locator, LocatorLink, SplitLocator, TagElem,
 };
-use typst_library::layout::{Abs, Axes, BoxElem, Region, Size};
+use typst_library::layout::{Abs, Axes, BlockBody, BlockElem, BoxElem, Region, Size};
 use typst_library::model::{DocumentInfo, ParElem};
 use typst_library::routines::{Arenas, Pair, RealizationKind, Routines};
 use typst_library::text::{LinebreakElem, SmartQuoteElem, SpaceElem, TextElem};
@@ -197,13 +197,34 @@ fn handle(
                 .into(),
         );
     } else if let Some(elem) = child.to_packed::<BoxElem>() {
-        // FIXME: Very incomplete and hacky, but makes boxes kind fulfill their
-        // purpose for now.
+        // TODO: This is rather incomplete.
         if let Some(body) = elem.body(styles) {
             let children =
                 html_fragment(engine, body, locator.next(&elem.span()), styles)?;
-            output.extend(children);
+            output.push(
+                HtmlElement::new(tag::span)
+                    .with_attr(attr::style, "display: inline-block;")
+                    .with_children(children)
+                    .spanned(elem.span())
+                    .into(),
+            )
         }
+    } else if let Some((elem, body)) =
+        child
+            .to_packed::<BlockElem>()
+            .and_then(|elem| match elem.body(styles) {
+                Some(BlockBody::Content(body)) => Some((elem, body)),
+                _ => None,
+            })
+    {
+        // TODO: This is rather incomplete.
+        let children = html_fragment(engine, body, locator.next(&elem.span()), styles)?;
+        output.push(
+            HtmlElement::new(tag::div)
+                .with_children(children)
+                .spanned(elem.span())
+                .into(),
+        );
     } else if child.is::<SpaceElem>() {
         output.push(HtmlNode::text(' ', child.span()));
     } else if let Some(elem) = child.to_packed::<TextElem>() {