From 332ffbeed90cf07342925b82ed3fda1762346be2 Mon Sep 17 00:00:00 2001
From: erdgeist <erdgeist@erdgeist.org>
Date: Thu, 9 Jul 2026 02:25:56 +0200
Subject: Restyle revisions#index: sticky diff bar, computation button style,
 pre-selected defaults

Adds a fourth button category, .computation -- teal, matching Preview's
existing color -- for actions that compute a view without changing state,
the first case in the app that didn't fit reversible/state-changing/
destructive. Diff revisions now starts disabled and only enables once two
distinct revisions are selected, matching the disabled-state pattern
already used for Unlock + Back.

The header row is wrapped in a real <thead> (previously flat inside the
table alongside data rows) so a sticky diff bar can sit above the fold on
long revision lists -- selecting a comparison pair no longer requires
scrolling back up to find the button, or back down to confirm what's
selected, both surfaced live via one shared JS function.

The two most recent revisions are pre-selected by default, covering the
most common comparison (current against previous) with no extra clicks.
Deliberately scoped to numbered revisions only -- comparing draft/head or
autosave/draft was raised and set aside, since neither exists as a row in
this table by design and extending the comparison to them is a separate
feature, not a default on this one.

Also drops the dead "Edit" subnav link, redundant with nodes#show's
Status section covering the same action with state-aware labeling this
static link could never have.
---
 public/stylesheets/admin.css | 66 ++++++++++++++++++++++++++++++++++----------
 1 file changed, 52 insertions(+), 14 deletions(-)

(limited to 'public/stylesheets/admin.css')

diff --git a/public/stylesheets/admin.css b/public/stylesheets/admin.css
index a6e8bf6..3607166 100644
--- a/public/stylesheets/admin.css
+++ b/public/stylesheets/admin.css
@@ -29,6 +29,7 @@ table.node_table a,
 table.assets_table a,
 table.events_table a,
 table.user_table a,
+table.revisions_table a,
 .add_child_links a,
 div#draft_list table td.actions a {
   text-decoration: underline;
@@ -297,6 +298,27 @@ form.button_to.destructive button[type="submit"]:hover {
   background-color: #cc0000;
 }
 
+form.button_to.computation input[type="submit"],
+form.button_to.computation button[type="submit"] {
+  color: #00838f;
+  background-color: #e0f2f1;
+  border-radius: 2px;
+  padding: 2px 8px;
+}
+
+form.button_to.computation input[type="submit"]:hover,
+form.button_to.computation button[type="submit"]:hover {
+  color: #ffffff;
+  background-color: #00838f;
+}
+
+form.button_to.computation input[type="submit"]:disabled,
+form.button_to.computation button[type="submit"]:disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
 /* Native (non-button_to) submit buttons -- Create/Save/Publish forms.
    Lower specificity than form.button_to's own rule, so button_to forms
    are correctly unaffected. If a button_to output ever loses its class
@@ -420,42 +442,58 @@ table.node_table tr:hover {
   content: "• ";
 }
 
-table#revisions {
+table.revisions_table {
   border-collapse: collapse;
 }
 
-table#revisions tr {
-  height: 45px;
+table.revisions_table thead {
+  position: sticky;
+  top: 0;
+  z-index: 1;
 }
 
-/* Redundant with the generic table tr.header rule above (identical
-   values) -- harmless, kept presumably for explicitness. */
-table#revisions tr.header {
-  height: 20px;
+table.revisions_table th,
+table.revisions_table td {
+  padding: 0.4rem 0.75rem;
   text-align: left;
 }
 
-table#revisions td {
-  padding-right: 25px;
+table.revisions_table thead tr.header,
+table.revisions_table thead tr.diff_sticky_bar {
+  background-color: #ffffff;
+}
+
+table.revisions_table .diff_sticky_bar td {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  border-bottom: 1px solid #e8e8e8;
 }
 
-table#revisions td.title {
+#diff_selection_label {
+  margin-left: 0.75rem;
+  color: #969696;
+}
+table.revisions_table td.title {
   width: 450px;
 }
 
-table#revisions td.date {
+table.revisions_table td.date {
   width: 175px;
 }
 
-table#revisions tr.header:hover {
+table.revisions_table tr:not(.header):not(.no_hover) {
+  border-bottom: 1px solid #e8e8e8;
+}
+
+table.revisions_table tr.header:hover {
   background-color: #ffffff;
 }
 
-table#revisions tr.no_hover:hover {
+table.revisions_table tr.no_hover:hover {
   background-color: #ffffff;
 }
 
-table#revisions tr:hover {
+table.revisions_table tr:hover {
   background-color: #f1f1f1;
 }
 
-- 
cgit v1.3