otion icon indicating copy to clipboard operation
otion copied to clipboard

Keyframe with multiple properties are not inserted correctly

Open wyze opened this issue 3 years ago • 1 comments

Description

keyframes with multiple properties are not inserted correctly.

Reproduction

https://codesandbox.io/s/otion-keyframes-multiple-properties-3d98i

Expected behavior

keyframes should output correct style rules like the following:

@keyframes _1sk3gu2 {0%{margin:5% 0;width:90%}50%{margin:18% 0;width:60%}100%{margin:5% 0;width:90%}}

Actual behavior

keyframes output is the following:

@keyframes _1sk3gu2 {0%{margin:5% 0width:90%}50%{margin:18% 0width:60%}100%{margin:5% 0width:90%}}

Notice the missing semicolons.

Environment

System:

  • OS: macOS 10.15.7
  • CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
  • Memory: 398.66 MB / 16.00 GB
  • Shell: 5.8 - /usr/local/bin/zsh

Binaries:

  • Node: 14.16.1 - ~/.nvm/versions/node/v14.16.1/bin/node
  • Yarn: 1.22.10 - /usr/local/bin/yarn
  • npm: 6.14.12 - ~/.nvm/versions/node/v14.16.1/bin/npm
  • Watchman: 2021.06.07.00 - /usr/local/bin/watchman

Browsers:

  • Chrome: 91.0.4472.106
  • Firefox: 85.0.2
  • Safari: 14.0.1

npmPackages:

  • otion: ^0.6.2 => 0.6.2

wyze avatar Jun 18 '21 18:06 wyze

Just encountered the same bug, what is the reason of this still being open?

phiberber avatar Sep 23 '22 14:09 phiberber