PB-123 : Change color of hovered feature#639
Conversation
Passing run #663 ↗︎
Details:
Review all test suite changes for PR #639 ↗︎ |
|||||||||||||||
c178ac6 to
043f2e7
Compare
eb5d663 to
2b8bb0c
Compare
f242bfe to
cb519a6
Compare
2b8bb0c to
fcfa473
Compare
ltshb
left a comment
There was a problem hiding this comment.
Code looks good however on the old viewer the feature on the tooltip overlay was also marked with a hover color, this would be also great to have this on the new viewer, not only changing the feature color but also the tooltip color.
That might be challenging with the concept of Infobox. In this regards, I also saw that the Infobox doesn't trigger the hover mechanism, so I have to rethink how I do it. |
fcfa473 to
57a35a3
Compare
a677595 to
17ed9d2
Compare
723c57f to
80c8735
Compare
80c8735 to
e524d2f
Compare
| store.dispatch('setHighlightedFeatureId', { | ||
| featureId: feature?.id, | ||
| dispatcher: 'FeatureList.vue', | ||
| }) | ||
| } | ||
| function clearHighlightedFeature() { | ||
| store.dispatch('setHighlightedFeatureId', { featureId: null, dispatcher: 'FeatureList.vue' }) | ||
| } |
There was a problem hiding this comment.
Based on your comment of #644 I would use highlightedFeatureId instead of featureId
according to Vite documentation and a quick search on this, it is required to have the SCSS file be named .module.scss so that Vite can handle it correctly to pass things to JS
Simplifying a bit style function, as points can also have a fill (it won't change the look and feel) I've used two colors defined in our SCSS as starting point for the highlighting colors, and use a tool that "spread" the colors to chose the two middle points (also making sure it is color blind safe)
instead of adding a border around the feature detail, we now change the whole feature detail's background color to signify it is highlighted
27c4e44 to
4e1be78
Compare
Test link