From 722247c2be707ce594c84a6d9aec28b026af7042 Mon Sep 17 00:00:00 2001
From: Alberto Bertogli <albertito@blitiri.com.ar>
Date: Thu, 14 Sep 2023 23:01:51 +0100
Subject: [PATCH] css: Truncate long descriptions

In the index, if the descriptions are too long, it can make the table
quite awkward to read.

This patch makes them truncate automatically.
---
 static/git-arr.css | 9 +++++++++
 views/index.html   | 3 ++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/static/git-arr.css b/static/git-arr.css
index 03e7c06..57a415b 100644
--- a/static/git-arr.css
+++ b/static/git-arr.css
@@ -159,6 +159,15 @@ table.projects td.name a {
 }
 
 
+/* Truncate long descriptions based on the viewport width. */
+table.projects td.desc {
+    max-width: 50vw;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+}
+
+
 /* Age of an object.
  * Note this is hidden by default as we rely on javascript to show it. */
 span.age {
diff --git a/views/index.html b/views/index.html
index a1d7aa4..91517db 100644
--- a/views/index.html
+++ b/views/index.html
@@ -20,7 +20,8 @@
     % for repo in sorted(repos.values(), key = lambda r: r.name):
     <tr>
         <td class="name"><a href="r/{{repo.name}}/">{{repo.name}}</a></td>
-        <td class="desc"><a href="r/{{repo.name}}/">{{repo.info.desc}}</a></td>
+        <td class="desc"><a href="r/{{repo.name}}/" title="{{repo.info.desc}}">
+            {{repo.info.desc}}</a></td>
         <td><span class="age">{{repo.last_commit_timestamp()}}</span></td>
     </tr>
     %end