Custom text shadows misbehaving

Has anyone else tried to use custom text shadows in the Text component? It seems to act very strangely and inconsistently (v3.1.2)

I am trying to add a white shadow effect to title text on a multi-coloured background to make it more legible. The default shadow is black so I changed the shadow colour to white. When the shadow locator is moved the (always dark) shadow animates in the control, but this has no effect on the edit view. If I add another shadow it defaults to black, and even when I change the colour to white the edit view still shows a black shadow (added in edit view but it still doesn’t animate), but preview (in Safari or Chrome) shows the shadows as white!

Adding and deleting shadows seems to change the edit view, but often doesn’t change the browser preview even after a refresh. Changes in the orientation of the shadows don’t always seem to propagate to the preview - that requires a restart of Elements. Colour setting also don’t seem to propagate sometimes - maybe setting changes are not marking the page as changed or sometime not persisting at all?

It’s all a bit random, and also very frustrating! I often can’t reproduce odd behaviour that I’ve just experienced! Even figuring out how the custom text shadow settings work in the first place is trial and error (no documentation help as far as I can see) - aside from the plus button for additional shadows, there is no indication that right-clicking on the resulting “circle” icons allows you to remove and/or change colour. To make matters worse the two numeric fields to the right of the control are missing their “x” and “y” labels (probably obscured by the control).

Sorry, I’m having a little trouble understanding the issue, but… have you tried creating a custom shadow in the Theme Studio like this?

Failing that can you provide a video or a screenshot to help illustrate the issue you’re having and hopefully we’ll be able to get to the bottom of it for you.

Hi @dan I sent steps to reproduce a version of the problem to your Platform Support email, but happy to show you what happens in a video.

This is a custom shadow (or shadows I should say) created directly in the Text component controls. It doesn’t behave the same as the Theme Studio… (which as far as I can tell does what it’s supposed to do). See what you think.

The edit view doesn’t animate (is it supposed to?) but catches up sometimes. The animated shadow colour in the control is always black (unlike the Theme Studio), the X Y labels are hidden and after deleting a shadow the colours get out of alignment in the control - the orange shadow ends up displaying as magenta in the browser preview and missing in the editor view.

Andy

Hi Andy,

Thanks for the video and the steps, that made it really easy to track down. I’ve just fixed the custom text shadow problems, and the fix will be in the next release.

Cheers

Great, thanks :+1: