niatalwalkarandOleg Isonen cc20991b08 fix: CSS var() truncation in advanced styles panel (#5378) (#5468) ...

## Description

This PR fixes a UI bug by preserving and displaying the complete CSS
variable (without truncating the second parameter) in both the input
field and the dropdown suggestion list under Display.
Closes #5378

## Steps for reproduction

**Before this fix (current behavior):**
1. Open an existing project or create a new one.
2. Select an element and navigate to **Style → Advanced → + → Add new
CSS Property** and choose `display`.
3. Set `display` to: `var(--anchor-display, none)`.
5. The displayed value is truncated and the `none` appears to be missing
under the Advanced section, even though it’s saved internally.

**After this fix (expected behavior):**
1. Follow the same steps as above.
2. The advanced property and the Display dropdown both consistently show
`var(--anchor-display, none)` without truncation.

## Code Review

- [x] 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:
0000)
- [ ] 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

Co-authored-by: Oleg Isonen <oleg008@gmail.com>

2025-12-03 21:26:55 +01:00

..

builder

fix: CSS var() truncation in advanced styles panel (#5378) (#5468)

2025-12-03 21:26:55 +01:00