From 991ad70636e35e509e8e415f162aeb2f6fc7ea2f Mon Sep 17 00:00:00 2001
From: traumweh <hello@lyx.sh>
Date: Wed, 9 Apr 2025 12:22:13 +0200
Subject: [PATCH] Fix EditTable styling

---
 css/area_forms.less        | 16 +++++++------
 css/plugins/edittable.less | 47 +++++++++++++++++++++++++++++---------
 2 files changed, 45 insertions(+), 18 deletions(-)

diff --git a/css/area_forms.less b/css/area_forms.less
index 5322d9e..3bb2d30 100644
--- a/css/area_forms.less
+++ b/css/area_forms.less
@@ -157,19 +157,21 @@ button[type=submit],
     cursor: pointer;
     box-shadow: none;
     background-image: none;
-    background-color: @ini_button_background;
-    border: 1px solid @ini_button_background;
-    border-radius: @fix_border-radius;
-    color: @ini_button_color;
+    background-color: var(--color-shade-1);
+    border: solid 0.1rem var(--color-shade-2);
+    border-radius: 0.5rem;
+    color: var(--color-foreground);
     vertical-align: top;
     padding: .3em @grid;
-    transition: @transition background-color, @transition color;
 
     &:hover,
     &:active,
     &:focus {
-        background-color: @ini_button_color;
-        color: @ini_button_background;
+        background-color: transparent;
+        color: var(--color-glow-primary);
+        border-color: var(--color-glow-primary);
+        transition: var(--transition-glow);
+        filter: var(--filter-glow-primary);
     }
 }
 
diff --git a/css/plugins/edittable.less b/css/plugins/edittable.less
index ba833d5..144270b 100644
--- a/css/plugins/edittable.less
+++ b/css/plugins/edittable.less
@@ -4,6 +4,29 @@
 
 /* + + + + +  global  + + + + + */
 #dokuwiki__content.main-content {
+    #edittable__editor {
+        th,
+        .handsontable th {
+            border-color: var(--color-shade-4);
+            background-color: var(--color-shade-1);
+            color: var(--color-foreground);
+
+            &.ht__highlight {
+                background-color: var(--color-shade-2);
+            }
+        }
+
+        td {
+            border-color: var(--color-shade-4);
+            background-color: var(--color-background);
+            color: var(--color-foreground);
+
+            &.current {
+                background-color: var(--color-shade-1);
+            }
+        }
+    }
+
     div.editbutton_table {
         position: relative; // for IE
         float: left;
@@ -13,22 +36,24 @@
             button,
             input.button {
                 min-height: 1rem;
-                background-color: var(--color-background);
-                border-top: solid 1px @ini_button_background;
-                border-color: @ini_border;
-                border-radius: 0 0 @fix_border-radius @fix_border-radius;
-                color: @ini_existing;
+                background-color: var(--color-shade-1);
+                border: solid 0.1em var(--color-shade-2);
+                border-radius: 0.5rem;
+                color: var(--color-foreground);
                 font-size: @font-size-small;
-                margin-top: -1px; // for best position of edit-tab beneath table
-                padding-right: .3em;
-                transition: @transition background-color, @transition border-color, @transition color;
+                margin: 0;
+                margin-top: 0.5rem;
+                padding: 0.2rem 0.4rem;
+                height: auto;
 
                 &:hover,
                 &:focus,
                 &:active {
-                    background-color: @ini_existing;
-                    border-color: @ini_existing;
-                    color: var(--color-background);
+                    background-color: transparent;
+                    color: var(--color-glow-primary);
+                    border-color: var(--color-glow-primary);
+                    transition: var(--transition-glow);
+                    filter: var(--filter-glow-primary);
                 }
             }
         }