ui-components icon indicating copy to clipboard operation
ui-components copied to clipboard

[Card deck] Original transform value is fully replaced during animation

Open nscyclone opened this issue 6 years ago • 1 comments

Thanks for another cool piece of open-source software!

Description

Changes to the transform CSS property are made with a simple reassignment without taking care of the previous value. This may cause some unexpected side-effects, one of which can already be observed in the component demo.

Steps to reproduce

  1. Visit the component's demo page.
  2. Notice that the top card in the deck is rotated by a random value.
  3. Simply click on that card.
  4. It is not rotated any more, because the whole transform property was replaced by a new value.

A possible solution

In order to make all the transform updates change only the corresponding part a special function should be provided and used instead of direct transform reassignment. Given a set of transform properties it will either insert or update those in the property value string.

I could try to dig deeper and propose a simple RegExp-based solution if you're interested.

nscyclone avatar Nov 29 '17 15:11 nscyclone

@nscyclone if you want you are welcome to create fix for it ! :)

aju avatar Nov 30 '17 07:11 aju