From 2ea6bf56f1b4d95599ddee04d92d7ee5750fde52 Mon Sep 17 00:00:00 2001
From: Nick Sweeting <git@sweeting.me>
Date: Fri, 28 Aug 2026 18:52:11 -0700
Subject: [PATCH] fix: align snapshot output actions

---
 archivebox/core/admin_archiveresults.py |  9 +++----
 archivebox/templates/static/admin.css   | 32 +++++++++++++++++++++++++
 archivebox/tests/test_ui_admin_links.py |  3 +++
 3 files changed, 38 insertions(+), 6 deletions(-)

diff --git a/archivebox/core/admin_archiveresults.py b/archivebox/core/admin_archiveresults.py
index 4a6e9831..7aeb8736 100644
--- a/archivebox/core/admin_archiveresults.py
+++ b/archivebox/core/admin_archiveresults.py
@@ -198,7 +198,6 @@ def render_archiveresults_list(archiveresults_qs, limit=50, config=None, can_del
         if can_delete:
             delete_button = f'''
                 <button type="button" data-archive-result-ids="{result.id}" data-delete-url="{delete_url}"
-                        style="padding: 4px 8px; border: 0; background: #f1f5f9; border-radius: 4px; color: #475569; font-size: 11px; cursor: pointer;"
                         title="Delete this output">❌</button>
             '''
 
@@ -254,13 +253,11 @@ def render_archiveresults_list(archiveresults_qs, limit=50, config=None, can_del
                 <td style="padding: 10px 12px; white-space: nowrap; font-family: ui-monospace, monospace; font-size: 11px; color: #64748b;">
                     {version}
                 </td>
-                <td style="padding: 10px 8px; white-space: nowrap;">
-                    <div style="display: flex; gap: 4px;">
+                <td class="archive-results-actions-cell">
+                    <div class="archive-results-actions">
                         <a href="{output_link_attr}" target="_blank"
-                           style="padding: 4px 8px; background: #f1f5f9; border-radius: 4px; color: #475569; text-decoration: none; font-size: 11px;"
                            title="View output">📄</a>
                         <a href="{reverse("admin:core_archiveresult_change", args=[result.id])}"
-                           style="padding: 4px 8px; background: #f1f5f9; border-radius: 4px; color: #475569; text-decoration: none; font-size: 11px;"
                            title="Edit">✏️</a>
                         {delete_button}
                     </div>
@@ -331,7 +328,7 @@ def render_archiveresults_list(archiveresults_qs, limit=50, config=None, can_del
                         <th style="padding: 10px 12px; text-align: left; font-weight: 600; color: #475569; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em;">Process</th>
                         <th style="padding: 10px 12px; text-align: left; font-weight: 600; color: #475569; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em;">Machine</th>
                         <th style="padding: 10px 12px; text-align: left; font-weight: 600; color: #475569; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em;">Version</th>
-                        <th style="padding: 10px 8px; text-align: left; font-weight: 600; color: #475569; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em;">Actions</th>
+                        <th class="archive-results-actions-cell" style="text-align: left; font-weight: 600; color: #475569; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em;">Actions</th>
                     </tr>
                 </thead>
                 <tbody>
diff --git a/archivebox/templates/static/admin.css b/archivebox/templates/static/admin.css
index 700f809f..7f9c3385 100755
--- a/archivebox/templates/static/admin.css
+++ b/archivebox/templates/static/admin.css
@@ -1461,6 +1461,38 @@ body.model-crawl.change-list #result_list td.field-short_id a {
     white-space: normal;
 }
 
+.archive-results-table .archive-results-actions-cell {
+    width: 100px;
+    min-width: 100px;
+    padding: 10px 8px;
+    white-space: nowrap;
+}
+
+.archive-results-table .archive-results-actions {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+}
+
+.archive-results-table .archive-results-actions a,
+.archive-results-table .archive-results-actions button {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0;
+    width: 28px;
+    height: 28px;
+    padding: 0;
+    border: 0;
+    border-radius: 4px;
+    background: #f1f5f9;
+    color: #475569;
+    font-size: 14px;
+    line-height: 1;
+    text-decoration: none;
+    cursor: pointer;
+}
+
 
 #result_list tbody td.field-cmd_str pre,
 #result_list tbody td.field-output_str pre {
diff --git a/archivebox/tests/test_ui_admin_links.py b/archivebox/tests/test_ui_admin_links.py
index 4f95d234..8da7d0b9 100644
--- a/archivebox/tests/test_ui_admin_links.py
+++ b/archivebox/tests/test_ui_admin_links.py
@@ -206,6 +206,7 @@ def test_archiveresult_admin_links_plugin_and_process(real_hook_result):
     assert inline_html.count('class="archive-results-output"') == 2
     assert inline_html.count('class="archive-results-files"') == 2
     assert inline_html.count('class="archive-results-completed"') == 2
+    assert 'class="archive-results-actions"' in inline_html
     assert "display: block; max-width: 280px; overflow: hidden; text-overflow: ellipsis;" in inline_html
     assert '<wbr> <span style="white-space: nowrap;">' in inline_html
 
@@ -215,6 +216,8 @@ def test_archiveresult_admin_links_plugin_and_process(real_hook_result):
     assert ".archive-results-table .archive-results-output {\n    min-width: 180px;" in admin_css
     assert ".archive-results-table .archive-results-files {\n    width: 52px;\n    min-width: 52px;" in admin_css
     assert ".archive-results-table .archive-results-completed {\n    min-width: 96px;\n    white-space: normal;" in admin_css
+    assert ".archive-results-table .archive-results-actions a,\n.archive-results-table .archive-results-actions button {" in admin_css
+    assert "margin: 0;\n    width: 28px;\n    height: 28px;" in admin_css
 
 
 @pytest.mark.django_db(transaction=True)