Issues with Variable Editor (RTL CSS) and Custom Workspace Data Visualization

lgenach
Tera Contributor

Hi everyone,

 

I'm creating a custom workspace in App Engine Studio and need help with two issues:

1. Variable Editor spacing in RTL languages
In the Requested Item / Catalog Task form, I'm using the Variable Editor formatter with the com_glideapp_servicecatalog_veditor UI Macro.
In RTL languages, when the Variable Editor displays a split layout, there is no spacing between the variables.

When I inspect the page, I see that the component uses only padding-left, so in RTL mode the spacing disappears.

Here’s the confusing part:
I tried to reproduce it in my PDI, but there the spacing looks correct, so I couldn’t take a screenshot of the problematic CSS. This makes me think the issue might be related to:

  • Workspace version differences

  • A different theme - My workspace use Polaris Theme

  • A global CSS override

  • Something specific to my main instance

Because I want the fix to be global (it affects Service Operations Workspace too), how can I override or update the CSS for this formatter in a reliable, upgrade-safe way?

variable editoe english.png

 

In rtl language I don't have the space between the left side variables to right side variables.

 

2. Setting data visualization columns in a custom workspace
On the workspace Landing Page, I want to configure which columns appear in my data visualizations.

My data source is Requested Item and Catalog Task tables. I tried adding columns (including catalog item variables) in the workspace editor, but:

  • When I add or change columns in my custom workspace, it also modifies the data source columns in another workspace using the same data source.

  • I need to configure columns only for my workspace, without affecting others.

  • How can I add catalog item variables as columns in the data visualization?

Any guidance or best practices on handling CSS overrides and workspace-specific data configurations would be greatly appreciated.

 

Thanks!

1 REPLY 1

lgenach
Tera Contributor

Updated question:

I noticed that in the Zurich release the CSS class .sc-section-form-row includes a gap property, but in my instance (Yokohama) this gap doesn’t exist at all.

 

Does anyone know if this spacing change was introduced as part of the Zurich UI/UX updates for Workspace?

And more importantly — what do I need to change or override in Yokohama if I want to match the Zurich behavior?

 

I’m specifically looking for:

 

  • where this new gap comes from (component update? CSS variable?)
  • and the recommended way to reproduce or override it in Workspace.

 

Thanks!