re-com icon indicating copy to clipboard operation
re-com copied to clipboard

v-table scrollbar thumb colors are hardcoded (potential PR)

Open ryrobes opened this issue 3 years ago • 0 comments

Hello! Judging by the code comments this appears to have been on the TODO list at some point or at least considered (the comments mention a possible :thumb-style explicitly, so I just followed that lead).

Issue: Using [:parts :simple-wrapper :v-scroll/h-scroll :style] the user can change the background of the v-table scroll bar area, but never the thumb color since they are hardcoded and not accessible via parts.

Solution: Since the thumb color is just background-color of regular a re-com/box I had to create "pseudo css keys" to access and replace the various states of it (default, grab, hover).

Diff compare: https://github.com/day8/re-com/compare/master...ryrobes:re-com:master

  ;; thumb box css map can be accessed via:
   [:parts :simple-wrapper :v-scroll/h-scroll :thumb-style] 

    {:drag-color       "#ffffff"    ;; gets subbed in as background-color for thumb on drag
     :hover-color      "#ffffff99"  ;; gets subbed in as background-color for thumb on hover
     :background-color "#eeeeee"    ;; default thumb color
     ;(plus all regular CSS keys work as intended on the thumb)
     }

This works for my use case, and I can now fully style the v-table scrollbars to match my theme.

Not sure if this warrants a PR, but let me know, I can easily send it - since I feel like the core team would have implemented it differently, but figure I'd give a heads up here if anyone else runs into this issue.

Can be tested out via [org.clojars.ryrobes/re-com "2.13.2-122-d2b8d22-SNAPSHOT"]. Cheers!

ryrobes avatar Dec 09 '22 03:12 ryrobes