From 87da644027bdb5bfc1c078096217a12020ee3ec5 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Thu, 10 Jul 2025 21:52:09 +0300
Subject: [PATCH] style/table collections: add a placeholder style for column
 headers

---
 apps/client/src/stylesheets/table.css | 32 +++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/apps/client/src/stylesheets/table.css b/apps/client/src/stylesheets/table.css
index 36fb68fbf..43ad38883 100644
--- a/apps/client/src/stylesheets/table.css
+++ b/apps/client/src/stylesheets/table.css
@@ -1,4 +1,36 @@
 .tabulator {
+    --col-header-background-color: gray;
+    --col-header-text-color: white;
+    --col-header-hover-background-color: yellow;
+    --col-header-arrow-active-color: blue;
+    --col-header-arrow-inactive-color: white;
+
     background: unset;
     border: unset;
+}
+
+/* Column headers */
+
+.tabulator .tabulator-header {
+    background: var(--col-header-background-color);
+    color: var(--col-header-text-color);
+}
+
+@media (hover: hover) and (pointer: fine) {
+  .tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element:hover {
+    background-color: var(--col-header-hover-background-color);
+  }
+}
+
+.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow {
+    border-bottom-color: var(--col-header-arrow-active-color);
+    border-top-color: var(--col-header-arrow-active-color);
+}
+
+.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="none"] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow {
+    border-bottom-color: var(--col-header-arrow-inactive-color);
+}
+
+.tabulator .tabulator-header .tabulator-col {
+    background: transparent;
 }
\ No newline at end of file