Limit post titles to one line in lists

2 files changed, 24 insertions, 14 deletions

diff --git a/res/main.css b/res/main.css
index 71a0e10..36359f5 100644
--- a/res/main.css
+++ b/res/main.css
@@ -113,6 +113,18 @@ body {
 	padding-left: 0;
 }
 
+.titleLine {
+	white-space: nowrap;
+	display: flex;
+	padding-right: .5em;
+}
+.titleLine > a {
+	min-width: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	margin-right: .5em;
+}
+
 form.inline {
 	display: inline-block;
 }
diff --git a/src/components/mod.rs b/src/components/mod.rs
index c0ad1dc..869f021 100644
--- a/src/components/mod.rs
+++ b/src/components/mod.rs
@@ -299,22 +299,20 @@ pub fn PostItem<'a>(
 ) {
     render::rsx! {
         <li>
-            <a href={format!("/posts/{}", post.as_ref().as_ref().id)}>
-                {post.as_ref().as_ref().title.as_ref()}
-            </a>
-            {
-                if let Some(href) = &post.as_ref().href {
-                    Some(render::rsx! {
-                        <>
-                            {" "}
+            <div class={"titleLine"}>
+                <a href={format!("/posts/{}", post.as_ref().as_ref().id)}>
+                    {post.as_ref().as_ref().title.as_ref()}
+                </a>
+                {
+                    if let Some(href) = &post.as_ref().href {
+                        Some(render::rsx! {
                             <em><a href={href.as_ref()}>{abbreviate_link(&href)}{" ↗"}</a></em>
-                        </>
-                    })
-                } else {
-                    None
+                        })
+                    } else {
+                        None
+                    }
                 }
-            }
-            <br />
+            </div>
             <small>
                 {lang.tr("submitted", None)}
                 {" "}