Change ripple color
If you want to change the ripple color of components, you can:
<style scoped lang="stylus"> .q-ripple-animation background red </style>
scopemakes the color change local to this .vue file only, removing
Please note that the ripple takes the color of the text of element you apply it to.
@rstoenescu Thanks for the precision. It looks great in most cases, but it’s good to be able to change it to suit special cases.
Btw is there a way to disable the ripple entirely on a q-btn ?
I ask this because it seems the ripple is somehow affecting its environment: I have a Modal with layout and a few buttons in the footer toolbar, and whenever I click one of those buttons, the content of the modal gets a scrollbar for a fraction of a second. And since it contains a full width google map, it reacts to the resize and I end up with the map having a grey border on right, the size of what used to be a scrollbar. I can refresh the map somehow, but there’s still a flicker visible. Maybe fixing Ripple would be a better idea, but I could not find where the problem comes from. In the meantime, it would be great if I could disable ripple locally (I really dont wanna use plain old buttons, q-btn is too good of a component).
I’ll see what I can do when I get back from vacation. Please remind me then as I might forget.
I’ll log an issue with a cut-n-paste from here so you find it when you get back. Now go, issues can wait .