From e9ae80c9fab1ee8841bc3c75decef90397985cc6 Mon Sep 17 00:00:00 2001
From: Mark Hendriksen <hendriksen-mark@hotmail.com>
Date: Wed, 14 Jan 2026 19:42:44 +0100
Subject: [PATCH] Update selection bar styles and group classes (#648)

* Update selection bar styles and group classes

Replaces hardcoded color classes with design token classes for background, border, and text. Updates group and group-hover class names for edit and delete actions to use more specific variants.

* make the selection dars the same
---
 app/views/entries/_selection_bar.html.erb      |  6 +++---
 app/views/transactions/_selection_bar.html.erb | 12 ++++++------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/app/views/entries/_selection_bar.html.erb b/app/views/entries/_selection_bar.html.erb
index 4c7d8d48b..4db508efb 100644
--- a/app/views/entries/_selection_bar.html.erb
+++ b/app/views/entries/_selection_bar.html.erb
@@ -1,4 +1,4 @@
-<div class="fixed bottom-30 md:bottom-6 z-10 flex items-center justify-between rounded-xl bg-container-inset border-primary shadow-border-xs px-4 text-sm text-primary md:w-[420px] w-[90%] py-1.5">
+<div class="fixed bottom-30 md:bottom-6 z-10 flex items-center justify-between rounded-xl bg-surface-inset border-secondary shadow-border-xs px-4 text-sm text-primary md:w-[420px] w-[90%] py-1.5">
   <div class="flex items-center gap-2">
     <%= check_box_tag "entry_selection", 1, true, class: "checkbox checkbox--light", data: { action: "bulk-select#deselectAll" } %>
 
@@ -7,8 +7,8 @@
 
   <div class="flex items-center gap-1 text-secondary">
     <%= form_with url: transactions_bulk_deletion_path, data: { turbo_confirm: CustomConfirm.for_resource_deletion("entry").to_data_attribute, turbo_frame: "_top" } do %>
-      <button type="button" data-bulk-select-scope-param="bulk_delete" data-action="bulk-select#submitBulkRequest" class="p-1.5 group hover:bg-inverse flex items-center justify-center rounded-md" title="Delete">
-        <%= icon "trash-2", class: "group-hover:text-inverse" %>
+      <button type="button" data-bulk-select-scope-param="bulk_delete" data-action="bulk-select#submitBulkRequest" class="p-1.5 group/delete hover:bg-inverse flex items-center justify-center rounded-md" title="Delete">
+        <%= icon "trash-2", class: "group-hover/delete:text-inverse" %>
       </button>
     <% end %>
   </div>
diff --git a/app/views/transactions/_selection_bar.html.erb b/app/views/transactions/_selection_bar.html.erb
index 65e2ce12f..1e29c9d65 100644
--- a/app/views/transactions/_selection_bar.html.erb
+++ b/app/views/transactions/_selection_bar.html.erb
@@ -1,6 +1,6 @@
-<div class="fixed bottom-30 md:bottom-6 z-10 flex items-center justify-between rounded-xl bg-gray-900 px-4 text-sm text-white md:w-[420px] w-[90%] py-1.5">
+<div class="fixed bottom-30 md:bottom-6 z-10 flex items-center justify-between rounded-xl bg-surface-inset border-secondary shadow-border-xs px-4 text-sm text-primary md:w-[420px] w-[90%] py-1.5">
   <div class="flex items-center gap-2">
-    <%= check_box_tag "entry_selection", 1, true, class: "checkbox checkbox--dark", data: { action: "bulk-select#deselectAll" } %>
+    <%= check_box_tag "entry_selection", 1, true, class: "checkbox checkbox--light", data: { action: "bulk-select#deselectAll" } %>
 
     <p data-bulk-select-target="selectionBarText"></p>
   </div>
@@ -8,15 +8,15 @@
   <div class="flex items-center gap-1 text-secondary">
     <%= turbo_frame_tag "bulk_transaction_edit_drawer" %>
     <%= link_to new_transactions_bulk_update_path,
-                class: "p-1.5 group hover:bg-inverse flex items-center justify-center rounded-md",
+                class: "p-1.5 group/edit hover:bg-inverse flex items-center justify-center rounded-md",
                 title: "Edit",
                 data: { turbo_frame: "bulk_transaction_edit_drawer" } do %>
-      <%= icon "pencil-line", class: "group-hover:text-inverse" %>
+      <%= icon "pencil-line", class: "group-hover/edit:text-inverse" %>
     <% end %>
 
     <%= form_with url: transactions_bulk_deletion_path, data: { turbo_confirm: true, turbo_frame: "_top" } do %>
-      <button type="button" data-bulk-select-scope-param="bulk_delete" data-action="bulk-select#submitBulkRequest" class="p-1.5 group hover:bg-inverse flex items-center justify-center rounded-md" title="Delete">
-        <%= icon "trash-2", class: "group-hover:text-inverse" %>
+      <button type="button" data-bulk-select-scope-param="bulk_delete" data-action="bulk-select#submitBulkRequest" class="p-1.5 group/delete hover:bg-inverse flex items-center justify-center rounded-md" title="Delete">
+        <%= icon "trash-2", class: "group-hover/delete:text-inverse" %>
       </button>
     <% end %>
   </div>