Some css style not working on UXP plugin

Hi all,

I’m a newbie on UXP plugin creator, I get a trouble when styling the IU:

The node element: “

The text

” not append the style: transform: rotateX(45deg) or rotate property.
I had research and found that css not support:

May anyone get into this issue?
Thank in advance!

We don’t have any information on that yet and CSS transformations are not even on the roadmap.
You could render your text as a SVG and use SVG-transformations to rotate it. Not really a great solution in terms of keeping the text editable, but if you really need rotation I think that’s the only way right now.

1 Like

Great ! I will try it! Thank you

Only 2D positional transforms are currently supported. Everything else depends on a modern compositing engine that we’re currently stalled with (external dependencies getting in the way).

Note that UXP SVG does not support text elements… so you’d have to render the text as a path and rotate it that way.

Can you share more what kind of UI you’re trying to render? That might help us give you options.

1 Like

I can give an example. User enters some text and I want that text displayed on a panel rotated 90 degrees

1 Like

Yes, like Karmalakas said.

I also posted about this a while ago, but no reaction, so I’m not holding my breath. Although this literally blocks adding a feature to my plugin. Currently there’s no way to display text vertically in any way I know of

Yeah, there’s no good way to do that, short of having the text as an SVG path that’s already rotated.

@pkrishna, please add this to our backlog of use cases.

Theoretically it’s possible to create a text layer in Photoshop (with the desired font options), create a work path from it, convert the path to SVG, add the rotation and finally render it on the panel :nerd_face: Not really the most fun workaround I guess :grin:

:exploding_head: I’m definitely not doing that :laughing: Not worth it :slight_smile: