Jaya Krishna Namburu cb73ab65bb experimental: add ui controls for managing perspective-origin from transforms (#3950)
## Description

This PR helps in managing perspective origin which is similar to
transform origin under transform section.

## Steps for reproduction

- Click perspective-origin from the dropdown on transform section.
- Can change the values of x and y axises using the positional grid.
- Can change values of x and y using the individual inputs by
scrub/manually entering/keyboard up&down
- Add values for perspective -origin from the advanced tab and update
those values using the UI controls.
- Reset the property using the label indicator.
Use keywords from the suggestions dropdown for x and y axis like left,
top, center etc.

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [x] made a self-review
- [x] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [x] tested locally and on preview environment (preview dev login:
5de6)
- [x] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file



![perspective-origin](https://github.com/user-attachments/assets/ec9af84d-2e3a-44f9-add7-41d58661cbd5)
2024-08-19 09:37:17 +02:00
2024-05-28 14:15:55 +03:00
2024-05-28 14:15:55 +03:00
2024-08-10 15:00:43 +02:00
2023-09-06 21:43:29 +03:00
2024-02-18 11:36:30 +01:00

builder-screenshot

Webstudio is an Open Source Visual Development Platform for developers, designers, and cross-functional teams. You own the data, components, and infrastructure. You can use the hosted version or roll out your own.


Learning Resources

Social Media

Thanks

Lost Pixel

Thanks to Lost Pixel for providing the visual testing platform that helps us review UI changes and catch visual regressions.

Languages
TypeScript 98.9%
PLpgSQL 0.5%
CSS 0.3%
Shell 0.2%
JavaScript 0.1%