search

divriots / story-to-design

Keep your Figma libraries true-to-code in a single click.
https://story.to.design
26 stars 0 forks source link

Problem with importing element with sprite image #177

Open HiddeRpl opened 1 month ago

HiddeRpl commented 1 month ago

Describe the problem

Hello! We are currently at importing our component from storybook to story-to-design and we approach the problem with importing component, where divs are styled with sprite img in png. Images are duplicated (background positions are ignored). When sprite is in svg there is no such a problem. The same - preview of bugged component looks great also.

Bug report identity: Please do not edit

Task path: XMGeK4rNlbbBUgXXZdz5/3jBx6hLh29U5I8fVwOya/14waqbtokjvab

gluck commented 1 month ago

Hi @HiddeRpl

We do compute the tile position correctly, but figma ignores it because we used the TILE scale mode (only CROP supports image translation). If you set background-repeat: no-repeat on your sprites you'll see that the position is correct.

We'll work on improving the logic where we choose between TILE & CROP, while it's a figma limitation that TILE doesn't support translation, I believe that in your case we should go with CROP as the image isn't actually close to repeating in any dimension.

Thanks for the report, I'll keep you updated.