Jaya Krishna Namburu 05ab9cdc81 fix: truncate text for while showing text for padding and margin tokens (#4485)
## Description

fixes #4439 
While displaying tokens in the spacing section, it gets too cluttered if
the css-variable names are long. This PR will truncate text, to make it
less cluttered.
<img width="238" alt="Screenshot 2024-11-30 at 6 09 12 PM"
src="https://github.com/user-attachments/assets/864fdef7-84ae-4f95-8d5d-4a7863da8097">

## Steps for reproduction

- Create a super long css-variable.
- Now, use the variable for padding/margin.


## 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

## Before merging

- [x] tested locally and on preview environment (preview dev login:
0000)
2024-12-03 10:24:13 +05:30
2024-05-28 14:15:55 +03:00
2024-11-19 21:07:55 +03:00
2024-10-22 17:20:47 +03:00
2024-11-26 11:59:07 +07: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%