wip

Author: adrianthedev

app/assets/stylesheets/css/table.css

@@ -39,20 +39,22 @@
   }
 
   &:hover {
-    background: var(--table-row-selected-background);
+    background: var(--color-table-row-hover);
   }
+}
 
-  --table-row-hover-background: var(--color-secondary);
-  --table-row-selected-background: color-mix(in oklab, var(--color-content) 10%, transparent);
+@theme {
+  --color-table-row-selected: var(--color-secondary);
+  --color-table-row-hover: color-mix(in oklab, var(--color-secondary), var(--color-primary) 5%);
 }
 
 .shift-pressed {
   & .highlighted-row {
-    background: var(--table-row-hover-background);
+    background: var(--color-table-row-selected);
   }
 }
 
 .table-row:hover.selected-row,
 .selected-row {
-  background: var(--table-row-selected-background);
+  background: var(--color-table-row-hover);
 }

app/javascript/js/controllers/menu_controller.js

@@ -66,8 +66,9 @@ export default class extends Controller {
     this.enter(this.itemsTarget)
   }
 
-  toggle(element) {
+  async toggle(element) {
     element.toggleAttribute('hidden')
+    await this.animateTransition(element)
   }
 
   async leave(element) {

lib/avo/concerns/row_controls_configuration.rb

@@ -26,14 +26,15 @@ def row_controls_configurations
       end
 
       def row_controls_classes
-        float_classes = "bg-white
-          group-hover:bg-gray-50
+        float_classes = "bg-primary
+          group-hover:bg-table-row-hover
+
           sticky inset-auto end-0
 
           before:content-[''] before:absolute before:z-10 before:inset-auto before:start-0 before:top-0 before:mt-0 before:-translate-x-full before:w-3 before:h-full
           before:bg-gradient-to-r
-          before:from-transparent before:to-white
-          group-hover:before:from-transparent group-hover:before:to-gray-50
+          before:from-transparent before:to-primary
+          group-hover:before:from-transparent group-hover:before:to-table-row-hover
         "
 
         # TODO: add this to the css classes above